Chart dont get mysql data using json file, need to run json file first

• April 27, 2018 at 7:00 pm #20487
  
  natasha11

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

  var chart = new CanvasJS.Chart(“chartContainer”, {
  animationEnabled: true,
  exportEnabled: true,
  theme: “light2”,
  zoomEnabled: true,
  title: {
  text: “Attendance”
  },
  axisX: {
  title: “Date”,
  titleFontSize: 10
  },
  axisY: {
  title: “Number of Present”,
  titleFontSize: 10,

  },
  data: [{
  type: “column”,
  dataPoints: dataPoints
  }]
  });

  function addData(data) {
  var dps = data.attendance;
  for (var i = 0; i < dps.length; i++) {
  dataPoints.push({
  x: new Date(dps[i][0]),
  y: parseInt(dps[i][1])
  });
  }

  chart.render();

  }

  $.getJSON(“http://localhost/fyp/results.json&#8221;, addData);

  }

  This would be my json file after running (results.json):
  {“attendance”:[[1520809200000,”1″]]}

  so, whenever i want to render the chart, i need to run “results.json” at the browse, then the chart will run according to the details in my mysql.
  but i dont want to extra loading the “Results.json” file. i want it to render and get the data from mysql automatically. i dont know where do i wrong

  April 30, 2018 at 10:54 am #20498
  
  Vishwas R

  @natasha11,

  Please take a look at this sample project for creating dynamic charts using data from MySQL database in PHP. Also, please refer to this documentation page for creating Dynamically Updating Charts from JSON API & AJAX.

  If this doesn’t suit your requirements, kindly share a sample project with sample data over google-drive or onedrive so that we can understand it better and help you out.

  —
  Vishwas R
  Team CanvasJS

  May 1, 2018 at 10:27 pm #20515
  
  natasha11

  http://fkiattendance.xyz/staff_report.php

  this is the link to my chart.

  <script type=”text/javascript”>
  window.onload = function () {
  var chart = new CanvasJS.Chart(“chartContainer”,{
  title:{
  text:”Rendering Multi Series Chart from database”
  },
  data: [{
  type: “column”,
  dataPoints : [],
  }]
  });

  $.getJSON(“report.php”, function(data) {
  $.each((data), function(key, value){
  chart.options.data[0].dataPoints.push({label: value[0], y: parseInt(value[1])});
  });
  chart.render();
  updateChart();
  });

  function updateChart() {
  $.getJSON(“report.php”, function(data) {
  chart.options.data[0].dataPoints = [];
  chart.options.data[1].dataPoints = [];
  $.each((data), function(key, value){
  chart.options.data[0].dataPoints.push({label: value[0], y: parseInt(value[1])});
  });

  chart.render();
  });
  }

  setInterval(function(){updateChart()}, 1000);
  }
  </script>

  it still wont come render.