Commit 74ee840c authored by Leo Iannacone's avatar Leo Iannacone

add external lib chartist v0.1.12

parent 08fc3cf5
# EditorConfig helps developers define and maintain consistent
# coding styles between different editors and IDEs
# editorconfig.org
root = true
[*]
# Change these settings to your own preference
indent_style = space
indent_size = 2
# We recommend you to keep these unchanged
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
[*.md]
trim_trailing_whitespace = false
node_modules
sitedist
.tmp
.sass-cache
source/bower_components
{
"node": true,
"browser": true,
"esnext": true,
"bitwise": true,
"camelcase": false,
"curly": true,
"eqeqeq": true,
"immed": true,
"indent": 2,
"latedef": true,
"newcap": false,
"noarg": true,
"quotmark": "single",
"regexp": true,
"undef": true,
"unused": true,
"strict": true,
"trailing": true,
"smarttabs": true,
"globals": {
"angular": false,
"jQuery": false,
"$": false,
"SVG": false,
"Snap": false,
"Foundation": false
}
}
language: node_js
node_js:
- '0.8'
- '0.10'
before_script:
- 'npm install -g bower grunt-cli'
- 'bower install'
# Contributing to chartist-js
- [Issues and Bugs](#issue)
- [Submission Guidelines](#submit)
- [Coding Conventions](#conventions)
## <a name="issue"></a> Found an Issue?
If you find a bug in the source code or a mistake in the documentation, you can help us by
submitting an issue to our [GitHub Repository][github]. Even better you can submit a Pull Request
with a fix.
## How to Run a Local Distribution
1. `cd` into your local copy of the repository.
2. Run `npm install` to install dependencies located in `package.json`.
3. Run `bower update` to install bower dependencies.
5. Run `grunt serve` to start the watch task, and the web server should automatically open. Congrats, you should now be able to see your local copy of the demo site.
## <a name="submit"></a> Submission Guidelines
If you are creating a Pull Request, fork the repository and make any changes on the `develop` branch.
### <a name="conventions"></a> Conventions
Check out the [Coding Style document](CODINGSTYLE.md)
### Grunt
We have three grunt tasks:
1. `grunt build` - Creates the distribution of the example / demo site which is used as visual development help of the charts but also serves as the documentation site / gh-pages.
2. `grunt serve` - Starts watch with livereload that is executing the same things as the site dist default task but for live development.
3. `grunt test` - Executes jasmine tests separately, although we have a very big lack of tests.
4. `grunt serve:dist` - Executes a dist and serves the directory statically in order to serve with the production example / demo site.
`libdist` should **not** be included in any Pull Requests. So please ensure that code is not being committed as part of the Pull Request.
### Documentation
- Everything is already in place and in the `sitedist` there is a `apidoc` folder generated by [doxication](https://github.com/gionkunz/grunt-doxication) generator that uses JSDoc like comments to generate documentation meta files. Always use proper JSDoc comments when documenting methods and API interfaces. Also assign documentation blocks using @memberof to the virtual module they belong to.
- The site documentation is built with [Assemble.io](http://assemble.io/). Generally a component based approach should be followed where there are already Handlebar partials / helpers in order to create whole sites based on components that can be specified by type and with their data in yaml files.
### Important missing stuff
1. Jasmine Tests!
2. Documentation: JSDoc, Getting started documentation and landing page
3. Better accessibility using ARIA and other optimizations
4. Better interfaces to the library (i.e. jQuery with data-* attributes for configuration), Angular.js directive etc.
5. Richer SASS / CSS framework
6. Other charts types (spider etc.)
DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
Version 2, December 2004
Copyright (C) 2004 Sam Hocevar <sam@hocevar.net>
Everyone is permitted to copy and distribute verbatim or modified
copies of this license document, and changing it is allowed as long
as the name is changed.
DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION
0. You just DO WHAT THE FUCK YOU WANT TO.
# Big welcome by the Chartist Guy
![The Chartist Guy](https://raw.github.com/gionkunz/chartist-js/develop/source/images/chartist-guy.gif "The Chartist Guy")
*Checkout the documentation site at http://gionkunz.github.io/chartist-js/*
*Checkout this lightening talk that gives you an overview of Chartist in 5 minutes https://www.youtube.com/watch?v=WdYzPhOB_c8*
Chartist.js is a simple responsive charting library built with SVG. There are hundreds of nice charting libraries already
out there, but they are either:
* not responsive
* use the wrong technologies for illustration (canvas)
* are not flexible enough while keeping the configuration simple
* are not friendly to your own code
* are not friendly to designers
* have unnecessary dependencies to monolithic libraries
* more annoying things
That's why we have started Chartist.js and our goal is to solve all of the above issues.
## What is it made for?
Chartist's goal is to provide a simple, lightweight and non-intrusive library to responsive craft charts on your website.
It's important to understand that one of the main intentions of Chartist.js is to rely on standards rather than providing
a own solution to the problem which is is already solved by the standard. We need to leverage the power of the browsers
today and say good bye to the idea of solving all problems ourselves.
Chartist works with inline-SVG and therefore leverages the power of the DOM to provide parts of its functionality. This
also means that Chartist is not providing it's own event handling, labels, behaviors and anything else that can just be
done with plain HTML, JavaScript and CSS. The single and only responsibility of Chartist is to help you drawing "Simple
responsive Charts" using inline-SVG in the DOM, CSS to style and JavaScript to provide an API for configuring your charts.
## Example site
You can visit this Site http://gionkunz.github.io/chartist-js/ which is in fact a build of the current project.
We are still developing and constantly add features but you can already use Chartist.js in your projects as we have
reached a stable and reliable state already.
## Version notes
We are currently still heavily developing in order to make Chartist.js better. Your help is needed! Please contribute
to the project if you like the idea and the concept and help us to bring nice looking responsive open-source charts
to the masses.
### Important missing stuff
1. Jasmine Tests!
2. Documentation: JSDoc, Getting started documentation and landing page
3. Better accessibility using ARIA and other optimizations
4. Better interfaces to the library (i.e. jQuery with data-* attributes for configuration), Angular.js directive etc.
5. Richer SASS / CSS framework
6. Other charts types (spider etc.)
## Contribution
We are looking for people who share the idea of having a simple, flexible charting library that is responsive and uses
modern and future prove technologies. The goal of this project is to create a responsive charting library where developers
have their joy in using it and designers love it because of the designing flexibility they have.
Contribute if you like the Chartist Guy!
{
"name": "chartist",
"version": "0.1.12",
"main": [
"./libdist/chartist.min.js",
"./libdist/chartist.min.css"
],
"devDependencies": {
"snap.svg": "~0.2.0",
"json3": "~3.2.6",
"es5-shim": "~2.1.0",
"foundation": "~5.1.1",
"highlightjs": "~8.0.0",
"compass-mixins": "~1.0.0",
"codemirror": "~4.5.0",
"base64": "~0.3.0"
},
"ignore": [
".*",
"Gruntfile.js",
"package.json",
"node_modules",
"sitedist",
"source",
"test"
]
}
DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
Version 2, December 2004
Copyright (C) 2004 Sam Hocevar <sam@hocevar.net>
Everyone is permitted to copy and distribute verbatim or modified
copies of this license document, and changing it is allowed as long
as the name is changed.
DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE
TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION
0. You just DO WHAT THE FUCK YOU WANT TO.
/* Chartist.js 0.1.12
* Copyright © 2014 Gion Kunz
* Free to use under the WTFPL license.
* http://www.wtfpl.net/
*/
.ct-chart .ct-label{fill:rgba(0,0,0,.4);font-size:.75rem}.ct-chart .ct-grid{stroke:rgba(0,0,0,.2);stroke-width:1px;stroke-dasharray:2px}.ct-chart .ct-point{stroke-width:10px;stroke-linecap:round}.ct-chart .ct-line{fill:none;stroke-width:4px}.ct-chart .ct-bar{fill:none;stroke-width:10px}.ct-chart .ct-slice.ct-donut{fill:none;stroke-width:60px}.ct-chart .ct-series.ct-series-a .ct-bar,.ct-chart .ct-series.ct-series-a .ct-line,.ct-chart .ct-series.ct-series-a .ct-point,.ct-chart .ct-series.ct-series-a .ct-slice.ct-donut{stroke:#d70206}.ct-chart .ct-series.ct-series-a .ct-slice:not(.ct-donut){fill:#d70206}.ct-chart .ct-series.ct-series-b .ct-bar,.ct-chart .ct-series.ct-series-b .ct-line,.ct-chart .ct-series.ct-series-b .ct-point,.ct-chart .ct-series.ct-series-b .ct-slice.ct-donut{stroke:#F05B4F}.ct-chart .ct-series.ct-series-b .ct-slice:not(.ct-donut){fill:#F05B4F}.ct-chart .ct-series.ct-series-c .ct-bar,.ct-chart .ct-series.ct-series-c .ct-line,.ct-chart .ct-series.ct-series-c .ct-point,.ct-chart .ct-series.ct-series-c .ct-slice.ct-donut{stroke:#F4C63D}.ct-chart .ct-series.ct-series-c .ct-slice:not(.ct-donut){fill:#F4C63D}.ct-chart .ct-series.ct-series-d .ct-bar,.ct-chart .ct-series.ct-series-d .ct-line,.ct-chart .ct-series.ct-series-d .ct-point,.ct-chart .ct-series.ct-series-d .ct-slice.ct-donut{stroke:#453D3F}.ct-chart .ct-series.ct-series-d .ct-slice:not(.ct-donut){fill:#453D3F}.ct-chart.ct-square{display:block;position:relative;width:100%}.ct-chart.ct-square:before{display:block;float:left;content:"";width:0;height:0;padding-bottom:100%}.ct-chart.ct-square:after{content:"";display:table;clear:both}.ct-chart.ct-square>svg{display:block;position:absolute;top:0;left:0;width:100%;height:100%}.ct-chart.ct-minor-second{display:block;position:relative;width:100%}.ct-chart.ct-minor-second:before{display:block;float:left;content:"";width:0;height:0;padding-bottom:93.75%}.ct-chart.ct-minor-second:after{content:"";display:table;clear:both}.ct-chart.ct-minor-second>svg{display:block;position:absolute;top:0;left:0;width:100%;height:100%}.ct-chart.ct-major-second{display:block;position:relative;width:100%}.ct-chart.ct-major-second:before{display:block;float:left;content:"";width:0;height:0;padding-bottom:88.88889%}.ct-chart.ct-major-second:after{content:"";display:table;clear:both}.ct-chart.ct-major-second>svg{display:block;position:absolute;top:0;left:0;width:100%;height:100%}.ct-chart.ct-minor-third{display:block;position:relative;width:100%}.ct-chart.ct-minor-third:before{display:block;float:left;content:"";width:0;height:0;padding-bottom:83.33333%}.ct-chart.ct-minor-third:after{content:"";display:table;clear:both}.ct-chart.ct-minor-third>svg{display:block;position:absolute;top:0;left:0;width:100%;height:100%}.ct-chart.ct-major-third{display:block;position:relative;width:100%}.ct-chart.ct-major-third:before{display:block;float:left;content:"";width:0;height:0;padding-bottom:80%}.ct-chart.ct-major-third:after{content:"";display:table;clear:both}.ct-chart.ct-major-third>svg{display:block;position:absolute;top:0;left:0;width:100%;height:100%}.ct-chart.ct-perfect-fourth{display:block;position:relative;width:100%}.ct-chart.ct-perfect-fourth:before{display:block;float:left;content:"";width:0;height:0;padding-bottom:75%}.ct-chart.ct-perfect-fourth:after{content:"";display:table;clear:both}.ct-chart.ct-perfect-fourth>svg{display:block;position:absolute;top:0;left:0;width:100%;height:100%}.ct-chart.ct-perfect-fifth{display:block;position:relative;width:100%}.ct-chart.ct-perfect-fifth:before{display:block;float:left;content:"";width:0;height:0;padding-bottom:66.66667%}.ct-chart.ct-perfect-fifth:after{content:"";display:table;clear:both}.ct-chart.ct-perfect-fifth>svg{display:block;position:absolute;top:0;left:0;width:100%;height:100%}.ct-chart.ct-minor-sixth{display:block;position:relative;width:100%}.ct-chart.ct-minor-sixth:before{display:block;float:left;content:"";width:0;height:0;padding-bottom:62.5%}.ct-chart.ct-minor-sixth:after{content:"";display:table;clear:both}.ct-chart.ct-minor-sixth>svg{display:block;position:absolute;top:0;left:0;width:100%;height:100%}.ct-chart.ct-golden-section{display:block;position:relative;width:100%}.ct-chart.ct-golden-section:before{display:block;float:left;content:"";width:0;height:0;padding-bottom:61.8047%}.ct-chart.ct-golden-section:after{content:"";display:table;clear:both}.ct-chart.ct-golden-section>svg{display:block;position:absolute;top:0;left:0;width:100%;height:100%}.ct-chart.ct-major-sixth{display:block;position:relative;width:100%}.ct-chart.ct-major-sixth:before{display:block;float:left;content:"";width:0;height:0;padding-bottom:60%}.ct-chart.ct-major-sixth:after{content:"";display:table;clear:both}.ct-chart.ct-major-sixth>svg{display:block;position:absolute;top:0;left:0;width:100%;height:100%}.ct-chart.ct-minor-seventh{display:block;position:relative;width:100%}.ct-chart.ct-minor-seventh:before{display:block;float:left;content:"";width:0;height:0;padding-bottom:56.25%}.ct-chart.ct-minor-seventh:after{content:"";display:table;clear:both}.ct-chart.ct-minor-seventh>svg{display:block;position:absolute;top:0;left:0;width:100%;height:100%}.ct-chart.ct-major-seventh{display:block;position:relative;width:100%}.ct-chart.ct-major-seventh:before{display:block;float:left;content:"";width:0;height:0;padding-bottom:53.33333%}.ct-chart.ct-major-seventh:after{content:"";display:table;clear:both}.ct-chart.ct-major-seventh>svg{display:block;position:absolute;top:0;left:0;width:100%;height:100%}.ct-chart.ct-octave{display:block;position:relative;width:100%}.ct-chart.ct-octave:before{display:block;float:left;content:"";width:0;height:0;padding-bottom:50%}.ct-chart.ct-octave:after{content:"";display:table;clear:both}.ct-chart.ct-octave>svg{display:block;position:absolute;top:0;left:0;width:100%;height:100%}.ct-chart.ct-major-tenth{display:block;position:relative;width:100%}.ct-chart.ct-major-tenth:before{display:block;float:left;content:"";width:0;height:0;padding-bottom:40%}.ct-chart.ct-major-tenth:after{content:"";display:table;clear:both}.ct-chart.ct-major-tenth>svg{display:block;position:absolute;top:0;left:0;width:100%;height:100%}.ct-chart.ct-major-eleventh{display:block;position:relative;width:100%}.ct-chart.ct-major-eleventh:before{display:block;float:left;content:"";width:0;height:0;padding-bottom:37.5%}.ct-chart.ct-major-eleventh:after{content:"";display:table;clear:both}.ct-chart.ct-major-eleventh>svg{display:block;position:absolute;top:0;left:0;width:100%;height:100%}.ct-chart.ct-major-twelfth{display:block;position:relative;width:100%}.ct-chart.ct-major-twelfth:before{display:block;float:left;content:"";width:0;height:0;padding-bottom:33.33333%}.ct-chart.ct-major-twelfth:after{content:"";display:table;clear:both}.ct-chart.ct-major-twelfth>svg{display:block;position:absolute;top:0;left:0;width:100%;height:100%}.ct-chart.ct-double-octave{display:block;position:relative;width:100%}.ct-chart.ct-double-octave:before{display:block;float:left;content:"";width:0;height:0;padding-bottom:25%}.ct-chart.ct-double-octave:after{content:"";display:table;clear:both}.ct-chart.ct-double-octave>svg{display:block;position:absolute;top:0;left:0;width:100%;height:100%}
\ No newline at end of file
@import "modules/common";
@import "modules/scale";
@import "modules/animation";
@import "modules";
@import "settings/chartist-settings";
@mixin ct-responsive-svg-container($width: 100%, $ratio: $ct-container-ratio) {
display: block;
position: relative;
width: $width;
&:before {
display: block;
float: left;
content: "";
width: 0;
height: 0;
padding-bottom: $ratio * 100%;
}
&:after {
content: "";
display: table;
clear: both;
}
> svg {
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
}
@mixin ct-chart-label($ct-text-color: $ct-text-color, $ct-text-size: $ct-text-size) {
fill: $ct-text-color;
font-size: $ct-text-size;
}
@mixin ct-chart-grid($ct-grid-color: $ct-grid-color, $ct-grid-width: $ct-grid-width, $ct-grid-dasharray: $ct-grid-dasharray) {
stroke: $ct-grid-color;
stroke-width: $ct-grid-width;
@if ($ct-grid-dasharray) {
stroke-dasharray: $ct-grid-dasharray;
}
}
@mixin ct-chart-point($ct-point-size: $ct-point-size, $ct-point-shape: $ct-point-shape) {
stroke-width: $ct-point-size;
stroke-linecap: $ct-point-shape;
}
@mixin ct-chart-line($ct-line-width: $ct-line-width, $ct-line-dasharray: $ct-line-dasharray) {
fill: none;
stroke-width: $ct-line-width;
@if ($ct-line-dasharray) {
stroke-dasharray: $ct-line-dasharray;
}
}
@mixin ct-chart-bar($ct-bar-width: $ct-bar-width) {
fill: none;
stroke-width: $ct-bar-width;
}
@mixin ct-chart-donut($ct-donut-width: $ct-donut-width) {
fill: none;
stroke-width: $ct-donut-width;
}
@mixin ct-chart-series-color($color) {
.#{$ct-class-point}, .#{$ct-class-line}, .#{$ct-class-bar}, .#{$ct-class-slice}.#{$ct-class-donut} {
stroke: $color;
}
.#{$ct-class-slice}:not(.#{$ct-class-donut}) {
fill: $color;
}
}
@mixin ct-chart($ct-container-ratio: $ct-container-ratio, $ct-text-color: $ct-text-color, $ct-text-size: $ct-text-size, $ct-grid-color: $ct-grid-color, $ct-grid-width: $ct-grid-width, $ct-grid-dasharray: $ct-grid-dasharray, $ct-point-size: $ct-point-size, $ct-point-shape: $ct-point-shape, $ct-line-width: $ct-line-width, $ct-bar-width: $ct-bar-width, $ct-donut-width: $ct-donut-width, $ct-series-names: $ct-series-names, $ct-series-colors: $ct-series-colors) {
.#{$ct-class-label} {
@include ct-chart-label($ct-text-color, $ct-text-size);
}
.#{$ct-class-grid} {
@include ct-chart-grid($ct-grid-color, $ct-grid-width, $ct-grid-dasharray);
}
.#{$ct-class-point} {
@include ct-chart-point($ct-point-size, $ct-point-shape);
}
.#{$ct-class-line} {
@include ct-chart-line($ct-line-width);
}
.#{$ct-class-bar} {
@include ct-chart-bar($ct-bar-width);
}
.#{$ct-class-slice}.#{$ct-class-donut} {
@include ct-chart-donut($ct-donut-width);
}
@if $ct-include-colored-series {
.#{$ct-class-series} {
@for $i from 0 to length($ct-series-names) {
&.#{$ct-class-series}-#{nth($ct-series-names, $i + 1)} {
$color: nth($ct-series-colors, $i + 1);
@include ct-chart-series-color($color);
}
}
}
}
}
@if $ct-include-classes {
.#{$ct-class-chart} {
@include ct-chart();
@if $ct-include-alternative-responsive-containers {
@for $i from 0 to length($ct-scales-names) {
&.#{nth($ct-scales-names, $i + 1)} {
@include ct-responsive-svg-container($ratio: nth($ct-scales, $i + 1));
}
}
}
}
}
\ No newline at end of file
@mixin keyframes($name) {
@-webkit-keyframes #{$name} {
@content;
}
@-moz-keyframes #{$name} {
@content;
}
@-ms-keyframes #{$name} {
@content;
}
@keyframes #{$name} {
@content;
}
}
@mixin animation($name, $params) {
-webkit-animation: #{$name} $params; /* Safari 4+ */
-moz-animation: #{$name} $params; /* Fx 5+ */
-o-animation: #{$name} $params; /* Opera 12+ */
animation: #{$name} $params; /* IE 10+ */
}
\ No newline at end of file
@function reverse($list, $recursive: false) {
$result: ();
@for $i from length($list)*-1 through -1 {
@if type-of(nth($list, abs($i))) == list and $recursive {
$result: append($result, reverse(nth($list, abs($i)), $recursive));
}
@else {
$result: append($result, nth($list, abs($i)));
}
}
@return $result;
}
\ No newline at end of file
$scale-minor-second: 15/16;
$scale-major-second: 8/9;
$scale-minor-third: 5/6;
$scale-major-third: 4/5;
$scale-perfect-fourth: 3/4;
$scale-perfect-fifth: 2/3;
$scale-minor-sixth: 5/8;
$scale-golden-section: 1/1.618;
$scale-major-sixth: 3/5;
$scale-minor-seventh: 9/16;
$scale-major-seventh: 8/15;
$scale-octave: 1/2;
$scale-major-tenth: 2/5;
$scale-major-eleventh: 3/8;
$scale-major-twelfth: 1/3;
$scale-double-octave: 1/4;
@function generateScale($base: 16, $scale-type: $scale-golden-section, $limit-lower: 6, $limit-upper: 100) {
$scale: ();
$value: $base;
@while $value > $limit-lower {
$value: $value * $scale-type;
@if $value > $limit-lower {
$scale: append($scale, $value);
}
}
$scale: reverse($scale);
$scale: append($scale, $base);
$value: $base;
@while $value < $limit-upper {
$value: $value / $scale-type;
@if $value < $limit-upper {
$scale: append($scale, $value);
}
}
@return $scale;
}
\ No newline at end of file
// Scales for responsive SVG containers
$ct-scales: ((1), (15/16), (8/9), (5/6), (4/5), (3/4), (2/3), (5/8), (1/1.618), (3/5), (9/16), (8/15), (1/2), (2/5), (3/8), (1/3), (1/4)) !default;
$ct-scales-names: (ct-square, ct-minor-second, ct-major-second, ct-minor-third, ct-major-third, ct-perfect-fourth, ct-perfect-fifth, ct-minor-sixth, ct-golden-section, ct-major-sixth, ct-minor-seventh, ct-major-seventh, ct-octave, ct-major-tenth, ct-major-eleventh, ct-major-twelfth, ct-double-octave) !default;
// Class names to be used when generating CSS
$ct-class-chart: ct-chart !default;
$ct-class-chart-line: ct-chart-line !default;
$ct-class-chart-bar: ct-chart-bar !default;
$ct-class-chart-pie: ct-chart-pie !default;
$ct-class-label: ct-label !default;
$ct-class-series: ct-series !default;
$ct-class-line: ct-line !default;
$ct-class-point: ct-point !default;
$ct-class-bar: ct-bar !default;
$ct-class-slice: ct-slice !default;
$ct-class-donut: ct-donut !default;
$ct-class-grid: ct-grid !default;
$ct-class-vertical: ct-vertical !default;
$ct-class-horizontal: ct-horizontal !default;
// Container ratio
$ct-container-ratio: (1/1.618) !default;
// Text styles for labels
$ct-text-color: rgba(0, 0, 0, 0.4) !default;
$ct-text-size: 0.75rem !default;
// Grid styles
$ct-grid-color: rgba(0, 0, 0, 0.2) !default;
$ct-grid-dasharray: 2px !default;
$ct-grid-width: 1px !default;
// Line chart properties
$ct-line-width: 4px !default;
$ct-line-dasharray: false !default;
$ct-point-size: 10px !default;
// Line chart point, can be either round or square
$ct-point-shape: round !default;
// Bar chart bar width
$ct-bar-width: 10px !default;
// Donut width (If donut width is to big it can cause issues where the shape gets distorted)
$ct-donut-width: 60px !default;
// If set to true it will include the default classes and generate CSS output. If you're planning to use the mixins you
// should set this property to false
$ct-include-classes: true !default;
// If this is set to true the CSS will contain colored series. You can extend or change the color with the
// properties below
$ct-include-colored-series: $ct-include-classes !default;
// If set to true this will include all responsive container variations using the scales defined at the top of the script
$ct-include-alternative-responsive-containers: $ct-include-classes !default;
// Series names and colors. This can be extended or customized as desired. Just add more series and colors.
$ct-series-names: (a, b, c, d) !default;
$ct-series-colors: (#d70206, #F05B4F, #F4C63D, #453D3F) !default;
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 32 32" enable-background="new 0 0 32 32" xml:space="preserve">
<g id="head">
<g>
<path fill="#75543B" d="M13.8,20.6c0,0,1.6,5-3.9,5l4.9,1.5l4-4.2L13.8,20.6z"/>
<path fill="#B24949" d="M17.1,25c0,0-4.1-1.5-5.9,1.1l3.7,0.9L17.1,25z"/>
</g>
<g>
<path fill="#D39C76" d="M9.9,25.4c2.1,1.1,5,0.6,6,0c1.5-0.8,1.5-3,1.1-3.2c-0.2-0.1-2.2,1.3-5.9,0.1l0.4-3.3l-5.9-0.2L9.7,8.4
c0,0,7-2.9,14,0v10.6c0.4-0.1,0.8-0.2,1.1,0c0.9,0.3,1.1,1.4,0.6,2.5c-0.4,0.7-1,1.3-1.7,1.4v6.2c0,0-7.2,4.8-15.1,2.1
c0,0-2.5-0.8-2.3-3.4C6.3,27.6,6.1,25.9,9.9,25.4z"/>
</g>
<g>
<path fill="#634128" d="M15.1,14.4c0,0.5,0.9,1,1.9,1c1.1,0,1.9-0.4,1.9-1c0-0.5-0.9-1-1.9-1C16,13.4,15.1,13.9,15.1,14.4z"/>
<path fill="#634128" d="M9.7,14.4c0,0.5,0.8,1,1.9,1c1,0,1.9-0.4,1.9-1s-0.8-1-1.9-1C10.5,13.5,9.7,13.9,9.7,14.4z"/>
</g>
<g>
<path fill="#231F20" d="M23.8,10.5C23.8,10.5,23.8,10.5,23.8,10.5c0-1.5,0-3.3,0-4.5c0.1-3.6,1.4-5.1,0.4-5.3
c-1-0.2-3.2-0.6-7.8-0.6c-4.1,0-7.2,0.5-8.2,0.6C7.3,1,9,3.9,9.3,6c0.1,1,0.1,2.5,0.1,3.8c-3.3,0.5-5.3,1.7-5.7,2.8h26.6
C30.3,12.6,30,11.5,23.8,10.5z"/>
</g>
<path fill="#353433" d="M12.8,22.4c3.1,2.8,10.4,2.3,10.9-2.1c0.1-1.3-0.5-0.3-1.1,0.1c-0.9,0.6-2.5,0.6-3.4,0
c-1.5-1-4.1-4.1-6.4-1.8c-2.4-2.3-5,0.8-6.5,1.8c-0.9,0.6-2.6,0.6-3.5,0c-0.6-0.4-1.2-1.3-1.1-0.1C2.2,24.7,9.6,25.2,12.8,22.4z"/>
</g>
</svg>
<svg xmlns:ct="http://gionkunz.github.com/chartist-js/ct" width="100%" height="100%" class="ct-chart-line"><g><text dx="45" class="ct-label ct-horizontal" dy="459">1</text><text dx="162" class="ct-label ct-horizontal" dy="459">2</text><text dx="279" class="ct-label ct-horizontal" dy="459">3</text><text dx="396" class="ct-label ct-horizontal" dy="459">4</text><text dx="513" class="ct-label ct-horizontal" dy="459">5</text><text dx="630" class="ct-label ct-horizontal" dy="459">6</text><text dx="28" dy="433" text-anchor="end" class="ct-label ct-vertical">0</text><text dx="28" dy="371.57142857142856" text-anchor="end" class="ct-label ct-vertical">2.5</text><text dx="28" dy="310.1428571428571" text-anchor="end" class="ct-label ct-vertical">5</text><text dx="28" dy="248.71428571428572" text-anchor="end" class="ct-label ct-vertical">7.5</text><text dx="28" dy="187.28571428571428" text-anchor="end" class="ct-label ct-vertical">10</text><text dx="28" dy="125.85714285714283" text-anchor="end" class="ct-label ct-vertical">12.5</text><text dx="28" dy="64.42857142857144" text-anchor="end" class="ct-label ct-vertical">15</text></g><g><line x1="43" y1="435" x2="43" y2="5" class="ct-grid ct-horizontal"></line><line x1="160" y1="435" x2="160" y2="5" class="ct-grid ct-horizontal"></line><line x1="277" y1="435" x2="277" y2="5" class="ct-grid ct-horizontal"></line><line x1="394" y1="435" x2="394" y2="5" class="ct-grid ct-horizontal"></line><line x1="511" y1="435" x2="511" y2="5" class="ct-grid ct-horizontal"></line><line x1="628" y1="435" x2="628" y2="5" class="ct-grid ct-horizontal"></line><line x1="43" y1="435" x2="745" y2="435" class="ct-grid ct-vertical"></line><line x1="43" y1="373.57142857142856" x2="745" y2="373.57142857142856" class="ct-grid ct-vertical"></line><line x1="43" y1="312.1428571428571" x2="745" y2="312.1428571428571" class="ct-grid ct-vertical"></line><line x1="43" y1="250.71428571428572" x2="745" y2="250.71428571428572" class="ct-grid ct-vertical"></line><line x1="43" y1="189.28571428571428" x2="745" y2="189.28571428571428" class="ct-grid ct-vertical"></line><line x1="43" y1="127.85714285714283" x2="745" y2="127.85714285714283" class="ct-grid ct-vertical"></line><line x1="43" y1="66.42857142857144" x2="745" y2="66.42857142857144" class="ct-grid ct-vertical"></line></g><g ct:series-name="Fibonacci sequence" class="ct-series ct-series-a"><path d="M43,410.42857142857144 C62.5,406.33333333333326,121,394.04761904761904,160,385.85714285714283C199,377.6666666666666,238,373.5714285714286,277,361.2857142857143C316,349,355,332.6190476190476,394,312.1428571428571C433,291.66666666666663,472,271.19047619047615,511,238.42857142857142C550,205.66666666666666,608.5,136.04761904761904,628,115.57142857142856" class="ct-line" ct:values="1,2,3,5,8,13"></path><line x1="43" y1="410.42857142857144" x2="43.01" y2="410.42857142857144" class="ct-point" ct:value="1"></line><line x1="160" y1="385.85714285714283" x2="160.01" y2="385.85714285714283" class="ct-point" ct:value="2"></line><line x1="277" y1="361.2857142857143" x2="277.01" y2="361.2857142857143" class="ct-point" ct:value="3"></line><line x1="394" y1="312.1428571428571" x2="394.01" y2="312.1428571428571" class="ct-point" ct:value="5"></line><line x1="511" y1="238.42857142857142" x2="511.01" y2="238.42857142857142" class="ct-point" ct:value="8"></line><line x1="628" y1="115.57142857142856" x2="628.01" y2="115.57142857142856" class="ct-point" ct:value="13"></line></g><g ct:series-name="Golden section" class="ct-series ct-series-b"><path d="M43,410.42857142857144 C62.5,407.89771428571424,121,401.86952380952386,160,395.2434285714286C199,388.61733333333336,238,381.3933333333334,277,370.672C316,359.9506666666667,355,348.2628571428572,394,330.9154285714286C433,313.56800000000004,472,294.6561904761904,511,266.5874285714285C550,238.51866666666663,608.5,179.85028571428572,628,162.50285714285718" class="ct-line" ct:values="1,1.618,2.618,4.236,6.854,11.09"></path><line x1="43" y1="410.42857142857144" x2="43.01" y2="410.42857142857144" class="ct-point" ct:value="1"></line><line x1="160" y1="395.2434285714286" x2="160.01" y2="395.2434285714286" class="ct-point" ct:value="1.618"></line><line x1="277" y1="370.672" x2="277.01" y2="370.672" class="ct-point" ct:value="2.618" style="stroke-width: 50px;"></line><line x1="394" y1="330.9154285714286" x2="394.01" y2="330.9154285714286" class="ct-point" ct:value="4.236"></line><line x1="511" y1="266.5874285714285" x2="511.01" y2="266.5874285714285" class="ct-point" ct:value="6.854"></line><line x1="628" y1="162.50285714285718" x2="628.01" y2="162.50285714285718" class="ct-point" ct:value="11.09"></line></g></svg>
\ No newline at end of file
---
layout: content
page-class: api-documentation
title: Chartist - API Documentation
description: Detailed documentation of the Chartist.js code and API
---
{{#each (doxTransform apidox)}}
{{>dox-section}}
{{/each}}
\ No newline at end of file
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment