2

I am trying to plot xy line in which y axis is reversed and I am getting plot but mouse event I am unable to correct it it is showing reverse event, and I want to find min and mix of axis automatically how this can be done? And how to bring x axis on top?

This is my code:

JS

$(function () {
var chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container',
        zoomType: 'xy',
        marginLeft: 50,
        marginBottom: 90
    },

   // How to get minmax automatically zooming is a issue
   // reverse is true
    yAxis: {
        reversed: true,
        min:0,max:50
    },
    plotOptions: {
        series: {
            stacking: 'normal'
        }
    },

   series: [
           {
                   name: '01-Jan-2014',
                   data: [[30,0],[28,10]]
           }
           ]
});
});

HTML 

  <script src="http://code.highcharts.com/highcharts.js"></script>
  <div id="container" style="height: 400px"></div>

Here is a JS Fiddle.

Whether its possible to pass string inside series ? may be my question is silly please tell me whether its possible, like below I am interested

   string mystring = "{
                 name: '01-Jan-2014',
                 data: [[28, 10],[30, 0]]
               },
               {
                 name: '01-Jan-2014',
                 data: [[28, 10],[30, 0]]
               }"

In series part of code I would like to do like below

                 series: [ 
                             mystring
                         ]

Expected output from this array, sorted y axis GOOD PATTERN - Fiddle but mouse movement is not working

data:[
[ 25.290,1.000 ],
[ 25.240,2.000 ],
[ 25.210,3.000 ],
[ 25.190,4.000 ],
[ 25.180,5.000 ],
[ 25.170,6.000 ],
[ 25.160,7.000 ],
[ 25.310,8.000 ],
[ 25.210,9.000 ],
[ 25.170,10.000 ],
[ 25.160,11.000 ],
[ 25.160,12.000 ],
[ 25.150,13.000 ],
  ]

here I sorted xaxis - mouse event is alright but plot pattern (line) is not the one which I expect BAD PATTERN - Fiddle

   data:[
[ 25.150,13.000 ],
[ 25.160,12.000 ],
[ 25.160,11.000 ],
[ 25.160,7.000 ],
[ 25.170,6.000 ],
[ 25.170,10.000 ],
[ 25.180,5.000 ],
[ 25.190,4.000 ],
[ 25.210,9.000 ],
[ 25.210,3.000 ],
[ 25.240,2.000 ],
[ 25.290,1.000 ],
[ 25.310,8.000 ],
  ]
user3304642
  • 181
  • 1
  • 2
  • 16

1 Answers1

1

Answers:

  • you have errors in JS console - fix them (sort data ascending by x-value!)
  • to set min and max, just don't set anything, Highcharts will calculate extremes
  • to display xAxis on top, set opposite: true

Demo: http://jsfiddle.net/2xLvY/1/

var chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container',
        zoomType: 'xy',
        marginLeft: 50,
        marginBottom: 90
    },

    yAxis: {
        reversed: true,
        //min: 0,
        //max: 50
    },
    plotOptions: {
        series: {
            stacking: 'normal'
        }
    },
    xAxis: {
        opposite: true  
    },
    series: [{
        name: '01-Jan-2014',
        data: [
            // NOTE: proper order, first x-value is lower that second
            [28, 10],
            [30, 0]
        ]
    }]
});
Paweł Fus
  • 44,795
  • 3
  • 61
  • 77
  • +1 Pawel Fus, Thank you so much, you mean I have to sort data before inputing to javascript ? is there any function to sort array – user3304642 Mar 20 '14 at 12:16
  • Before using data for Highchart. – Paweł Fus Mar 20 '14 at 12:17
  • Is there any function to sort array in javascript ? – user3304642 Mar 20 '14 at 12:22
  • Of course, see [Array.sort()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort). – Paweł Fus Mar 20 '14 at 12:26
  • Can you do one more help for me ? I want to send complete series data as string is it possible ? – user3304642 Mar 21 '14 at 16:32
  • It can't be string, sorry. If that string will be proper JSON, then you will be able to use `JSON.parse()` or `eval()`. – Paweł Fus Mar 22 '14 at 12:03
  • I am sorry to say if I sort x column complete plot pattern is changing and result is not proper, in my original post I posted a new data sorted please have a look, mouse event is still not solved – user3304642 Mar 22 '14 at 16:56
  • Fus Did you see my problem ? – user3304642 Mar 23 '14 at 06:10
  • I have opened new thread if you have time please help me, sorting x axis won't help, http://stackoverflow.com/questions/22587836/highcharts-mouse-event-bug-in-line-chart – user3304642 Mar 23 '14 at 11:40
  • Man, relax, it was weekend :) Anyway - duplicated x-values OR unsorted data is **NOT** supported by Highcharts for line series. I advice to change to `scatter` type. – Paweł Fus Mar 24 '14 at 10:47