Home forums Chart Support Progress Indicator for an AJAX Request?

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #32389

    It is possible to have a progress indicator while the data are loading from an external AJAX data in file PHP?

    Thanks,
    Marco

    #32401

    Marco,

    Please take a look at this JSFiddle.


    Vishwas R
    Team CanvasJS

    #32403

    Pefect, thanks!
    Do you have also an example of import of external AJAX data for a RANGE BAR chart?

    I have to import LABEL and COLOR fields:
    dataPoints.push({label: value[0], x: value[1], y: value[2], color: value[3]});

    and value[2] is an array of timestamp:
    [
    [‘ONLINE’,1,[1609427388000,1609427389000],’rgba(83, 223, 128, .1)’],
    [‘ONLINE’,1,[1606843031000,1607672648000],’rgba(83, 223, 128, .8)’],
    [‘ONLINE’,1,[1607672660000,1607685057000],’rgba(83, 223, 128, .8)’]
    ]

    Marco

    #32421

    Marco,

    Parsing JSON to the format accepted by CanvasJS and passing it to chart-options should work fine. However, date-time over axisY is not possible as of now. which you can work-around it as shown in this JSFiddle.

    If you are still facing any issue, kindly create JSFiddle reproducing the issue and share it with us so that we can look into it and help you out.


    Vishwas R
    Team CanvasJS

    #32463

    Dear Vishwas,
    I’ve created a working example in jsfiddle as you suggested.

    I need to pass via externa Json file the rows:
    [ [‘ONLINE’,1,1610037371000,1610037372000,’rgba(83, 223, 128, .1)’],
    [‘ONLINE’,1,1607452607000,1607672648000,’rgba(83, 223, 128, .8)’],
    [‘ONLINE’,1,1607672660000,1607685057000,’rgba(83, 223, 128, .8)’],
    [‘ONLINE’,1,1607685669000,1607685832000,’rgba(83, 223, 128, .8)’],
    [‘ONLINE’,1,1607686070000,1607961179000,’rgba(83, 223, 128, .8)’] ]

    I’m tring to use the code but doesn’t work:

    $.getJSON(“datapoints.php”, function(data) {
    $.each(data, function(key, value){
    var range = new Array(2);
    range.push([value[2],value[3]); // timestamp example: 1607686070000,1607961179000
    dataPoints.push({label: value[0], x: value[1], y: range, color: value[4]});
    });
    chart.render();
    });

    Can you suggest me a solution?

    Thanks, Marco

    #32464

    Now I submit another test page with an array conversion jsfiddle

    #32468

    Marco,

    Please take a look at this updated JSFiddle which shows how to update data from external JSON.


    Vishwas R
    Team CanvasJS

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

You must be logged in to reply to this topic.