Линейные графики Google смещают и перекрывают разделы Java. Даты Java
Текущая и предыдущая неделя Линейные графики Google показывают проблему
Справочная информация: эта диаграмма обновляется программно каждую неделю и работает нормально в течение нескольких месяцев. Линейная диаграмма отслеживает процент систем в заданном состоянии с количеством вызванных систем, а также линию тренда за скользящий год.
Проблема: на этой неделе, как показано в верхней части связанного изображения (без изменений в коде, генерирующем данные или диаграмму), казалось бы, случайные участки диапазона дат hAxis сместились вправо, перекрывая другие даты. Тренд и аннотации на самой линии выглядят правильно.
Любое понимание или руководство будет очень цениться!
Код:
<script type="text/javascript"
src="https://www.google.com/jsapi?autoload={
'modules':[{
'name':'visualization',
'version':'1',
'packages':['corechart']
}]
}"></script>
<script type="text/javascript">
google.setOnLoadCallback(drawChart);
function drawChart() {
// Create the data table.
var data = google.visualization.arrayToDataTable([
['Date', 'Percent ', {type: 'number', role: 'annotation'}],[new Date(2015, 4, 30), 0.016119402985075, 81],[new Date(2015, 5, 06), 0.018779342723005, 96],[new Date(2015, 5, 13), 0.025033960799534, 129],[new Date(2015, 5, 20), 0.018069973087274, 94],[new Date(2015, 5, 27), 0.017182130584192, 90],[new Date(2015, 6, 04), 0.023132347364429, 122],[new Date(2015, 6, 11), 0.019939804364184, 106],[new Date(2015, 6, 18), 0.017420311341735, 94],[new Date(2015, 6, 25), 0.017922457937089, 98],[new Date(2015, 7, 01), 0.017391304347826, 96],[new Date(2015, 7, 08), 0.020658949243099, 116],[new Date(2015, 7, 15), 0.022210563133963, 127],[new Date(2015, 7, 22), 0.018635664216105, 109],[new Date(2015, 7, 29), 0.017215189873418, 102],[new Date(2015, 8, 05), 0.018827057647451, 113],[new Date(2015, 8, 12), 0.015666226912929, 95],[new Date(2015, 8, 19), 0.013627514600909, 84],[new Date(2015, 8, 26), 0.016435295994894, 103],[new Date(2015, 9, 03), 0.014991320814265, 95],[new Date(2015, 9, 10), 0.013443801782085, 86],[new Date(2015, 9, 17), 0.014195340225274, 92],[new Date(2015, 9, 24), 0.015899709524538, 104],[new Date(2015, 9, 31), 0.01468824940048, 98],[new Date(2015, 10, 07), 0.016303542315103, 110],[new Date(2015, 10, 14), 0.015366603248939, 105],[new Date(2015, 10, 21), 0.017199017199017, 119],[new Date(2015, 10, 28), 0.016353464352317, 114],[new Date(2015, 11, 05), 0.015175152460644, 107],[new Date(2015, 11, 12), 0.017195582273172, 123],[new Date(2015, 11, 19), 0.015932391244112, 115],[new Date(2015, 11, 26), 0.017364939360529, 126],[new Date(2016, 0, 02), 0.012350761630301, 90],[new Date(2016, 0, 09), 0.017178412011362, 127],[new Date(2016, 0, 16), 0.02000266702227, 150],[new Date(2016, 0, 23), 0.017802980350785, 135],[new Date(2016, 0, 30), 0.017995857068876, 139],[new Date(2016, 1, 06), 0.015858805473846, 124],[new Date(2016, 1, 13), 0.018248637688506, 144],[new Date(2016, 1, 20), 0.018827930174564, 151],[new Date(2016, 1, 27), 0.018682276746793, 150],[new Date(2016, 2, 05), 0.01676321952422, 136],[new Date(2016, 2, 12), 0.022989903904634, 189],[new Date(2016, 2, 19), 0.018874729502284, 157],[new Date(2016, 2, 26), 0.018192698982645, 152],[new Date(2016, 3, 02), 0.017251565638662, 146],[new Date(2016, 3, 09), 0.014193548387097, 121],[new Date(2016, 3, 16), 0.012823475046211, 111],[new Date(2016, 3, 23), 0.015923931721847, 139],[new Date(2016, 3, 30), 0.015510019246009, 137],[new Date(2016, 4, 07), 0.014972067039106, 134],[new Date(2016, 4, 14), 0.019345567101481, 175],[new Date(2016, 4, 21), 0.01909150757077, 174],[new Date(2016, 4, 28), 0.018032786885246, 165] ]);
// Set chart options
var options = {
animation: {startup: 'true', duration: '500'},
annotations: {'textStyle': {'color': 'black'}, 'style': 'point'},
chartArea: {right: '20', bottom: '70', left: '70', top: 50, height: '60%', width: '90%'},
'title':'Rolling Year: Trend by Week',
'width':1500,
'height':400,
hAxis: {textPosition: 'out', gridlines: {color: 'transparent'}, textStyle: {fontSize: '10'}, slantedText: 'true', ticks: [new Date(2015, 4, 30), new Date(2015, 5, 06), new Date(2015, 5, 13), new Date(2015, 5, 20), new Date(2015, 5, 27), new Date(2015, 6, 04), new Date(2015, 6, 11), new Date(2015, 6, 18), new Date(2015, 6, 25), new Date(2015, 7, 01), new Date(2015, 7, 08), new Date(2015, 7, 15), new Date(2015, 7, 22), new Date(2015, 7, 29), new Date(2015, 8, 05), new Date(2015, 8, 12), new Date(2015, 8, 19), new Date(2015, 8, 26), new Date(2015, 9, 03), new Date(2015, 9, 10), new Date(2015, 9, 17), new Date(2015, 9, 24), new Date(2015, 9, 31), new Date(2015, 10, 07), new Date(2015, 10, 14), new Date(2015, 10, 21), new Date(2015, 10, 28), new Date(2015, 11, 05), new Date(2015, 11, 12), new Date(2015, 11, 19), new Date(2015, 11, 26), new Date(2016, 0, 02), new Date(2016, 0, 09), new Date(2016, 0, 16), new Date(2016, 0, 23), new Date(2016, 0, 30), new Date(2016, 1, 06), new Date(2016, 1, 13), new Date(2016, 1, 20), new Date(2016, 1, 27), new Date(2016, 2, 05), new Date(2016, 2, 12), new Date(2016, 2, 19), new Date(2016, 2, 26), new Date(2016, 3, 02), new Date(2016, 3, 09), new Date(2016, 3, 16), new Date(2016, 3, 23), new Date(2016, 3, 30), new Date(2016, 4, 07), new Date(2016, 4, 14), new Date(2016, 4, 21), new Date(2016, 4, 28)], title: 'Reporting Week', format: 'yyyy-MM-dd'},
vAxis: {showTextEvery: '1', title: 'Percent & Count ', format: '#,###.#%'},
legend: {position: 'top'},
trendlines: { 0: {visibleInLegend: true, pointsVisible: false, title: 'Trend', color: 'red'} }
};
// Instantiate and draw our chart, passing in some options.
var chart = new google.visualization.LineChart(document.getElementById('DS_Trend'));
google.visualization.events.addListener(chart, 'ready', function () {
console.log(DS_Trend.innerHTML);
});
chart.draw(data, options);
}
</script>