stockChart显示将来的日期标签

问题描述 投票:0回答:1

尽管在烛台和ohlc图表上,但xAxis当天的数据仍显示明天的日期。在xAxis上设置endOnTick,max,softMax,ceiling不会更改任何内容。

任何人都有一个想法如何将xAxis图表上的最后一个标签设置为图表上的最后一个点?

可以使用此代码复制示例:

var today = new Date(),
day = 1000 * 60 * 60 * 24;

Highcharts.stockChart('container', {
title: {
    text: 'Current Date Indicator'
},
xAxis: [{
    id: 'bottom-datetime-axis',
    type: 'datetime',
    max: today.getTime()
}],
series: [{
    name: 'Project 1',
    borderRadius: 3,
    xAxis: 0,
    type: 'candlestick',

    data: [{
        x: today.getTime() - (11 * day),
open: 5,
high: 7,
low: 2,
close: 6,            
        y: 2
    }, {
        x: today.getTime() - (10 * day),
open: 3,
high: 6,
low: 2,
close: 5,            
        y: 1
    }, {
        x: today.getTime() - (9 * day),
open: 5,
high: 7,
low: 2,
close: 6,            
        y: 2
    }, {
        x: today.getTime() - (8 * day),
open: 3,
high: 6,
low: 2,
close: 5,            
        y: 1
    }, {
        x: today.getTime() - (7 * day),
open: 5,
high: 7,
low: 2,
close: 6,            
        y: 2
    }, {
        x: today.getTime() - (4 * day),
open: 3,
high: 6,
low: 2,
close: 5,            
        y: 1
    }, {
        x: today.getTime() - (3 * day),
open: 5,
high: 7,
low: 2,
close: 6,            
        y: 1
    }, {
        x: today.getTime() - (2 * day),
open: 3,
high: 6,
low: 2,
close: 5,            
        y: 1
    }, {
        x: today.getTime() - day,
open: 3,
high: 6,
low: 2,
close: 5,            
        y: 3
    }, {
        x: today.getTime(),
open: 5,
high: 7,
low: 2,
close: 6,            
        y: 2
    }]
}]
});

或使用在线演示,可在此处找到:https://jsfiddle.net/gt9cr4x7/1/

screenshot

highcharts
1个回答
0
投票

您可以使用tickPositioner功能并仅返回其值比最后一个点x值低的那些报价位置:

xAxis: {
    ...,
    tickPositioner: function() {
        var tickPositions = this.tickPositions;

        for (var i = tickPositions.length; i >= 0; i--) {
            if (tickPositions[i] > this.dataMax) {
                tickPositions.splice(i, 1);
            }
        }

        return tickPositions
    }
}

实时演示: https://jsfiddle.net/BlackLabel/v6pc4r7n/

API参考: https://api.highcharts.com/highstock/xAxis.tickPositioner

© www.soinside.com 2019 - 2024. All rights reserved.