高图:仅将行的最后一部分设置为虚线区域

时间:2018-09-19 22:22:48

标签: highcharts

我正试图使该图表仅在上个月被点缀:

chart_data = [[1496275200000, 981], [1498867200000, 1089], [1501545600000, 1595], [1504224000000, 1296], [1506816000000, 1678], [1509494400000, 1879], [1512086400000, 2028], [1514764800000, 1885], [1517443200000, 1366], [1519862400000, 1558], [1522540800000, 1636], [1525132800000, 2438], [1527811200000, 2899], [1530403200000, 2521], [1533081600000, 2879], [1535760000000, 1702]]


Highcharts.chart('container', {
    title: {
        text: 'Zone with dash style'
    },
    subtitle: {
        text: 'Dotted line typically signifies prognosis'
    },
        xAxis: {
        type: 'datetime',
        labels: {
            formatter: function () {
                return Highcharts.dateFormat('%Y-%m', this.value)
            }
        },
        tickInterval: 30 * 24 * 3600 * 1000,
    },
    series: [{
        data: chart_data,
        zoneAxis: 'x',
        zones: [{
            value: chart_data.length - 2
        }, {
            dashStyle: 'dot'
        }]
    }]
});

https://jsfiddle.net/aL57381b/

(此highcharts代码与highcharts文档中的http://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/series/color-zones-dashstyle-dot/基本相同,只是带有我的时间序列数据。

但是,它会使整个图表变成虚线,而不仅仅是最后一位。有什么想法吗?我似乎无法解决此问题。

1 个答案:

答案 0 :(得分:0)

您需要的是实际值,而不是像这样的起始索引:

dottedStartIndex = chart_data[chart_data.length - 2][0];
Highcharts.chart('container', {
...
    zones: [{
        value: dottedStartIndex
    }, {
        dashStyle: 'dot'
    }]

Fiddle