title: Possible to use Highcharts Scatter Plot with categories?
body: <p>Highcharts v3.01</p>
  
  <p>I'm trying to use a scatter plot to draw points within named categories (these are actually numeric, but out of series and I don't want gaps). </p>
  
  <p>Using line graph types would work, but I'd rather not as I have potentially hundreds of series and scatter points are clearer. </p>
  
  <p>The closest I have come is this:</p>
  
  <p>EDIT - I would post a descriptive image, but apparently I need reputation points. Sigh. </p>
  
  <p>Please see here: <a href="http://i117.photobucket.com/albums/o63/Harry_Flashman/close_zpsfe6d3ea2.png" rel="nofollow">http://i117.photobucket.com/albums/o63/Harry_Flashman/close_zpsfe6d3ea2.png</a></p>
  
  <p>This is using points referencing an x and y, </p>
  
  <pre><code>data: [{x:108432,test:100,y:0}, {x:109802,test:100,y:51}, etc. ]
  </code></pre>
  
  <p>I want to do exactly as above, but without the gaps. </p>
  
  <p>The only way I can see to have a non-linear gap-free axis is with categories, which I've used before on other line-type graphs, but never with a Scatter Plot. </p>
  
  <p>If I use the x-axis type "category" with a category array instead, it only assigns one scatter value to each and the remainder to ascending numeric categories (i.e. it doesn't group them if I use the point "name" option).</p>
  
  <pre><code>xAxis: {
    type: category,
    categories: ['108432','109802','110240', etc. ]
  }
  </code></pre>
  
  <p>with datapoints that look like this:</p>
  
  <pre><code>data: [{name:'108432',test:100,y:0}, {name:'109802',test:100,y:51}, etc. ]
  </code></pre>
  
  <p>Ends up like this. Each scatter point gets its own category. </p>
  
  <p><a href="http://i117.photobucket.com/albums/o63/Harry_Flashman/not_zps31aa4fef.png" rel="nofollow">http://i117.photobucket.com/albums/o63/Harry_Flashman/not_zps31aa4fef.png</a></p>
  
  <p>Any help appreciated, this would be great if I could get it to work. </p>
  
  <p>Thanks!</p>
  
  <p>Pat</p>
  
  <p>PS. Added entire chart script (minus large amounts of data) below. This is the "almost works" version.</p>
  
  <pre><code>$('#container').highcharts({
    chart:    { type: 'scatter', zoomType: 'xy'     },
    title:    { text: 'Revision vs Runtime Scatter' },
    subtitle: { text: 'L3 Performance Test'         },
    xAxis:    {
      title:      { enabled: true, text: 'Revision' },
      startOnTick:   true,
      endOnTick:     true,
      showLastLabel: true,
      showEmpty:     false,
      legend:      { y: 120, floating: true, backgroundColor: '#FFFFFF' },
      labels:      { rotation: -90, align: 'right' },
      categories:  ['101831','101849','101850','101857','101861','101866','101868','101878','101879','101880','101881','101882','101883','101884','101885','101888','101894','101900','101903','101905','101908','101913','101914']
    },
    yAxis:       { title: { text: 'Variance (%)' } },
    legend:      { layout: 'vertical' },
    plotOptions: {
      scatter: {
        marker: { radius: 5, states: { hover: { enabled: true, lineColor: 'rgb(100,100,100)' } } },
          states: { hover: { marker: { enabled: false } } },
          tooltip: {
            headerFormat: '&lt;b&gt;&lt;/b&gt;',
            pointFormat: '&lt;b&gt;Test {point.test}&lt;/b&gt;&lt;br/&gt;r{point.x}&lt;br/&gt;{point.y}% change&lt;br/&gt;{series.name}'
          }
        }
      },
      series: [{
        name: 'PRd',
        data: [{x:101857,test:267,y:0}, {x:101861,test:267,y:-1}, {x:101866,test:267,y:-0}, {x:101868,test:267,y:-1}, {x:101878,test:267,y:-1}, {x:101879,test:267,y:-1}, {x:101880,test:267,y:-0}, {x:101881,test:267,y:-0}, {x:101882,test:267,y:-0}, {x:101883,test:267,y:-0}, {x:101884,test:267,y:-0}, {x:101885,test:267,y:-0}, {x:101888,test:267,y:-0}, {x:101894,test:267,y:-1}, {x:101900,test:267,y:-0}, {x:101903,test:267,y:-0}, {x:101905,test:267,y:-1}, {x:101908,test:267,y:-1}, {x:101913,test:267,y:0}, {x:101914,test:267,y:1}, {x:101831,test:430,y:0}, {x:101849,test:430,y:1}, {x:101850,test:430,y:1}]
        }, {
        name: 'Non-PRd',
        data: [{x:101831,test:100,y:0}, {x:101849,test:100,y:51}, {x:101850,test:100,y:51}, {x:101857,test:100,y:52}, {x:101861,test:100,y:49}, {x:101866,test:100,y:50}, {x:101868,test:100,y:50}, {x:101878,test:100,y:50}, {x:101879,test:100,y:50}, {x:101880,test:100,y:50}, {x:101881,test:100,y:50}, {x:101882,test:100,y:50}, {x:101883,test:100,y:50}, {x:101884,test:100,y:50}, {x:101885,test:100,y:50}, {x:101888,test:100,y:50}, {x:101894,test:100,y:50}, {x:101900,test:100,y:50}, {x:101903,test:100,y:0}, {x:101905,test:100,y:50}, {x:101908,test:100,y:51}, {x:101913,test:100,y:50}, {x:101914,test:100,y:50}, {x:101831,test:10937,y:0}, {x:101849,test:10937,y:2}]
      }]
    });
  });
  </code></pre>