highstock.js图表​​绘图有点偏

时间:2013-07-03 11:07:32

标签: javascript jquery highcharts highstock

我使用Highstock.js来表示图表。问题是绘图在x轴上显示实际日期右侧的值。图例中的日期与x轴上的日期匹配。但是当缩放时,绘图在该日期右侧有点。

请检查小提琴

http://jsfiddle.net/HL7jX/

$('#container').highcharts('StockChart', {
        chart: {
            //type: 'area',
        },
        title: {
            text: "Weekly Managed Product Fund Flows",
            margin:50
        },
        rangeSelector: {
            selected: 0,
            align: "left",
            buttons: [
                    {
                        type: 'month',
                        count: 1,
                        text: '1m'},
                     {
                        type: 'month',
                        count: 3,
                        text: '3m'},
                     {
                        type: 'month',
                        count: 6,
                        text: '6m'},
                    ]
        },
        navigator: {
            height: 10
        },
        xAxis: {  
             type:'datetime',
             maxZoom: 24 * 3600000,
             alignTicks : false
        },
        yAxis:[{ 
            title: {
                text: 'Flow US$ mill'
            }
        }, { 
            title: {
                text: 'AMZ'
            },
             labels: {
                format: '{value}'
            },
            opposite: true
        }],
        exporting: {
                enabled: false
        },
        credits: {
                enabled: false
        },
        legend: {
            align: "top",
            layout: "horizontal",
            enabled: true,
            verticalAlign: "middle",
            x:250,
            y:-150
            /*labelFormatter: function() {
                return this.name + ' (T)';
            }*/

        },
       plotOptions:{
            series:{
                     stacking: 'normal'
            },
            line:{
                marker: {
                    symbol:"circle",
                    enabled: true
                }
           }
        },
        series: [/*{
            type: 'area',
            name: 'Total Flows',
            data: all,
            tooltip: {
            valuePrefix: '$',
            valueDecimals: 2
            }
        },*/{
            type: 'area',
            name: 'Mutual Fund Flows',
            data: mf,
            tooltip: {
            valuePrefix: '$',
            valueDecimals: 2
            }
        }, {
            type: 'area',
            name: 'ETF Flows',
            data: etf,
            tooltip: {
            valuePrefix: '$',
            valueDecimals: 2
            }
        },
        {
            type: 'line',
            name:'Alerian AMZ Index',
            yAxis: 1,
            data: AMZ_YTD,
            tooltip: {
            valueDecimals: 2
            }
        }]
    });

1 个答案:

答案 0 :(得分:1)

这可能是时间的关系。

例如:6月13日的AMZ指数系列 - 您的时间戳为1371097800000。 这将转换为2013年6月13日星期四00:30:00 GMT-0400(东部标准时间)

勾选设置为午夜,数据点值为半小时后。

如果您希望点数完全匹配,请确保将时间戳设置为午夜。

您还可以设置useUTC false以避免时区问题。 http://api.highcharts.com/highcharts#global.useUTC