Forum Replies Created

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • in reply to: Graph a CSV file #8792

    sid

    I am currently in need for a way to create graph on the fly. But using I canvasJS, I need to plot graphs from the beginning. Which mean I need all dataPoints at once. The below is my eg.

    data.csv at 9:00 am
    Time,Value
    9:00,10

    data.csv at 9:05 am
    Time, Value
    9:05,20

    data.csv at 9:10 am
    Time,Value
    9:10,30

    and so on….

    Currently I have to keep on saving each data point and plot it from starting. However, there should be a way to read this file and append it to the graph.
    Would highly appreciate if you could reply on the same. I hope my requirement is clear enough.

    in reply to: Graph a CSV file #8734

    sid

    Thanks Anjali , could you please also help me with.
    1. I need to know if there could be a way that graph is also (appended) say after every 2 minutes. Increment already plotted graph (and dont do whole work of plotting from beginning again). Basically it should store already plotted points and avoid replots.I hope I’m clear with my requirement. I basically need an append funtion that pushes newer data points from csv.

    2. My csv has multiple columns, say “n” , is there a way to push dataPoints from each column in a better way. Because currently i use 1 for loop for 1 column. The number of columns can be different, sometimes 2 or 3 or 10. This should be dynamic in some way.

    in reply to: Graph a CSV file #8731

    sid

    Anjali, thanks for your response.
    Sorry for my last post, datapoints were fine but scale was very far scattered. dataPoints were in 10^6 and datapoints2 were in 10^9, which is why both were not being shown properly. (@admin:last post can be deleted). However, is there a way to automatically scale line graphs. eg. say 1 line graph has values in 10^2 and other line graph has values in 10^8 . Is there a way to show both lines on 1 graph (using scaling for y axis)

    in reply to: Graph a CSV file #8723

    sid
            function processData(allText) {
                    var allLinesArray = allText.split('\n');
                    if(allLinesArray.length>0){
                            var dataPoints = [];
                            var dataPoints2= [];
                            for (var i = 1; i <= allLinesArray.length-1; i++) {
                                    var rowData = allLinesArray[i].split(',');
                                    dataPoints.push({label:rowData[0],y:parseInt(rowData[1])});
                            }
                            for (var i = 1; i <= allLinesArray.length-1; i++) {
                                    var rowData = allLinesArray[i].split(',');
                                    dataPoints2.push({label:rowData[0],y:parseInt(rowData[2])});
                            }
                            drawChart(dataPoints,dataPoints2);
                            
    
                    }
            }
    
            function drawChart( dataPoints,dataPoints2) {
                    var chart = new CanvasJS.Chart("chartContainer", {
                    theme: "theme2",
                    title:{
                            text: "Gati Chart"
                    },
                    zoomEnabled:true,
                    data: [
                    {
                            type: "line",
                            dataPoints: dataPoints
                    },
                    
                    
                    {
                            type: "line",
                            dataPoints: dataPoints2
                    }]
                    });
    
                    chart.render();
            }
    

    I am tring to plot 2 line graphs, using the above code I get 2 line blue for dataPoints and red for daatPoints2.But I am getting a straight line for dataPoints and correct line graph for dataPoints2, can you suggest whats wrong with my code? On hovering the blue line, it gives me correct values in tooltip but why is it coming as a straight line?

    in reply to: Graph a CSV file #8717

    sid
    for (var i = 1; i <= allLinesArray.length-1; i++) {
                                    var rowData = allLinesArray[i].split(',');
                                    dataPoints.push({label:rowData[0],y:parseInt(rowData[1])});
                                    dataPoints.push({label:rowData[0],y:parseInt(rowData[2])});
                                   //dosnot plot 2 lines,plots values but not in correct way
                            }
    • This reply was modified 5 years ago by sid.
    in reply to: Graph a CSV file #8714

    sid

    Thanks for such an awesome utility!.
    I’m pretty new to web dev, but canvasjs has been a great motivation.
    I have my data.csv regularly being updated (appended)

    1. I need to know if there could be a way that graph is also (appended) say after every 2 minutes. Increment already plotted graph (and dont do whole work of plotting from beginning again). Basically it should store already plotted points and avoid replots.

    2. Suppose my csv has more than 2 columns (say 10), can I plot multi line graphs by specifying column names. eg. to find correlation between 2 or more value. Line colour legeds can be taken from column names (headers)

    Moving forward I would like my web page to have an option to show/hide lines. eg. by default it shows lines for all columns. (This is just an additional utility which may come handy,can be ignored for now)

    AS far as my point 2 of multiple line graph is concerned, I think, we need to just send other column values in the below code. dataPoints for all columns should be passed instead.

    for (var i = 1; i <= allLinesArray.length-1; i++) {
                                    var rowData = allLinesArray[i].split(',');
                                    <strong>dataPoints.push({label:rowData[0],y:parseInt(rowData[1])});</strong>
                            }

    Thanks is advance.

    • This reply was modified 5 years ago by sid. Reason: adding more details
    • This reply was modified 5 years ago by sid.
Viewing 6 posts - 1 through 6 (of 6 total)