Пример кода канала ZingCharts, который не может отобразить диаграмму

Я новичок в ZingChart. Я следую этому руководству здесь http://www.zingchart.com/docs/features/feeds/#feeds__js

Я написал html-файл ZingFeed.html

<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<script>

var chartData={"refresh":{
    "type":"feed",
    "transport":"js",
    "url":"feed()",
    "interval":200
};


window.onload=function(){
    zingchart.render({
        id:"chartDiv",
        data:chartData,
        height:600,
        width:"100%"
    });
};

window.feed = function(callback) {
    var tick = {};
    tick.plot0 = parseInt(10+900*Math.random(), 10);
    callback(JSON.stringify(tick));
};

</script>
<div id='chartDiv'></div>
</body>
</html>

На экране ничего не отображается. Ваша помощь будет очень полезна и высоко оценена.


javascript zingchart
person Nikita Shah    schedule 23.04.2015    source источник

Ответы (1)


arrow_upward
4
arrow_downward

Во-первых: вы загружаете библиотеку ZingChart? Я спрашиваю только потому, что он не включен в вашу демонстрацию. Если нет, вставьте это в <head> нашего файла:

<script src='http://cdn.zingchart.com/zingchart.min.js'></script>

В вашем объекте chartData также отсутствует тип.

В вашем объекте chartData также отсутствует закрывающая скобка.

Вот рабочий пример. Я работаю в команде ZingChart. Дайте мне знать, если я могу помочь с чем-то еще.

<!DOCTYPE html>
<html>

<head>
    <meta charset="ISO-8859-1">
    <title>Insert title here</title>
    <script src='http://cdn.zingchart.com/zingchart.min.js'></script>
</head>

<body>
    <script>
    var chartData = {
        "type":"line",
        "refresh": {
            "type": "feed",
            "transport": "js",
            "url": "feed()",
            "interval": 200
        },
        "series":[
            {
                "values":[]
            }
        ]
    };


    window.onload = function() {
        zingchart.render({
            id: "chartDiv",
            data: chartData,
            height: 600,
            width: "100%"
        });
    };

    window.feed = function(callback) {
        var tick = {};
        tick.plot0 = parseInt(10 + 900 * Math.random(), 10);
        callback(JSON.stringify(tick));
    };
    </script>
    <div id='chartDiv'></div>
</body>

</html>

person Patrick RoDee    schedule 23.04.2015
comment
Спасибо :) Я с нетерпением жду создания живой диаграммы. Данные могут поступать из остальных API. Не могли бы вы указать мне, где я должен искать. zingchart.com/demos/real-time-data-feed-chart Я прочитал это, хотел бы узнать больше о том, как именно использовать ZingCharts. Заранее спасибо :) - person Nikita Shah; 24.04.2015
comment
stackoverflow.com/questions/29894115 / не могли бы вы заранее взглянуть на это новое сомнение, с которым я столкнулся Такс. - person Nikita Shah; 27.04.2015