Question

我在Highchart js中一直在尝试，但仍然无法找到减少系列中元素数量的方法。

如果我获得超过15天的数据，我必须将其减少并向用户显示为15天的数据，以便用户可以在不挤占数据的情况下查看数据。系列中将给出最多90天，我必须减少到15天。

在http://jsfiddle.net/MULZL/

中查看我当前的代码

任何人都可以给我一个解决方案吗？

P.S：我不想把它减少到前15天或过去15天。我想这样做只是因为在图表中获得90天看起来很拥挤，我不想要应用缩放功能。我希望解决方案忽略一些数据（天数），如果它超过15天，则为15天

Answer 1

您可以使用Axis.setExtremes方法以编程方式放大所需的时间范围。在您的情况下，您可能想要on load

以下是如何操作的，如果您想放大给定数据的前15天，您可以轻松修改以放大过去15天。

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();
}

如果您不想让用户缩小，可以禁用最后一行，但您还必须禁用缩放，否则如果用户在15天内缩放，则会出现按钮。

Highchart Zoom on Load @ jsFiddle

Answer 2

您可以尝试使用highStock的dataGrouping功能

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

Highcharts会确保你的所有列都至少是指定的宽度（40），如果coulmns的数量很大，那么就不可能有这个宽度，它会使用单位对数据进行分组，所以它会分组1天到1列或2天到1列的数据，依此类推。不确定你是否真的想要15个图，但我认为你关心的是避免数据拥挤，这确实如此，但列的数量将根据你指定的宽度，plotArea的宽度和允许的单位和它的倍数。根据数据和图表宽度调整值。 jsFiddle

Highchart js最多可绘制15个绘图

2 个答案: