2017-01-09 6 views
1

Я изначально передавал свою временную метку на основе unix на jix_encode для использования с dygraphs, это фактически работает, за исключением одной проблемы, тогда вам нужно использовать значение xaxis valueFormatter и axisLabelFormatter и дату/время на оси не будет совпадать с датой/временем, указанным в легенде значений (верхний правый угол диаграммы).Как десериализовать дату json для формата собственного массива dygraph

вот мой оригинальный метод, который работает за исключением легенды неправильно, test.php:

<?php 
    $table[] = [1482407341000,92,86]; 
    $table[] = [1482407342000,92,86]; 
    $table[] = [1482407343000,91,85]; 
    $table[] = [1482407344000,92,85]; 
    $table[] = [1482407345000,91,84]; 
    $table[] = [1482407346000,90,83]; 
    $table[] = [1482407347000,91,82]; 
    $table[] = [1482407348000,92,82]; 
    $jsontable = json_encode($table); 
    echo $jsontable; 
?> 
<html><head><script type="text/javascript" src="dygraph-combined-dev.js"></script></head> 
<body><div id="graph" style="width:100%; height:96%;"></div> 
<script type="text/javascript"> 
    g = new Dygraph(document.getElementById("graph"), 
    <?=$jsontable?>, 
    { 
     legend: 'always', 
     labelsDivStyles: { 'textAlign': 'right' }, 
     labels: ['Date', 'spO2', 'pr'], 
     axes: { 
     x: { 
     valueFormatter: Dygraph.dateString_, 
     axisLabelFormatter: Dygraph.dateAxisFormatter, 
     ticker: Dygraph.dateTicker 
     } 
     } 
    }); 
</script></body></html> 

Теперь, вот моя попытка решения, если вы на самом деле использовать объект даты затем Xaxis выровняет с легендой (http://jsfiddle.net/b0g9pd1h/), это должно работать, но dygraphs не загружается, так что все еще должна быть проблема с форматом моей переменной, сообщение об ошибке не отображается, поэтому я не уверен, почему не загружаются dygraphs.

с dygraphs Ваше значение будет либо целым числом/плавающей точкой, либо оно будет строкой/датой, поэтому с моей функцией JSON.parse json_deserialize_helper Я обрабатываю всю строку как дату и пытаюсь вернуть дату объект, код выглядит хорошо для меня, поэтому я не уверен, что я делаю неправильно.

test2.php:

<?php 
    $table[] = ["1482407341000",92,86]; 
    $table[] = ["1482407342000",92,86]; 
    $table[] = ["1482407343000",91,85]; 
    $table[] = ["1482407344000",92,85]; 
    $table[] = ["1482407345000",91,84]; 
    $table[] = ["1482407346000",90,83]; 
    $table[] = ["1482407347000",91,82]; 
    $table[] = ["1482407348000",92,82]; 
    $jsontable = json_encode($table); 
    echo $jsontable; 
?> 
<html><head><script type="text/javascript" src="dygraph-combined-dev.js"></script> 
<script type="text/javascript"> 
    function json_deserialize_helper(key,value) { 
    if (typeof value === 'string') { 
     return new Date(parseInt(value)); 
    } 
     return value; 
    } 
</script></head> 
<body><div id="graph" style="width:100%; height:100%;"></div> 
<script type="text/javascript"> 
    var data = <?=$jsontable?>; 
    var json = JSON.parse(data,json_deserialize_helper); 
    g = new Dygraph(document.getElementById("graph"), 
    json, 
    { 
     legend: 'always', 
     labelsDivStyles: { 'textAlign': 'right' }, 
     labels: ['Date', 'spO2', 'pr'] 
    }); 
</script></body></html> 

также, может быть, это не самый эффективный способ сделать это, хотя разбор строки на объект даты кажется довольно эффективным для меня, если у кого есть альтернативное решение, пожалуйста, дай мне знать.

ответ

0

Если этот ответ поможет вам решить проблему, над которой работает ваша работа, пожалуйста, перейдите на этот пост, я новичок на этом сайте.

Я получил эту работу, вам нужно прокручивать и изменять элементы по одному, ниже работает решение, а значения как оси X, так и легенды отображаются правильно, я могу установить labelUTC в true или false , и они оба отображаются правильно. Ключ использовал объект Date вместо строки даты, как я это делал ранее.

<?php 
    $table[] = [1482407341000,92,86]; 
    $table[] = [1482407342000,92,86]; 
    $table[] = [1482407343000,91,85]; 
    $table[] = [1482407344000,92,85]; 
    $table[] = [1482407345000,91,84]; 
    $table[] = [1482407346000,90,83]; 
    $table[] = [1482407347000,91,82]; 
    $table[] = [1482407348000,92,82]; 
    $jsontable = json_encode($table); 
    //echo $jsontable; 
?> 
<html><head><script type="text/javascript" src="dygraph-combined-dev.js"></script> 
</head><body><div id="graph" style="width:100%; height:100%;"></div> 
<script type="text/javascript"> 
    var data = <?=$jsontable?>; 
    //loop through json table and convert unix timestamp to date object: 
    for (var i in data) { 
     data[i][0] = new Date(data[i][0]); 
    } 
    g = new Dygraph(document.getElementById("graph"), 
    data, 
    { 
     legend: 'always', 
     labelsDivStyles: { 'textAlign': 'right' }, 
     labels: ['Date', 'spO2', 'pr'] 
    }); 
</script></body></html> 

 Смежные вопросы

  • Нет связанных вопросов^_^