FORUMS

Select any forum below to ask question

Home › Forums › Chart Support › graph with csv file

graph with csv file

Viewing 5 posts - 1 through 5 (of 5 total)
  • October 15, 2018 at 1:17 pm #23058

    Stella

    hi, i have tried the graph with csv data but it didnt display my data on the graph.
    here ismy coding

    <!DOCTYPE HTML>
<html>
<head> 
<?php
if(isset($_POST['submit'])){
	  $filename =  $_FILES['update_file']['name'];
	 $file = fopen($filename,"r")
	  or die('Error occurred when open the file ' . $filename );
	  
	  $table = array();
	  while($handle = fgetcsv($file))
	  {
		  var_dump($handle);
	  }
	  fclose($file);
	 // $json = json_encode($andle);
	  
?> 
<script>
window.onload = function () {
 
var dataPoints = <?= $handle ?> ;
 
var chart = new CanvasJS.Chart("chartContainer", {
	animationEnabled: true,
	exportEnabled: true,
	title:{
		text: "Temperature per 5 mins"
	},
	axisY: {
		title: "Temperature",
		includeZero: false
	},
	data: [{
		type: "line",
		//toolTipContent: "{y} metric tons",
		dataPoints: dataPoints
	}]
});
//chart.render();
 
$.get("#update_file", getDataPointsFromCSV);
 
//var updateInterval = 30000;
//setInterval(function () { updateChart() }, updateInterval);

function getDataPointsFromCSV(csv) {
	var csvLines = points = [];
	csvLines = csv.split(/[\r?\n|\r|\n]+/);
	for (var i = 0; i < csvLines.length; i++) {
		if (csvLines[i].length > 0) {
			points = csvLines[i].split(",");
			dataPoints.push({
				label: points[0],
				y: parseFloat(points[1])
			});
		}
	}
	chart.render();
}
 
}
</script>
<?php
}
?>
</head>
<body>

<script type="text/javascript" src="https://canvasjs.com/assets/script/jquery-1.11.1.min.js"></script>
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>

<form method="POST" enctype="multipart/form-data">
	
	<input type="file" name="update_file"/>
	<button type="submit" name="submit">Update</button>
	</form>
	<br/>
	
	<div id="chartContainer" style="height: 370px; width: 100%;"></div>
</body>
</html>
    October 15, 2018 at 2:25 pm #23060

    Priyanka M S

    @stella,

    Can you kindly share a sample project reproducing the issue you are facing along with a sample CSV file over Google-Drive or Onedrive, so that we can look into your code, understand it better and help you out?

    __
    Priyanka M S
    Team CanvasJS

    October 15, 2018 at 2:56 pm #23062

    Stella

    Here is the sample of csv file
    https://drive.google.com/open?id=1yTU-vKbZck6t5h8_81ZSu5JUU-yVzvB0

    October 16, 2018 at 6:08 pm #23079

    Priyanka M S

    @stella,

    Please take a look at this updated PHP file, which renders the chart using the data in CSV file (readcsv.csv).

    __
    Priyanka M S
    Team CanvasJS

    October 16, 2018 at 6:49 pm #23083

    Stella

    hi, that works well. Thank you :)

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

You must be logged in to reply to this topic.