0

我有一个结合了样条曲线和列的 HighCharts 图表。列数据定义了单个 Y 值——表示单个列——并使用 pointRange 来表示单个列所涵盖的 X 值范围。只要 pointRange 小于样条数据中的最大 X 值，一切正常。但是当pointRange 大于样条数据中的最大X 值时，HighCharts 会从根本上截断点范围，例如从我想要的10,000 到大约4200，大约是最大X 值的一半。标签也从根本上向左移动，就好像该列具有小于 0 的 X 值的显着范围，这在我传递的数据中不存在。

（我想发布问题的快照，但我的声誉不足。）

这是一个 HighCharts 错误，还是我在这里遗漏了什么？贝叶斯当然建议后者，但我不能很好地了解我所缺少的。因此向stackoverflow之神提出了这个要求。

这是一个说明我的问题的小提琴：http: //jsfiddle.net/Bridgeland/UVF4P/1/如果您将 pointRange 从 10000 更改为 8000，您可以看到我预期的结果，尽管列稍小。

这是我的代码，为简洁起见省略了大部分数据：

$(function () {
    $('#container').highcharts({
        title: {
            text: 'pointRange is too small'
        },
        yAxis: {
            min: 0,
            max: 1
        },
        xAxis: {
            min: 0
        },
        legend: {
            enabled: false
        },
        credits: {
            enabled: false
        },
        series: [{
            data: [
                [0, 1],
                [215, 1],
                // middle of spline data omitted for brevity
                [8189, 0.007198560287942413],
                [8404, 0],
                [8620, 0]
            ],
            type: 'spline',
            marker: {
                enabled: false
            },
            zIndex: 1
        }, {
            data: [0.5],
            type: 'column',
            pointInterval: 10000,
            pointPadding: 0.01,
            groupPadding: 0,
            borderWidth: 0,
            shadow: false,
            pointPlacement: 'between',
            pointRange: 10000,
            zIndex: 0,
            minPointLength: 3,
            dataLabels: {
                enabled: true,
                inside: true,
                color: 'white',
                formatter: function () {
                    return 'Misplaced'
                }
            }
        }]
    })
})

（你可能想知道为什么我有一个单列的柱形图？我的图表通常有更多的列。单列是特定数据组合的病态案例。但尽管有病态，我仍然希望它显示适当地。）

4

2 回答 2

1

你不能也设置一个 xAxis 最大值，比如 10500 吗？那不会允许列扩展到 10k 吗？

于 2013-07-04T20:25:17.620 回答
1

似乎 Highcharts 不允许有pointRange大于x或值的minRange最大值。

您可以通过以下方式解决此问题：

$(function () {
    $('#container').highcharts({
        title: {
            text: 'pointRange is too small'
        },
        yAxis: {
            min: 0,
            max: 1
        },
        xAxis: {
            min: 0,
            minRange: 10000
          //^^^^^^^^^^^
        },
        legend: {
            enabled: false
        },
        credits: {
            enabled: false
        },
        series: [{
            data: [
                [0, 1],
                [215, 1],
                // middle of spline data omitted for brevity
                [8189, 0.007198560287942413],
                [8404, 0],
                [8620, 0]
            ],
            type: 'spline',
            marker: {
                enabled: false
            },
            zIndex: 1
        }, {
            data: [0.5],
            type: 'column',
            pointInterval: 10000,
            pointPadding: 0.01,
            groupPadding: 0,
            borderWidth: 0,
            shadow: false,
            pointPlacement: 'between',
            pointRange: 10000,
            zIndex: 0,
            minPointLength: 3,
            dataLabels: {
                enabled: true,
                inside: true,
                color: 'white',
                formatter: function () {
                    return 'Misplaced'
                }
            }
        }]
    })
})

由于您设置pointInterval为 10000，我认为您可以对minRangevalue 做同样的事情吗？

于 2013-07-04T20:33:06.367 回答