Я использую данные о цене биткойна и дату и время из таблицы MySQL. По какой-то странной причине он помещает одну и ту же дату для каждого значения x, а значения y перекошены и выглядят не по порядку. Самое последнее значение Y должно быть текущей ценой. Вот код, который я использую для создания диаграммы:
function drawAxisTickColors() { var data = new google.visualization.DataTable(); data.addColumn('number', 'Price'); data.addColumn('datetime', 'Date'); var dateArr2 = (<?php echo json_encode($dateArr); ?>).reverse(); for (i = 0; i < dateArr2.length; i++) { dateArr2[i] = dateArr2[i].split(/[- :]/); } var bitcoinArr = (<?php echo json_encode($bitcoinPriceArr); ?>).reverse(); console.log(bitcoinArr[0]); var length = Math.min(dateArr2.length, bitcoinArr.length); var rows = []; for (var i = 0; i < length; ++i) { rows.push([bitcoinArr[i], new Date(dateArr2[i])]); } data.addRows(rows); Я думаю, что причина, по которой только одна дата используется на диаграмме, имеет какое-то отношение к тому, как я использую массив javascript dateArr2 в PHP.
Измененный код с сайта satoshindex.com :
google.load('visualization', '1', {packages: ['corechart', 'line']}); google.setOnLoadCallback(drawAxisTickColors); function drawAxisTickColors() { var data = new google.visualization.DataTable(); data.addColumn('number', 'Price'); data.addColumn('datetime', 'Date'); // var dateArr2 = (<?php echo json_encode($dateArr); ?>).reverse(); var dateArr2 = (["2015-12-27 23:51:21","2015-12-27 23:51:02","2015-12-27 23:50:41","2015-12-27 23:50:21","2015-12-27 23:50:01","2015-12-27 23:49:41","2015-12-27 23:49:21","2015-12-27 23:49:01","2015-12-27 23:48:41","2015-12-27 23:48:21","2015-12-27 23:48:01","2015-12-27 23:47:41","2015-12-27 23:47:21","2015-12-27 23:47:01","2015-12-27 23:46:42","2015-12-27 23:46:22","2015-12-27 23:46:02","2015-12-27 23:45:41","2015-12-27 23:45:21","2015-12-27 23:45:01","2015-12-27 23:44:41","2015-12-27 23:44:21","2015-12-27 23:44:01","2015-12-27 23:43:41","2015-12-27 23:43:21","2015-12-27 23:43:01","2015-12-27 23:42:41","2015-12-27 23:42:21","2015-12-27 23:42:01","2015-12-27 23:41:41","2015-12-27 23:41:21","2015-12-27 23:41:01","2015-12-27 23:40:41","2015-12-27 23:40:21","2015-12-27 23:40:02","2015-12-27 23:39:41","2015-12-27 23:39:21","2015-12-27 23:39:01","2015-12-27 23:38:41","2015-12-27 23:38:21","2015-12-27 23:38:01","2015-12-27 23:37:41","2015-12-27 23:37:21","2015-12-27 23:37:01","2015-12-27 23:36:41","2015-12-27 23:34:41","2015-12-27 23:36:21","2015-12-27 23:36:01","2015-12-27 23:35:41","2015-12-27 23:35:21"]).reverse(); // var bitcoinArr = (<?php echo json_encode(array_reverse($bitcoinPriceArr)); ?>); var bitcoinArr = ([426.61,426.61,426.65,426.65,426.65,426.75,426.63,426.7,426.8,426.76,426.89,426.85,427.02,427.05,426.98,426.99,426.86,426.64,426.65,426.89,426.91,427.18,427.19,427.21,427.26,427.27,427.29,427.26,427.31,427.17,427.21,427.23,427.35,427.34,427.34,427.43,427.47,427.47,427.35,427.5,427.51,427.47,427.48,427.42,427.54,427.54,427.54,427.53,427.57,427.63]); var length = Math.min(dateArr2.length, bitcoinArr.length); var rows = []; for (var i = 0; i < length; ++i) { rows.push([bitcoinArr[i], new Date(dateArr2[i])]); } data.addRows(rows); var options = { // backgroundColor: '#E4E4E4', curveType: 'function', chartArea: { left: 0, top: 0, right: 0, bottom: 0, width: "100%", height: "100%" }, hAxis: { textPosition: 'none', baselineColor: 'none', gridlines: { color: 'none' }, }, vAxis: { textPosition: 'none', baselineColor: 'none', gridlines: { color: 'none' } }, colors: ['#2098d4', '#ffffff'], legend: 'none' }; var container = document.getElementById('chart_div'); var chart = new google.visualization.LineChart(container); chart.draw(data, options); }
<script type="text/javascript" src="https://www.google.com/jsapi"></script> <div id="chart_div"></div>