CODEWITHSUNDEEP
highcharts
WhiteLine
WhiteLine

Reputation: 1991

Highcharts : Set an y offset to the series

Situation : Chart with some analogic-series and some digital-series (0-1).

The problem is with the digital series. I would like to make sure that the series do not overlap like the image 1. My idea is to set an "y-offset" on the digital-series, to have a result like the image 2.

This is a part of the y Axis configuration of the digital series. All the digital-series is related to a single y Axis (with id digital). 

id : "digital",
min: 0,
max : 1,
ceiling:1,
floor : 0,
tickInterval: 1

Image 1.

enter image description here

Image 2.

enter image description here

In the documentation i can't find anything that can help me. And this is not my case.

UPDATE

Example on JSFIDDLE. Look (yes it's impossible currently) at the digital series with green color.

Upvotes: 0

Views: 566

Answers (1)

ewolden
ewolden

Reputation: 5803

If you add a function in the load event, you can change the value of y in a way that makes it look offset. Like this:

chart: {
  events: {
    load: function() {
      var series = this.series;
      for (var i = 0; i < series.length; i++) {
        if (series[i].yAxis.userOptions.id == "digital") {
          for (var j = 0; j < series[i].data.length; j++) {
            if (series[i].data[j].y == 1) {
              series[i].data[j].y = 1 + 0.1 * i;
            } else {
              series[i].data[j].y = 0
            }
          }
          this.update(series, true, false);
        }
      }

    }
  }
}

This sets the new y value equal to 0.1 * the series index.

Working example: https://jsfiddle.net/u2pzrhgk/27/

Upvotes: 2

Related Questions