Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Possible to use xAxis with type "datetime" and yAxis with categories?

Tags:

highcharts

I have a very simple example using Highcharts which uses "datetime" on one axis and categories on the other. It renders with no points and does not show the categories labels at all. I'm wondering now if you can't use that combination of types. Here is the code:

var chart = new Highcharts.Chart({
    chart: {
      renderTo: 'container'
    },
    xAxis: {
      type: 'datetime'
    },
    yAxis: {
      categories: ['p1', 'p2']
    },
    series: [{
      type: 'scatter',
      data: [
        {
          name: 'Deliv1',
          x: Date.UTC(2011,0,1),
          y: 'p1'
        },
        {
          name: 'Deliv2',
          x: Date.UTC(2012,0,1),
          y: 'p2'
        }
      ]
    }]
  });
like image 456
weexpectedTHIS Avatar asked Jan 26 '12 19:01

weexpectedTHIS


2 Answers

The answer to my problem was given on the highcharts forum. I thought I'd report back here what the solution was. I was errantly using y: 'p1' and y: 'p2' for values on the points. The y values actually are the indexes of the categories. Here is the updated code which works:

data: [
  {
    name: 'Deliv1',
    x: Date.UTC(2011,0,1),
    y: 0
  },
  {
    name: 'Deliv2',
    x: Date.UTC(2012,0,1),
    y: 1
  }
]
like image 86
weexpectedTHIS Avatar answered Nov 06 '22 16:11

weexpectedTHIS


It's possible but you'll need to pretend the y values are numeric.

Probably by having an array with the actual Y-value and a number (maybe index) then the point's y value to the number and for the y-axis settings add the label's formatter to return the actual y-value based on the value.

You'll also need to adjust the min, max, interval and if you're using tooltips add a similar formatter to get the y-value.

(If I get more time, I'll try to create an example).

like image 1
escouser Avatar answered Nov 06 '22 16:11

escouser