Несколько клавиш Y с использованием линейного графика Морриса с использованием Джейсона - PullRequest
Новая
       7

Несколько клавиш Y с использованием линейного графика Морриса с использованием Джейсона

0 голосов
/ 10 апреля 2020

Я использую код в качестве ссылки от Морриса. js Линейный график, несколько ykeys от json. Моя проблема заключается в том, как вызвать данные с помощью переменной.

В настоящее время данные пусты. текущие данные после запуска var_dump:

array (120) {[0] => array (3) {["date"] => string (10) "2020-03-11" ["video" ] => string (19) "Facebook Video Auto" ["video_average"] => string (6) "155.69"} [1] => array (3) {["date"] => string (10) "2020 -03-11 "[" video "] => string (13)" Youtube 1080p "[" video_average "] => string (5)" 34.35 "} [2] => array (3) {[" date "] => string (10) "2020-03-11" ["video"] => string (13) "Youtube 2160p" ["video_average"] => string (5) "21.00"} [3] => array ( 3) {["date"] => string (10) "2020-03-11" ["video"] => string (12) "Youtube Auto" ["video_average"] => string (5) "30.83" } [4] => array (3) {["date"] => string (10) "2020-03-12" ["video"] => string (19) "Facebook Video Auto" ["video_average"] => string (6) "157.34"} [5] => array (3) {["date"] => string (10) "2020-03-12" ["video"] => string (13) " Youtube 1080p "[" video_average "] => string (5)" 25.17 "} [6] => array (3) {[" date "] => string (10)" 2020-03-12 "[" video " ] => string (13) "Youtube 2160p" ["video_average"] => string (5) "15.90"}

Могу ли я посоветовать, как мне отредактировать данные: jasonData 

<?php  $rows= mth_video_all($db);    ?>


<script>
							
var serries = JSON.parse('<?php echo $rows; ?>');  
console.log(serries);
var jsonData = serries;
var yvalues = Object.keys(jsonData[0]).filter(i=>i!='date');
							console.log(yvalues);
							
var chart = 
Morris.Line({
element: 'morris-bar-chart_1G',
data : jsonData,
xkey: ['date'],
ykeys: yvalues;
//labels: ['Video Performance'],
hideHover: 'auto',
xLabels: 'date',
xLabelAngle: 25,
xLabelsDiagonal: true,	
yLabelFormat: function (y)
{ return parseFloat(y).toFixed(1) + ' Mbps';},   // 20.0 Mbps		
padding: 40,
lineColors: ['#cc007a'],
smooth: true,
resize: true
});

chart.options.labels.forEach(function(label, i){
var legendItem = $('<span></span>').text(label).css('color', chart.options.lineColors[i])
				$('#legendfba').append(legendItem)	
				})
...