Question

在我们的应用程序图表中，我们希望避免使用过多信息污染屏幕。

我们需要一个只显示最低和最高值的轴。

有人知道如何使用Highchart做到这一点吗？

那就是那样的

PS：忽略图表背后的垂直灰色条带，这是完全不相关的。

Answer 1

tickPositions方法的演示：

首先，定义您的数据数组并循环遍历它以找到您的最小值和最大值：

var chartData = [...], yMin, yMax;

$.each(chartData, function(i,point) {
    yMin = i == 0 ? point : (point < yMin ? point : yMin);
    yMax = i == 0 ? point : (point > yMax ? point : yMax);
});

然后，在您的yAxis属性中：

tickPositions: [Math.round(yMin), Math.round(yMax)],

示例：

http://jsfiddle.net/jlbriggs/9se1h970/

编辑评论

啊，是的，当然。

您可以通过向y轴添加更多属性来确定最小值和最大值的刻度：

      min:0,
      max: (yMax * 1.1),
      startOnTick:false,
      endOnTick:false,

更新示例：

http://jsfiddle.net/jlbriggs/9se1h970/1/

Answer 2

以下是jsfiddle示例。

所有你需要做的只是：

定义你的最小和最大。
从源中获取数据（在本例中为Json文件）
仅选择Ymin和Ymax之间的数据

将它们保存在新数组（arrData）中。

$（function（）{

    $.getJSON('https://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function (data) {
            var arrData=[];
        var i,Ymin,Ymax;
    Ymin=20;//minmun value of Y data
    Ymax=40;//max value of Y data

    //selec only data between Ymin and Ymax
    for(i=0;i<data.length;i++){
        if(data[i][1]> Ymin && data[i][1]<Ymax){
        arrData.push(data[i][1]);
      };
    }

    // Create the chart
    $('#container').highcharts('StockChart', {


        rangeSelector : {
            selected : 1
        },

        title : {
            text : 'Min/Max Y data'
        },

        series : [{
            name : 'Min Max Y',
            data : arrData,
        }]
    });
});

}）;

Answer 3

你也可以使用tickPositioner从数据中提取min / max并返回两个值的数组。

'commandMap'=>array(
  'passwordtest'=>array(
    'class'=>'application.modules.myModule.commands.shell.passwordtestCommand',
),

实施例： - http://jsfiddle.net/rchdfb0z/

Answer 4

如果我理解你的问题，你想在最小值和最大值上绘制两行。使用 Axis.addPlotLine 可以轻松实现这一点。我会检查输入数据的最小值/最大值，然后添加绘图线。就像这个DEMO。

Highchart Axis仅具有最小和最大系列值

4 个答案: