jrschafer on "[Plugin: amCharts: Charts and Maps] WP Plugin Stock Chart & mysql Database"

Hello,

I am trying use the plugin as a stock chart and pull the data from mysql. I read through the tutorial but it seems to differ a bit from the wp plugin.

So far I have:

1. Created a php file that queries the database and formats it in JSON:
   

   $prefix = '';
   echo "[\n";
   while ( $row = mysqli_fetch_assoc( $result ) ) {
     echo $prefix . " {\n";
     echo '  "category": "' . $row['day'] . '",' . "\n";
     echo '  "value1": ' . $row['cloud_index'] . '' . "\n";
     echo " }";
     $prefix = ",\n";
   }
   echo "\n]";

2. Setup the plugin and formatted the existing code for a new stock chart.

My problem is that I'm not sure how to incorporate the JSON output into the javascript code:

• Does it go into function generateChartData()?
• Should I be using the following function somewhere?
  `AmCharts.ready(function() {
  // load the data
  var chartData = AmCharts.loadJSON('data.php');`
• Do I need this function? AmCharts.loadJSON = function(url)

Here is the code in WordPress:

var %CHART%_1 = [];

generateChartData();

function generateChartData() {
//THIS IS WHERE I THINK I NEED HELP
	var firstDate = new Date();
	var a1 = 

		%CHART%_1.push({
			date: newDate,
			value: a1,

		});

	}
}

AmCharts.makeChart("%CHART%", {
	type: "stock",
    "theme": "none",
    pathToImages: "http://www.amcharts.com/lib/3/images/",

	dataSets: [{
			title: "Cloud Index",
			fieldMappings: [{
				fromField: "value",
				toField: "value"
			}, {
				fromField: "volume",
				toField: "volume"
			}],
			dataProvider: %CHART%_1,
			categoryField: "date"
		},

	],

	panels: [{

			showCategoryAxis: true,
			title: "Value",
			percentHeight: 70,

			stockGraphs: [{
				id: "g1",

				valueField: "value",
				comparable: true,
				compareField: "value",
				balloonText: "<a href="http://codex.wordpress.org/title">title</a>:<b><a href="http://codex.wordpress.org/value">value</a></b>",
				compareGraphBalloonText: "<a href="http://codex.wordpress.org/title">title</a>:<b><a href="http://codex.wordpress.org/value">value</a></b>"
			}],

			stockLegend: {
				periodValueTextComparing: "[[percents.value.close]]%",
				periodValueTextRegular: "[[value.close]]"
			}
		}

	],

	chartScrollbarSettings: {
		graph: "g1"
	},

	chartCursorSettings: {
		valueBalloonsEnabled: true
	},

	periodSelector: {
		position: "left",
		periods: [{
			period: "MM",
			selected: true,
			count: 1,
			label: "1 month"
		}, {
			period: "YYYY",
			count: 1,
			label: "1 year"
		}, {
			period: "YTD",
			label: "YTD"
		}, {
			period: "MAX",
			label: "MAX"
		}]
	},

	dataSetSelector: {
		position: "left"
	}
});

Thanks.

https://wordpress.org/plugins/amcharts-charts-and-maps/