Как показать данные динамического массива php в диаграмме c3js?

У меня многомерный массив ($array) как это,

{
"2015-11-17": {
"department1":"0.5700",
"department3":"0.0000"},
"2015-11-18": {
"department1":"0.5700"},
"2015-11-20": {
"department1":"0.0000"},
"2015-11-23": {
"department1":"1.7100",
"department2":"1.7100",
"department3":"2.8500",
}
.
.
.
}

Это динамический массив, данные которого поступают из базы данных. Все данные существуют в $array переменная. Приведенные выше данные являются более чем. Я просто покажу немного, потому что данные поступают из базы данных.

Я хочу показать эти данные на графике c3js, как этот формат,

json:[{
"date": "2015-11-17",
"department1": ""0.5700"",
"department2": "0.0000",
"department3": "0.0000",
"department4": "0.0000",
}],

И мне нужно показать четыре данных отдела для каждой даты.

В массиве вы можете увидеть когда-нибудь один или два отдела. Я хочу добавить все четыре отдела для каждого дня, когда я изменяю вышеуказанный формат JSON, чтобы показать в диаграмме.

Например, в 2015-11-17, он имеет отделы 1 и 3. Я хочу добавить следующие отделы 2 и 4 с ‘0’ в этот день.

Я хочу добавить еще один отдел на каждый день, просто так.

Когда я пытаюсь изменить $array в вышеуказанном формате, я не получаю правильный результат.
Вот что я пытаюсь,

<div id='chart'></div>
<script>
var chart = c3.generate({
bindto: '#chart',
data: {
x: 'date',
xFormat: '%Y-%m-%d',
json:[
<?php
for ($i = 0; $i <  count($array); $i++) {
$key=key($array);
$val=$array[$key];
if ($val<> ' ') {
foreach ($val as $k=>$v) {
?>
{
'date':<?php echo $key?>,
<?php echo $k?> : <?php echo $v?>,
},

<?php
}
}
next($array);
}
?>],

},
legend: {
position: 'right',
},
line: {
width:0.5
},
axis: {
x: {
type: 'timeseries',
tick:{
format: '%Y-%m-%d',
rotate: 75,
},
label: {
text: 'Date',
position: 'outer-center'
}
}
},
grid: {
y: {
show:true,
}
},
});
</script>

Итак, теперь у меня есть проблема, чтобы показать данные массива в диаграмме. Я очень благодарен за любой ответ и предложение.

Вот образец динамического изображения графика того, что я хочу, образец диаграммы

1

Решение

Пожалуйста, проверьте приведенный ниже код. Обратите внимание:
$deptNames = массив названий отделов, как показано в примере вывода.
$dataArray = это массив, который поступает из базы данных напрямую
— вместо вывода результатов вы можете сохранить его в любой переменной и получить к нему доступ соответственно.

$deptNames = array('department1','department2','department3','department4');
$resultArray = array();
$index = 0;
foreach($dataArray as $date => $data) {
$resultArray[$index] = array();
if(is_array($data)) {
$dataDeptNames = array_keys($data);
$diff = array_diff($deptNames,$dataDeptNames);
if($diff && count($diff) > 0) {
foreach($diff as $notExistDept) {
$data[$notExistDept] = "0.0000";
}
}
$resultArray[$index] = $data;
$resultArray[$index]['date'] = $date;
ksort($resultArray[$index]);
}
$index++;
}
echo json_encode($resultArray);

Это даст вам вывод как:

[
{
"date":"2015-11-17",
"department1":"0.5700",
"department2":"0.0000",
"department3":"0.0000",
"department4":"0.0000"},
{
"date":"2015-11-18",
"department1":"0.5700",
"department2":"0.0000",
"department3":"0.0000",
"department4":"0.0000"},
{
"date":"2015-11-20",
"department1":"0.0000",
"department2":"0.0000",
"department3":"0.0000",
"department4":"0.0000"},
{
"date":"2015-11-23",
"department1":"1.7100",
"department2":"1.7100",
"department3":"2.8500",
"department4":"0.0000"}
]
1

Другие решения

Хорошо, если вы получите массив и сохранены в переменной, то вы можете использовать эту чистую функцию JS, чтобы преобразовать ее в нужный вам формат:

var convertArr = function(x){
var y = [];
for (var k1 in x) {
if (x.hasOwnProperty(k1)) {
var obj = {};
obj['date'] = k1;
var tmp = [];
for (var k2 in x[k1]){
if (x[k1].hasOwnProperty(k2)){
tmp.push(k2[k2.length-1]);
obj[k2] = x[k1][k2];
}
}
var no = ["1","2","3","4"];
var tmpSet = new Set(tmp);
var noSet = new Set(no);
var diff = no.filter(function(z) { return !tmpSet.has(z); })
.concat(tmp.filter(function(z){ return !noSet.has(z); }));
for (var i = 0; i < diff.length; i++){
obj['department'+diff[i]] = '0.0000';
}
y.push(obj);
}
}
return y;
}

Оттуда вы можете продолжить.

Надеюсь, поможет.

1

По вопросам рекламы ammmcru@yandex.ru
Adblock
detector