Home forums Using CanvasJS Mysql timestamp convert string to number.

This topic contains 5 replies, has 2 voices, and was last updated by  Vishwas R 3 months, 3 weeks ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #11707

    claus
    Member

    Hello .. New to PHP and Java Script.
    Have a mysql base where i receive the folowing :

    Jason data:
    [{“x”:”2016-07-20 13:13:50″,”y”:73.6},{“x”:”2016-07-20 13:13:56″,”y”:73.6},{“x”:”2016-07-20 13:14:01″,”y”:73.6},{“x”:”2016-07-20 13:14:07″,”y”:73.6},{“x”:”2016-07-20 13:14:13″,”y”:73.6},{“x”:”2016-07-20 13:14:18″,”y”:73.6},{“x”:”2016-07-20 13:14:24″,”y”:73.6},{“x”:”2016-07-20 13:14:30″,”y”:73.5},{“x”:”2016-07-20 13:14:36″,”y”:73.5},{“x”:”2016-07-20 13:14:41″,”y”:73.4},{“x”:”2016-07-20 13:14:47″,”y”:73.4},{“x”:”2016-07-20 13:14:53″,”y”:73.4},{“x”:”2016-07-20 13:14:58″,”y”:73.4},{“x”:”2016-07-20 13:15:04″,”y”:73.5},{“x”:”2016-07-20 13:15:10″,”y”:73.5},

    How can i convert (in sql or other place) the string data/time to number, so that CanvasJS can use it

    #11709

    Vishwas R
    Keymaster

    Claus,

    You can store the received JSON data in a variable, parse it to the format CanvasJS accepts and pass it to chart data. Here is an example.

    #11715

    claus
    Member

    Hello me again!!
    If I put this in a html file then i only get my “test” ?

    <!DOCTYPE HTML>
    <html>
    <head>
    <script src=”http://canvasjs.com/assets/script/canvasjs.min.js”></script>
    <script type=”text/javascript”>

    $(document).ready(function() {
    var dataPoints = [];

    var jsonData = [{
    “x”: “2016-07-20 13:13:50”,
    “y”: 73.6
    }, {
    “x”: “2016-07-20 13:13:56”,
    “y”: 73.6
    }, {
    “x”: “2016-07-20 13:14:01”,
    “y”: 73.6
    }, {
    “x”: “2016-07-20 13:14:07”,
    “y”: 73.6
    }, {
    “x”: “2016-07-20 13:14:13”,
    “y”: 73.6
    }, {
    “x”: “2016-07-20 13:14:18”,
    “y”: 73.6
    }, {
    “x”: “2016-07-20 13:14:24”,
    “y”: 73.6
    }, {
    “x”: “2016-07-20 13:14:30”,
    “y”: 73.5
    }, {
    “x”: “2016-07-20 13:14:36”,
    “y”: 73.5
    }, {
    “x”: “2016-07-20 13:14:41”,
    “y”: 73.4
    }, {
    “x”: “2016-07-20 13:14:47”,
    “y”: 73.4
    }, {
    “x”: “2016-07-20 13:14:53”,
    “y”: 73.4
    }, {
    “x”: “2016-07-20 13:14:58”,
    “y”: 73.4
    }, {
    “x”: “2016-07-20 13:15:04”,
    “y”: 73.5
    }, {
    “x”: “2016-07-20 13:15:10”,
    “y”: 73.5
    }];
    for (var i = 0; i < jsonData.length; i++) {
    dataPoints.push({
    x: new Date(jsonData[i].x),
    y: jsonData[i].y
    });
    }

    var chart = new CanvasJS.Chart(“chartContainer”, {
    title: {
    text: “Render Chart from JSON Data”
    },
    axisX: {
    title: “Time”,
    },
    axisY: {
    includeZero: false
    },
    data: [{
    type: “line”,
    dataPoints: dataPoints
    }]
    });

    chart.render();
    })

    </script>
    </head>
    <body>
    <div id=”chartContainer” style=”height: 300px; width: 100%;”></div>

    test
    </body>
    </html>

    #11717

    Vishwas R
    Keymaster

    Claus,

    Including jquery will solve the issue, as $(document).ready is used. Or you can use window.onload event.

    Check this jsfiddle for working code.

    #11742

    claus
    Member

    Have tryed to put in my Jason call, but it fails.. 🙁

    If mu jason url is

    http://www.fam-lind.dk/Jasondata.php

    Where will it go so that the data is passed on ?

    Best regards (and thanks)

    Claus

    #11744

    Vishwas R
    Keymaster

    Claus,

    Here is an example to get chart data from external json.

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.