Highchart js max 15 plots to be plotted

问题

I have been trying a lot in Highchart js and still cant find a way to reduce the number of elements in the series.

If i get more than 15 days data i have to reduce it back and show to user as 15 days data so that user can see the data without crowding of data. Max 90 days will be given in the series which i have to reduce to 15 days.

check my current code here in http://jsfiddle.net/MULZL/

can any one give me a solution for it ?

P.S: I dont want to reduce it to first 15 days or last 15 days. I want to do it just because getting 90days in the chart looks crowded and i dont want zoom functions to apply. I want the solution for ignoring some data (days) to make it 15days if it is more than 15 days

回答1:

You can programmatically zoom into the required time range using the Axis.setExtremes method. In your case you may want to do it on load

Here is how you would do it, if you want to zoom into the 1st 15 days of the given data, you can easily modify to zoom into last 15 days.

function zoomTo15Points(chart){
    var points=chart.series[0].points;
    if(points.length<15)   return;
    var min=points[0].x;    
    var max=points[14].x;
    // If you wish to zoom to 15 days and not 15 points, you can modify max as
    // var max=min + 1000*60*60*24*14
    chart.xAxis[0].setExtremes(min,max);    
    chart.showResetZoom();
}

If you do not want to let the user zoom out, you can disable the last line, but you also will have to disable zooming, else the button would appear if user zooms inside the 15 days.

Highchart Zoom on Load @ jsFiddle

回答2:

You can try dataGrouping feature of highStock

var dataGrouping = {
    groupPixelWidth: 40,
    units: [[
        'day',
        [1, 2, 3,4,5,6]
        ]]
};

Highcharts would make sure all your columns are at least the specified width (40), if the number of coulmns is large, such that it's not possible to have that width, it will group data using the units, so it will group data of 1 day into 1 column or 2 days into 1 column and so on. Not sure if you really want exactly 15 plots, but I think you concern was to avoid crowding of data, this does exactly that, but the number of columns will vary based on the width you specify, the width of the plotArea and allowed units and its multiples. Tweak the values as per your data and width of your chart. jsFiddle

来源：https://stackoverflow.com/questions/12243503/highchart-js-max-15-plots-to-be-plotted

标签

javascript

Highcharts