Highcharts图形为不同日期范围的X轴标签 [英] Highcharts graph X-axis label for different date ranges

问题描述

我已经写了一个下面的代码，它为选定的日期（来自日期和日期）生成一个区域图。

  $（ document）.ready（function（）{
 var options = {
series：[{
showInLegend：false，
color：＃D0D0D0， 
name：Revenue，
data：[0,0,0,0,0,0,0,0,0,0,0,0,0,0中，0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0 ，0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0]]]，
的信用额度：{
enabled：false 
}，
chart：{
renderTo：highchart_id，
defaultSeriesType：area ，
shadow：true 
}，
title：{
text：null，
align：center，
x：0，
y：20 
}，
xAxis：{
type：datetime，
 dateTimeLabelFormats：{
month：％e。 ％b，
year：％b
}，
labels：{
enabled：false
} 
 
legend：{
enabled：true 
}，
yAxis：{
title：{
文本：
，
标签：{
已启用：true 
} 
}，
plotOptions：{
area：{
stacking：normal，
lineColor：＃3E3E3E，
lineWidth：3，
marker ：{
lineWidth：1，
lineColor：＃3E3E3E，
states：{
hover：{
启用：true，
radius：1 
} 
} 
 } 
系列：{
pointStart：1335823200000，
pointInterval：86400000 
} 
} 
} ; 
 var chart = new Highcharts.Chart（options）; 
}）; 
  

x轴上的日期间隔即将减少一天。在这里，系列值2为10可能，而它显示为9可能在图表中。

我对这个高分图是新的，任何人都可以建议解决方案，让我如果您需要更详细的问题解答，请告诉我们。 解决方案

尝试在声明图表之前添加此代码

$ b

  Highcharts.setOptions（{
 global：{
 useUTC：false 
} 
}）; 
  

默认情况下，高图使用UTC时间。通过添加上面的代码，它将使用浏览器的时区。

I have written a below code which generates a area graph for selected dates (to and from dates).

$(document).ready(function() {
    var options = {
        "series": [{
            "showInLegend": false,
            "color": "#D0D0D0",
            "name": "Revenue",
            "data": [0, 0, 0, 0, 0, 0, 0, 0, 0, 2, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]}],
        "credits": {
            "enabled": false
        },
        "chart": {
            "renderTo": "highchart_id",
            "defaultSeriesType": "area",
            "shadow": true
        },
        "title": {
            "text": null,
            "align": "center",
            "x": 0,
            "y": 20
        },
        "xAxis": {
            "type": "datetime",
            "dateTimeLabelFormats": {
                "month": "%e. %b",
                "year": "%b"
            },
            "labels": {
                "enabled": "false"
            }
        },
        "legend": {
            "enabled": true
        },
        "yAxis": {
            "title": {
                "text": ""
            },
            "labels": {
                "enabled": true
            }
        },
        "plotOptions": {
            "area": {
                "stacking": "normal",
                "lineColor": "#3E3E3E",
                "lineWidth": 3,
                "marker": {
                    "lineWidth": "1",
                    "lineColor": "#3E3E3E",
                    "states": {
                        "hover": {
                            "enabled": true,
                            "radius": 1
                        }
                    }
                }
            },
            "series": {
                "pointStart": 1335823200000,
                "pointInterval": 86400000
            }
        }
    };
    var chart = new Highcharts.Chart(options);
});​

The interval of dates on x-axis is coming one day less. here the series value 2 is for 10 may whereas it is showing for 9 may in graph.

I am new to this highchart, can anybody advice the solution please and let me known if you need any more clarification on the problem.

解决方案

Try adding this code before declaring the chart

Highcharts.setOptions({
        global: {
            useUTC: false
        }
    });

By default highchart used UTC times. By adding the code above it will use the time zone of the browser.

这篇关于Highcharts图形为不同日期范围的X轴标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！