I'm using serial type amchart and used query results in dataProvider. Now i need to change the dataProvider values according to the input values so i used another chart. But chart 2 not displayed anyone suggest me the solution to change the dataProvider values.
<script src="https://www.amcharts.com/lib/3/amcharts.js"></script>
<script src="https://www.amcharts.com/lib/3/serial.js"></script>
<script src="https://www.amcharts.com/lib/3/plugins/export/export.min.js"></script>
<script src="https://www.amcharts.com/lib/3/themes/light.js"></script>
<script>
/**
* Define universal config
*/
var chartConfig = {
"type": "serial",
"theme": "light",
"marginRight": 80,
"dataProvider": [],
"valueAxes": [{
"axisAlpha": 0,
"position": "left",
"title": "Send count by each mailer "
}],
"startDuration": 1,
"graphs": [{
"balloonText": "<b>[[category]]: [[value]]</b>",
"fillColorsField": "color",
"fillAlphas": 0.9,
"lineAlpha": 0.2,
"type": "column",
"customBulletField": "bullet",
"bulletOffset": 10,
"bulletSize": 52,
"valueField": "visits"
}],
"chartCursor": {
"categoryBalloonEnabled": false,
"cursorAlpha": 0,
"zoomable": false
},
"categoryField": "country",
"categoryAxis": {
"gridPosition": "start",
"labelRotation": 45
},
"export": {
"enabled": true
}
};
/**
* Define function for cloning objects
* Taken from: http://stackoverflow.com/questions/728360/most-elegant-way-to-clone-a-javascript-object
*/
function clone(obj) {
var copy;
// Handle the 3 simple types, and null or undefined
if (null == obj || "object" != typeof obj) return obj;
// Handle Date
if (obj instanceof Date) {
copy = new Date();
copy.setTime(obj.getTime());
return copy;
}
// Handle Array
if (obj instanceof Array) {
copy = [];
for (var i = 0, len = obj.length; i < len; i++) {
copy[i] = clone(obj[i]);
}
return copy;
}
// Handle Object
if (obj instanceof Object) {
copy = {};
for (var attr in obj) {
if (obj.hasOwnProperty(attr)) copy[attr] = clone(obj[attr]);
}
return copy;
}
throw new Error("Unable to copy obj! Its type isn't supported.");
}
/**
* Create first chart
*/
// create a copy of the universal config
var chartConfig1 = clone(chartConfig);
// modify a copy of the config
chartConfig1.dataProvider = [
<?php
$livemailersend="select t1.emp_id,t2.isp,t2.fname,t2.iurl,sum(t1.sent),sum(t1.opens) from red_global t1, admin_emp t2 where t1.emp_id=t2.emp_id and t1.status_date between '$fromdate' and '$todate' and t1.emp_id in (2010,2015,2016,2020,2022,2023,2025,2027) group by 1,2,3,4 order by 5 desc;";
$lmailersend_fetch=mysql_query($livemailersend,$link1);
$color = array("#ccff33", "#ffcc00", "#ff9933","#ff33cc","#0099ff","#00ffcc","#00cc00","#0000cc","#6b616b","#a8a36b","#c5a6ff");
$i=0;
while($lmailersend=mysql_fetch_array($lmailersend_fetch))
{
echo"
{
'country': '".$lmailersend[2]."(".round(($lmailersend[5]/$lmailersend[4])*100 , 2) ."%)',
'visits': ".$lmailersend[4].",
'color': '".$color[$i]."',
'bullet': 'img/wxemp/".$lmailersend[3]."'
},";
$i=$i+1;
}?>
];
// create the chart
AmCharts.makeChart("chart1", chartConfig1);
/**
* Create second chart
*/
// create a copy of the universal config
var chartConfig2 = clone(chartConfig);
// modify a copy of the config
chartConfig2.dataProvider = [
<?php
$livemailersend="select t1.emp_id,t2.isp,t2.fname,t2.iurl,sum(t1.sent),sum(t1.opens) from red_global t1, admin_emp t2 where t1.emp_id=t2.emp_id and t1.status_date between '2017-05-18' and '2017-05-31' and t1.emp_id in (2010,2015,2016,2020,2022,2023,2025,2027) group by 1,2,3,4 order by 5 desc;";
$lmailersend_fetch=mysql_query($livemailersend,$link1);
$color = array("#ccff33", "#ffcc00", "#ff9933","#ff33cc","#0099ff","#00ffcc","#00cc00","#0000cc","#6b616b","#a8a36b","#c5a6ff");
$i=0;
while($lmailersend=mysql_fetch_array($lmailersend_fetch))
{
echo"
{
'country': '".$lmailersend[2]."(".round(($lmailersend[5]/$lmailersend[4])*100 , 2) ."%)',
'visits': ".$lmailersend[4].",
'color': '".$color[$i]."',
'bullet': 'img/wxemp/".$lmailersend[3]."'
},";
$i=$i+1;
}?>
];
// create the chart
AmCharts.makeChart("chart2", chartConfig2);
</script><link rel="stylesheet" href="https://www.amcharts.com/lib/3/plugins/export/export.css" type="text/css" media="all" /><?php
$fromdate = date("Y-m-d");;
$todate = date("Y-m-d");;
$proteam = "yah";
//-----------------------datewise live report-------------------------------------//
$action =$_POST['action'];
$fromdatepick =$_POST['fromdatepick'];
$todatepick =$_POST['todatepick'];
if(($action)=="datewise")
{
echo($action. "<br/>".$fromdatepick. "<br/>".$todatepick. "<br/>");
}
?>
<!-- BAR Chart -->
<div class="col-sm-12">
<div id="bg-default" class="panel-collapse collapse in">
<?php if(($action)!="datewise")
{
$where = ("and t1.status_date between '$fromdate' and '$todate'");?>
<div id="chart1" class="chartdiv" style="width : 100%; height : 500px;"></div>
<?php } else {
$where = ("and t1.status_date between '$fromdatepick' and '$todatepick'");?>
<div id="chart2" class="chartdiv" style="width : 100%; height : 500px;"></div>
<?php } ?>
</div>
</div>
