だから私はZingChartsを試してきましたが、これは一般的に私がとても気に入っています。しかし今、私はライブ フィードを作成しようとしていますが、ドキュメントはそれほど明確ではありません。HTTP を使用してチャートを新しい値で更新しようとしています。更新された値でチャート データを送信するページが必要なようです。それが私がやっていることです。このグラフは、JSON をライブ フィードとしてではなくブラウザに直接貼り付けたときに正しくレンダリングされます。強調されたテキストのみが /metrics_feed から正しくプルされ、グラフのアウトラインがレンダリングされますが、すべて灰色です。HTTP 経由で送信している JSON は次のとおりです。
{
"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>
そして、HTTP経由で送信する代わりにJSONを直接コピーすると、これはすべて機能するため、Zingchartsのドキュメントに欠けているものがあると思います。