A variable for dataPoints

• March 7, 2014 at 10:52 pm #6067
  
  Stupefiant

  Hello,

  I downloaded canvasJS recently and I encountered a problem that I wasn’t able to solve.
  In my code if I do :
  `
  
window.onload = function () {
var tableauDataPoints = [
{ label: "apple", y: 10 },
{ label: "orange", y: 15 }
];

  [...]
data: [
{
type: "column",
dataPoints: tableauDataPoints
}
]
[...]


  The graphic will be displayed and I have no problem.
  However I need to fill this table otherwise.
  So I did :

  
window.onload = function () {
var tableauDataPoints = new Object(); /* I also tested with [] and new Array() */

  for (i = 1; i < 3; i++) {
  tableauDataPoints[i] = { label: "test", y: i };
  alert(tableauDataPoints[i].label + tableauDataPoints[i].y);
  }

  [...]
data: [
{
type: "column",
dataPoints: tableauDataPoints
}
]
[...]


  The alerts are correct, but I have no display, and I have no idea why, so I changed the variable type of “tableauDataPoints”, but no effect.
  If you have any idea, it will be really helpful!

  Thanks in advance,

  • This topic was modified 10 years, 9 months ago by Stupefiant.
  March 11, 2014 at 6:40 pm #6075
  
  Sunil Urs

  Stupefiant,

  DataPoints needs to be an array. Can you try var tableauDataPoints = [] instead?

  If the above suggestion doesn’t work, please re-create the issue on JSFiddle, so that I can figure out the problem.

  —
  Sunil Urs

  May 17, 2016 at 11:20 am #10496
  
  JustXtasy

  $.each(data, function (i, item) {
  dps.push(“{label: “+item.ProfileName+”, y:”+ item.TotalCustomer+”},”);
  alert(dps[0]);
  });

  How do i do this..?

  is it possible for a datapoints to be like that..?

  i cant render the Chart because I do not know the format.

  May 17, 2016 at 1:06 pm #10498
  
  Vishwas R

  @justxtasy,

  You can build datapoints JSON as shown below.

  $.each(data, function (i, item) {
      dps.push({label: item.ProfileName, y: item.TotalCustomer});
  });

  Please take a look at this JSFiddle for an example.
  

  —
  Vishwas R
  Team CanvasJS

  August 7, 2017 at 8:17 pm #15767
  
  Rietveld

  Hi, i have the almost the same question.
  The following code is working:

  <script type="text/javascript">
  							  window.onload = function () {
  								var data = [
  									{ Name: "Open System", Total: os },
  									{ Name: "Rationeel", Total: r },
  									{ Name: "Intern Proces", Total: ip },
  									{ Name: "Human Relations", Total: hr }
  									];
  
  								var dps=[];
  								$.each(data, function (i, item) {
  									dps.push({label: item.Name, y: item.Total });
  									//alert(dps[0]);
  								});
  								
  								var chart = new CanvasJS.Chart("chartContainer",
  								{        
  								  data: [
  								  {
  									type: "column",
  									dataPoints: dps
  								  }
  								  ],
  								  title:{
  									text: "De vier kwadranten"
  								  },
  								  axisY:{			  
  									stripLines:[
  									{                
  										value:4
  									}
  									]                    
  								}, 
  								});
  								
  								chart.render();
  							  }
  							  </script>

  Only the variables for Total aren’t working.
  The variables are in my code like this:

  var os = "<?php echo $os; ?>";
  					var r = "<?php echo $r; ?>";
  					var ip = "<?php echo $ip; ?>";
  					var hr = "<?php echo $hr; ?>";

  Can you solve my problem? I want the php-variables in the chart.
  The php tot js variable lines are working, so the problem is in the code of the chart.

  August 8, 2017 at 12:20 pm #15771
  
  Vishwas R

  @rietveld,

  Datapoint y-value should be number, but in your case its string. Converting string values to number before assigning them to “y” should work fine in your case. dps.push({label: item.Name, y: Number(item.Total) });

  —
  Vishwas R
  Team CanvasJS