Home forums Using CanvasJS Updating a chart from local CSV file

Tagged: 

This topic contains 10 replies, has 2 voices, and was last updated by  jwk 3 months, 3 weeks ago.

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #20352

    jwk
    Member

    I am trying to get my canvasjs column chart to update from a local csv file. (foobar.csv)

    I got the column graph to work. See https://chem2.uaf.edu/facilities/Test/csvtest.htm
    but a version containing an updateChart() section fails. See https://chem2.uaf.edu/facilities/Test/csvtest-update.htm

    I tried to copy the json updateChart() format, but this is not working.

    So: How do I code the updateChart() section properly retrieve data from a csv file that might contain changing data?

    #20355

    Vishwas R
    Keymaster

    @jwk,

    Can you please check browser console for error Uncaught SyntaxError: Unexpected token ) - csvtest-update.htm:72. It seems like there is some mismatch of brackets in your code.

    If you are facing any other issue, kindly create jsfiddle or share static html/php files over onedrive/google-drive so that we can understand your code better and help you out?


    Vishwas R
    Team CanvasJS

    #20383

    jwk
    Member

    I attempted to correct the browser error by removing the “)”, but that just gave a different browser error…

    The csvtest.htm:
    https://drive.google.com/file/d/15zaOAP9pWG1RJGBdoj_f0MCpQ-PwhHH9/view?usp=sharing

    The csvtest-update.htm:
    https://drive.google.com/file/d/1qVUNu2pAjbymVej0WciVBaHCeMYImdYD/view?usp=sharing

    The foobar.csv :
    https://drive.google.com/file/d/1f6D_yexayCKpihbKKNTtvCZSakZIwnCY/view?usp=sharing

    #20384

    jwk
    Member

    Sorry, the hyperlinks for the 2nd and 3rd should be switched.

    #20387

    Vishwas R
    Keymaster

    @jwk,

    You have missed out closing window.onload function because of which its throwing error that can be seen in browser-console. Also we would suggest you to instantiate chart once and update dataPoints on every ajax-request instead of creating new chart on every ajax-request. Please download the updated code and let us know your feedback.


    Vishwas R
    Team CanvasJS

    #20407

    jwk
    Member

    Hi Team,
    Thank you for the suggested changes to the CVS updating chart! It is now updating. However, the number of columns increases by 4 (which is the number of rows in the CVS file) after each timeout interval..

    Perhaps the new dataPoints should overwrite the old dataPoints?

    John

    #20408

    jwk
    Member

    I created a jsfiddle page for this code:

    https://jsfiddle.net/jwkeller/yy3hdLtz/

    #20419

    jwk
    Member

    Another problem with the suggested code ( https://jsfiddle.net/jwkeller/yy3hdLtz/ ) is that, even at time=0, TWO copies of the CSV file data are plotted.

    #20421

    jwk
    Member

    OK I fixed it. See the above jsfiddle page. All I did was modify the updateChart function with some lines that removed the previous dataPoints using a dataPoints.shift statement.

    Once I have this webpage fully functional, I will update this forum with the URL so you can see it in action in the “real world”.

    #20431

    Vishwas R
    Keymaster

    @jwk,

    Glad that you fixed the issue :)


    Vishwas R
    Team CanvasJS

    #20509

    jwk
    Member

    OK it seems to be working. https://chem2.uaf.edu/facilities/WebMO/

    Much of the time these servers are not being used. However, anyone can send in a job by logging on as Guest, pwd webmo

    Do New Job, Create New Job, Lookup-Import-By Name, tetracyclin, OK.
    Click the right arrow (bottom right), choose NWChem (a quantum chemistry package), right-arrow,choose geometry optimization and all the other as defaults, click the advanced tab, change 2 to 8 under Cores, submit the job by clicking the right arrow.

    The bar graph should register under Rosewill.

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

You must be logged in to reply to this topic.