Question

我有一个highcharts日期时间样条曲线图，我想从highstocks添加导航器（highstocks已在页面上），而不更改图表的任何其他内容。

从高图转换到高档也改变了我想要放弃的许多默认行为（轴设置，图例设置......所有种类）。我只想要导航器。

所以我要么将只是导航器添加到我的高端图表中，要么指向一个全面的选项列表，我可以传递给highstocks以使其与highcharts默认值匹配（如果存在的话。）

谢谢！

Answer 1

通过用highstock.js替换highcharts.js，您将不会更改默认行为：

Highcharts：http://jsfiddle.net/pq7o66as/
Highstock：http://jsfiddle.net/pq7o66as/1/

现在只需启用导航器：

http://jsfiddle.net/pq7o66as/2/

    navigator: {
        enabled: true      
    },

注意：

请勿将构造函数从$('#container').highcharts(options);更改为$('#container').highcharts('StockChart', options);。

Highstock的默认选项：

    chart: {
        panning: true,
        pinchType: 'x',
        inverted: false // "true" is not supported in Highstock
    },
    navigator: {
        enabled: true
    },
    scrollbar: {
        enabled: true
    },
    rangeSelector: {
        enabled: true
    },
    title: {
        text: null,
        style: {
            fontSize: '16px'
        }
    },
    tooltip: {
        shared: true,
        crosshairs: true
    },
    legend: {
        enabled: false
    },
    plotOptions: {
        line: {
            marker: {
                enabled: false,
                radius: 2
            },
            states: {
                hover: {
                    lineWidth: 2
                }
            }
        },
        column: {
            shadow: false,
            borderWidth: 0
        }
    },
    xAxis: {
            startOnTick: false, // only when navigator enabled 
            endOnTick: false, // only when navigator enabled
            minPadding: 0,
            maxPadding: 0,
            ordinal: true,
            title: {
                text: null
            },
            labels: {
                overflow: 'justify'
            },
            showLastLabel: true,
            type: 'datetime' // in Highstock only supported type
   },
   yAxis: {
        labels: {
            y: -2
        },
        opposite: opposite,
        showLastLabel: false,
        title: {
            text: null
        }
   }

如何在高线图上使用highstocks导航仪

1 个答案: