Better guidelines for implementation required

[aligajani]

Awesome library, but needs better guidelines, demos, examples for implementation.

Also, I am unable to make this work in my webpage, even though I've a div with the class setup.

<script> var data = { labels: ['Jan', 'Feb', 'Mar', 'Apr', 'Mai', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], series: [ [5, 4, 3, 7, 5, 10, 3, 4, 8, 10, 6, 8], [3, 2, 9, 5, 4, 6, 4, 6, 7, 8, 7, 4] ] }; var options = { seriesBarDistance: 15 }; // You can define a responsive settings array that consists of settings arrays containing a media query as first element followed by a regular Chartist.js settings object. We recommend that you store your media queries somewhere centrally and use them wherever required. var responsiveOptions = [ // The first responsive setting is for medium / large media only ['screen and (min-width: 641px) and (max-width: 1024px)', { seriesBarDistance: 10, axisX: { labelInterpolationFnc: function (value) { return value; } } }], // These settings will only be applied to small media ['screen and (max-width: 640px)', { seriesBarDistance: 5, axisX: { labelInterpolationFnc: function (value) { return value[0]; } } }] ]; // In addition to the regular options we pass in our responsive options array as 4th parameter Chartist.Bar('.ct-chart', data, options, responsiveOptions); </script>

[gionkunz]

Thanks for the feedback! Youre absosutely right and this is one of the first feedback i receive so beofre that i was just trying to imagine what needs to be documented and what not :-) I guess youve missed to add a responsive container class or specify specific with and height? You can go either way. Setting a width and height property in the options is simple but this will not be responsive. Using responsive containers (where there is a lack of documentation I agree) are nicer. Just use the container classes ct-chart and ct-golden-section on the container together for example. Or use one of the other responsive container classes like ct-perfect-fourth (4:3) or ct-perfect-fifth (3:2) in order to assign a fixed ratio to your chart that is responsive. Also take a look at the sass file to see how this gets generated and how easy it is to extend.

Ill mark this task as feature request and will start a documentation topic that is only covering this.

Cheers

[gionkunz]

Hi there please check the update getting started section and tell me if it's more clear to you now:

http://gionkunz.github.io/chartist-js/getting-started.html#as-simple-as-it-can-get

Thanks for your feedback!

[aligajani]

I ended up using Highcharts but I'll write a tutorial on Chartist once I
get it running. I was thinking it would be nice to have a standalone demo
page for the bar chart for instance so users can see the page source code
and see how it is setup. The problem I had was that even with setting up of
JS and HTML right the chart never showed up. I used the code from you
snippets provided.

On Saturday, August 30, 2014, Gion Kunz notifications@github.com wrote:

Hi there please check the update getting started section and tell me if
it's more clear to you now:

http://gionkunz.github.io/chartist-js/getting-started.html#as-simple-as-it-can-get

Thanks for your feedback!

—
Reply to this email directly or view it on GitHub
gionkunz/chartist-js#6 (comment).

Ali Gajani
Founder at Mr. Geek
www.mrgeek.me
www.aligajani.com

[gionkunz]

Hi,

It would be nice which snippet you've tried to get working. Can you do a JSBIN? Chartist is available on jsdelivr http://www.jsdelivr.com/#!chartist.js

[aligajani]

Can you make fiddle for the bar chart ?

On Saturday, August 30, 2014, Gion Kunz notifications@github.com wrote:

Hi,

It would be nice which snippet you've tried to get working. Can you do a
JSBIN? Chartist is available on jsdelivr
http://www.jsdelivr.com/#!chartist.js

—
Reply to this email directly or view it on GitHub
gionkunz/chartist-js#6 (comment).

Ali Gajani
Founder at Mr. Geek
www.mrgeek.me
www.aligajani.com

[gionkunz]

http://jsbin.com/xiqoj/1/edit here you go

[gionkunz]

I've implemented a first version of the API documentation generator as well as added the first few API documentations in the code.

http://gionkunz.github.io/chartist-js/api-documentation.html

[gionkunz]

Hi

I'm closing this issue and further efforts will be taken under gionkunz/chartist-js#9 and https://github.com/gionkunz/chartist-js/issues/13

Thanks for your help
Cheers
Gion