Zingcharts活飼料沒有渲染圖

所以我一直在嘗試ZingCharts，一般我喜歡一噸。但是現在我正在嘗試創建一個活動飼料，並且這種說法並不清楚。我正嘗試使用HTTP來更新具有新值的圖表。看起來我需要有一個頁面發送帶有更新值的圖表數據，這就是我正在做的。當我直接在瀏覽器中過濾JSON而不是實時饋送時，此圖表正確呈現，但現在只有強調文本正確地從/ metrics_feed中拉出並呈現圖表的輪廓，但它全部爲灰色。我通過HTTP發送的JSON是：Zingcharts活飼料沒有渲染圖

{ 
    "crosshair-x": {}, 
    "legend": {}, 
    "plot": { 
    "valueBox": { 
     "placement": "top", 
     "type": "max, min", 
     "visible": false 
    } 
    }, 
    "scaleX": { 
    "label": { 
     "text": "Metric count" 
    } 
    }, 
    "scaleY": { 
    "label": { 
     "text": "Metric value" 
    } 
    }, 
    "series": [ 
    { 
     "text": "data point", 
     "values": [ 
     -4.69283003950355, 
     -4.692830039503548, 
     -4.6928300395035505 
     ] 
    } 
    ], 
    "title": { 
    "text": "metrics over time" 
    }, 
    "tooltip": {}, 
    "type": "line" 
}

而且我打算每隔一秒左右更新一次這些值。這是我的HTML端代碼：

<head> 

... 

<script type="text/javascript"> 
var myChart = {"refresh":{ 
    "type":"feed", 
    "transport":"http", 
    "url":"/metrics_feed", 
    "interval":1000 
    } 
}; 
    window.onload=function(){ 
     zingchart.render({ 
      id:"myChartDiv", 
      data:myChart, 
      height:600, 
      width:"100%" 
     }); 
    }; 

</script> 
</head> 

<body> 
    <div id="myChartDiv"></div> 
</body>

而這所有的作品時，我在那裏複製的直接JSON，而不是在其發送的HTTP所以有什麼我的Zingcharts文件，我想在失蹤。

來源

2015-02-11 clifgray

我在ZingChart支持團隊，我很樂意幫你解決這個問題。您需要在頁面中配置大部分圖表設置和對象，所以在myChart對象中。這意味着crosshair-x，legend，plot等等應該在頁面中都是靜態的，而不是通過HTTP傳遞的。在JSON對象中，爲您將要傳遞給圖表的每個系列創建系列數組中的空系列對象。所以，如果你只會有一個系列策劃：

{ 
"type": "line", 
"title": { 
    "text": "metrics over time" 
}, 
/* Additional objects (tooltip, legend, crosshair, etc...) omitted for brevity */ 
"series": [ 
    { 
     "values": [] 
    } 
    ] 
}

而且如果你將通過2個系列值：

{ 
"type": "line", 
"title": { 
    "text": "metrics over time" 
}, 
/* Additional objects (tooltip, legend, crosshair, etc...) omitted for brevity */ 
"series": [ 
    { 
     "values": [] 
    }, 
    { 
     "values": [] 
    } 
    ] 
}

「刷新」對象也應放置在MYDATA的對象，在頂層：

{ 
"type": "line", 
"title": { 
    "text": "metrics over time" 
}, 
/* Additional objects (tooltip, legend, crosshair, etc...) omitted for brevity */ 
"refresh":{ 
    "type":"feed", 
    "transport":"http", 
    "url":"/metrics_feed", 
    "interval":1000 
}, 
"series": [ 
    { 
     "values": [] 
    }, 
    { 
     "values": [] 
    } 
    ] 
}

根據您的圖表中你要多少一系列的對象，配置腳本通過採用以下格式的值：

[ { "plot0" : 27, "plot1" : 34 } ]

下面是我們使用的the chart under the HTTP section of our feeds article腳本feeds.php：

<?php 
$min = isset($_GET['min'])?intval($_GET['min']):0; 
$max = isset($_GET['max'])?intval($_GET['max']):50; 
$plots = isset($_GET['plots'])?intval($_GET['plots']):1; 
?> 
[ 
    { 
     <?php 
     for ($plot=0;$plot<$plots;$plot++) { 
     ?> 
     "plot<?php echo $plot; ?>" : <?php echo rand($min, $max); ?>, 
     <?php 
     } 
     ?> 
     "scale-x" : "<?php echo date('H:i:s'); ?>" 
    } 
]

此腳本還返回被注入到我們的規模-x對象空值數組時間戳。您可以看到一個示例回覆here。

如果我們的文檔沒有說清楚，我很抱歉，我會盡快更新補充說明。無論如何，我希望能幫到你！讓我知道你是否需要更多的幫助。

來源

2015-02-11 19:12:57 Stalfos

好的太棒了，這是一個很大的幫助。該腳本很好，但至少對我來說是一個實際的json文檔返回的例子，這將是最有幫助的！雖然這很好。 – clifgray 2015-02-11 19:35:13

像這樣的東西需要進入zingchart文檔的例子。我在5分鐘內完成了這個答案，但是在2個小時內我無法完成，試圖從http://www.zingchart.com/docs/features/feeds/中刪除這些例子。 – Aaron 2015-06-11 01:51:49

Zingcharts活飼料沒有渲染圖

回答

相關問題