All geek questions in one place

Zing Feed gets data from rest api

I get json data from rest api and I want to use it for input in ZingFeed.

<!DOCTYPE html>
<html>

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

<body>
    <script>
    function getNewData()
    {
        $.ajax({ 
            type: "GET",
            dataType: "json",
            headers: {
                Accept:"application/json",
                "Access-Control-Allow-Origin": "*"
            },
            url: "/PerformanceMonitor/showProcessUsage/chrome",
            success: function(data){ 
                var mem = data.mem.size/10000;
                 return mem/10000;
                //$("#processInfo").append(data.mem.size);
                //$("#processInfo").append("   ")

            }
        });
        //return parseInt(memSize);
    }

    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);
       tick.plot0 = parseInt(getNewData());
        //tick.plot0 = parseInt(1);
        callback(JSON.stringify(tick));
    };
    </script>
    <div id="processInfo"></div>
    <div id='chartDiv'></div>

</body>

</html>

It works great when seen in firebug. Data (i.e., mem in this case is really huge, so I split it twice before assigning it to tick.plot0). After you assigned tick.plot0, it shows Nan when it hangs in the developer tools. Could you help me build these tremendous values ​​in ZingFeed Charts

Thanks in advance

+4
source share
1 answer

Javascript. AJAX , . .

.

ZingChart. , 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>
   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.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) {
        $.ajax({
            type: "GET",
            dataType: "json",
            headers: {
                Accept: "application/json",
                "Access-Control-Allow-Origin": "*"
            },
            url: "/PerformanceMonitor/showProcessUsage/chrome",
            success: function (data) {
                var mem = data.mem.size/10000;
                var tick = {
                    plot0: parseInt(mem)
                };
                callback(JSON.stringify(tick));
            }
        });
    };
    </script>
    <div id="processInfo"></div>
    <div id='chartDiv'></div>

</body>

+8

Source: https://habr.com/ru/post/1584233/

More articles:


All Articles