Where communities thrive

  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
Repo info
  • May 14 12:58
    anveshyk edited #1290
  • May 11 17:02
    anveshyk edited #1290
  • May 11 16:57
    anveshyk edited #1290
  • May 11 15:58
    anveshyk opened #1290
  • May 11 09:00
    TANK2003 commented #290
  • May 11 03:23

    dependabot[bot] on npm_and_yarn

    Bump hosted-git-info from 2.8.4… (compare)

  • May 11 03:23
    dependabot[bot] labeled #1289
  • May 11 03:23
    dependabot[bot] opened #1289
  • May 10 13:50

    dependabot[bot] on npm_and_yarn


  • May 10 13:50
    dependabot[bot] closed #1259
  • May 10 13:50
    dependabot[bot] commented #1259
  • May 10 13:50

    dependabot[bot] on npm_and_yarn

    Bump lodash from 4.17.15 to 4.1… (compare)

  • May 10 13:49
    dependabot[bot] labeled #1288
  • May 10 13:49
    dependabot[bot] opened #1288
  • May 10 11:56
    Mounikaveggalam opened #1287
  • May 07 11:36

    dependabot[bot] on npm_and_yarn

    Bump grunt from 1.0.4 to 1.3.0 … (compare)

  • May 07 11:36
    dependabot[bot] labeled #1286
  • May 07 11:36
    dependabot[bot] opened #1286
  • Apr 30 11:42
    CodeMasterZeroOne commented #32
  • Apr 29 04:01
    breedx-splk opened #1285
Yury Shevchenko

so that I could do something like

   classNames: {
        series: css.series, // 'LineChart--series--f45ba0'
        'series-a': css.seriesA, // 'LineChart--seriesA--1bac43'
        'series-b': css.seriesB, // 'LineChart--seriesB--eff81c'


Josh Holtz
is it possible to do something like this with the bar chart?
base the chart off of 50 instead of 0?
Josh Holtz
nvm, figured it out - https://jsfiddle.net/oqx7ujka/3/
Andrej Rapoport
Hi! Maybe I am missing something, so I would appreciate any help. The Chartist homepage lists some facts about the lib. One of them is "... clear separation of concerns (Style with CSS & control with JS)". I like the concept very much but once I tried the lib to make a bar diagram I could not avoid putting some pixel constants inside my JS (e.g. offset for axisY orseriesBarDistance). I saw them in some examples and was irritated... Can I avoid them using CSS?
Andrej Rapoport
One other thing, that irritated me, was the global resize listener. After reading facts about Chartist I did not expect to see such a technique :-) I know it is a temporary solution. But maybe you could mention on the homepage, that the library is not quite ready...
I hope I did not offend anyone :-) It's just a small feedback I have after trying the lib.
Paul Aikman
Hi folks. Wonder if anyone has any thoughts on performance using multiple (simple) graphs on the same page?
Particularly on mobile, just to make it extra tricky 😎
It should be no issue. Graphs are svg so the device will render them fairly easy
Paul Aikman
Great! I was having some issues with d3 (react wrapper). It was fine... just felt a bit heavy.
We use chartist in production with react. That being said, we have to rewrite almost every plugin because of their liberal use of jQuery. A heavyish dependency we don't really need
Travis Dixon
gionkunz/chartist-js#37 <- need so bad
@Mbeaulne I've found the same with plugins. People love their jquery. Maybe we should start publishing forks / pull requests to remove that dependency
Does anyone know a way to lock the gridlines/axis to a set of hard-coded steps?
I'd like to just give a list of values rather than an interpolation function
Andres Roget
hey folks im no expert on SVGs but I am working in a chart and it all works well on all major browsers except when i go to Microsoft Edge for some reason the X axis labels are getting cut off... i've tried several things like setting a virtualbox, setting a fixed with to the chart, etc, needless to say none of them worked here is how the same chart looks like on Chrome and Edge
Screen Shot 2017-08-02 at 11.44.39 AM.png
Screen Shot 2017-08-02 at 11.45.00 AM.png
any ideas?

do You have any plan to add viewBox atribute to svg element?
As i know it is the best way to make true responsive svg that fills the parent container.
Only what we need is current callculated ratio, inside viewBox

Filling a parent container by svg is helpful when we manipulate a size of that parent container.
Changing parent width and height rarely triggers resize of window event.
With viewBox we dont need redraw and recalcuate Chart after parrent container change.


Arthur Cohen
Hi, im working on a system tha uses a series of graphs, and Im using this tool to help me. My problem is when a Line graph has no data for any reason, and error occurs with this: "Uncaught TypeError: Cannot read property 'pathCoordinates' of undefined", and the graph dont render the content of the legend plugin. This only occurs on the Line chart. With bars everything works fine.
The top graph is a bar chart. the lower left is a line. Both has no data (due the data filter), but the botton one raise an error and dont show legend
anybody help?
Chris Ragon
I am trying to set the x-axis labels which is a list of of the last 7 dates. The issue I am encountering is that the dates repeat themselves if multiple data points share the same date (IE: Jan 22 Jan 22 etc...). How can I remove duplicate dates?
axisX: {
                    showGrid: false
                    type: Chartist.AutoScaleAxis,
                    labelInterpolationFnc: function (value, index) {
                        return moment(value).format('MMM DD');
Minh Nguyen
Hi i use chartist in my app and wonder for line graph, how can i add vertical cursor with tooltip?
or if making the data point hover area larger to have the tooltip display easier on mobile screen
Nick Gentile
I can't seem to get Chartist to be defined in my document. I am running a gulp script to combine a bunch of js files into one and uglify it (then put into head of doc). Has anyone experienced any similar issues / have thoughts?
Alex Gillis
hi, quick question out there, i'd like to generate the graphic on my code and then save as an svg, reason is that i dont show the graph into the screen but i use pdfmake.js rto create a report. so literally i go on the client side from json (api call) to pdf file. so it anyway to compute the chart and get the result in svg whith need to render on canvas kind like myChartSVG=Chartist('#chartist-chart', data, options).exportTosvg();
Hi, i am wondering if es-6 version is available if not then any reason for that.
How can you set fewer steps on the y axis?
Pedro Cunha
Anyone here know how to add top corner radius to bar charts? Using rounding on the stroke affects both edges of the bar (line svg)
Screen Shot 2020-03-09 at 2.47.20 PM.png
Yo anybody experienced this kind of bug
I'm using react chartist btw
Fixed : add manual styling
Holger Amann
hey there! I'm pretty new to graphs (coming from a devops backgorund) and I'd like plot a graph with around ~10k datapoints. I gave them chartist as a line graph with almost defaults and now the graph looks like this
Bildschirmfoto 2020-05-09 um 17.34.36.png
whereas I'd like it to look more like this (same datapoints)
Bildschirmfoto 2020-05-09 um 17.34.10.png
could someone guide me or give some hints please in which direction I should look?
Hey everyone, my chartist charts are being re-drawn on every event, whether it be onclick or window resize. I've no idea how to solve this issue. Please let me know if anyone finds a solution to this. I'm using react-chartist.
Rishi Penmetcha
Does anyone know how to center the labels for the y-axis ticks? The default labels are just above the lines, I want to be able to move it right below the line or at least centered.
Jitesh Sinha
I m using chartist.js for displaying my graph using vue.js
Can any one help me how to show my custom label in stacked bar chart
Sabitha Popuri
Hi I am using chartist-js multi-line chart. For me, the edges of the data points in the graph are not sharp. Is it possible to do that? Also, can we give click events to data points?
Sabitha Popuri
@pedromcunha did you find a solution to add corner radius to bar charts, not stroke-linecap: round