Chart.js: Bug with repeated labels as strings?

Created on 19 Jul 2016  ·  9Comments  ·  Source: chartjs/Chart.js

Hi,

I've recently upgraded to version 2.2.0 rc and it's broken some of my existing code, don't know if this is a bug or not but I've sussed that this only happens when there are repeated string labels (have tried with repeated integers as labels and it worked perfectly).

chartjsstringlabelbug

As you can see it will display any strings that aren't repeated labels in the correct position but otherwise it'll just write the new label over the existing one, making it darker. I am using a custom scale that I wrote myself but this doesn't affect the labels at all, it merely gives a wider/darker line for the start of a day. The problem seems to be coming from the positions given for the x labels/ticks. Haven't found a solution yet but will keep looking.

Note that this only seems to occur with an array that contains repeated strings and doesn't with an array of integers i.e. ["1", "2", "3", "1", "2", "3", "1", "2", "3"] will draw 9 labels on top of 3 points (the first three) but [1, 2, 3, 1, 2, 3, 1, 2, 3] will draw 9 different labels on 9 different points.

help wanted bug

Most helpful comment

@arxpoetica I opened up a PR to fix this in #3191

All 9 comments

@dibsyjr is it possible to post a fiddle with this issue so that we can take a look?

@etimberg Sure, it seems to display slightly differently with a bar chart, but you can still see it causes problems. This is largely based off of the code in the 'Creating a Chart' section of the docs: Creating a Chart just in case you want to see how it looks without the repeated labels.

Here's my fiddle of the problem occurring: Fiddle

Just add my jsfiddle which is a line chart.
Chart.js v2.2.1

var myChart = new Chart(ctx, {
  type: 'line',
  data: {
    labels: ['S', 'M', 'T', 'W', 'T', 'F', 'S'],
    datasets: [{
      label: 'Hi',
      data: [20, 30, 80, 90, 50, 60, 30]
    }]
  }
});

The issue starts from 2.2.0-rc.1
It works well in 2.1.6

The cause of this is https://github.com/chartjs/Chart.js/blob/master/src/scales/scale.category.js#L62-L66

We should probably only use that logic if index === undefined

@etimberg thanks for your time, hope you find a solution : )

What version will this fix land in?

@arxpoetica there is no PR yet for this. I'd be happy to merge something that includes a test as well

@arxpoetica I opened up a PR to fix this in #3191

Was this page helpful?
0 / 5 - 0 ratings