changing data values in amcharts with drop down selection

问题

I have the question regarding an already provided solution at Update the dataset of multiple AmCharts with a Single Dropdown Change Event

I needed the same solution for one of my tasks. I have downloaded and saved all the css,js, jquery and json dataset files in the same directory and changed the addresses of those in src tags in my html file. Also changed the address in index.js file for the default dataset json. But this does not work. drop down menu shows but both charts are not even showing. Can you please help. Here is the code in my index.htm file

<!DOCTYPE html>
<html lang="en" >

<head>
<meta charset="UTF-8">
<title>Dynamically loading chart datasets</title>
<link rel="stylesheet" href="style.css"></head>
<body>
<script type="text/javascript" src="amcharts.js"></script>
<script type="text/javascript" src="serial.js"></script>
<script type="text/javascript" src="pie.js"></script>
<script type="text/javascript" src="none.js"></script>
<p class="selector">
<select onchange="setDataSet(this.options[this.selectedIndex].value);">
<option value="data1.json">Data Set #1</option>
<option value="data2.json">Data Set #2</option>
<option value="data3.json">Data Set #3</option>
</select> &lt; Select a data set
</p>
<div id="barchart"></div>
<div id="piechart"></div>
<script src='jquery-1.11.2.min.js'></script>
<script  src="index.js"></script>
</body>
</html>

in case the index.js code is also needed to be seen for any correction/amendment :

AmCharts.loadJSON = function(url) {
if (window.XMLHttpRequest) {
    var request = new XMLHttpRequest();
} else {
    var request = new ActiveXObject('Microsoft.XMLHTTP');
}
request.open('GET', url, false);
request.send();

  return eval(request.responseText);
};
var bar_chart = AmCharts.makeChart("barchart", {
"type": "serial",
"theme": "none",
"dataProvider": AmCharts.loadJSON('data1.json'),
"valueAxes": [{
"gridColor":"#FFFFFF",
"gridAlpha": 0.2,
"dashLength": 0
}],
"gridAboveGraphs": true,
"startDuration": 1,
"graphs": [{
"balloonText": "[[category]]: <b>[[value]]</b>",
"fillAlphas": 0.8,
"lineAlpha": 0.2,
"type": "column",
"valueField": "visits"      
}],
"chartCursor": {
"categoryBalloonEnabled": false,
"cursorAlpha": 0,
"zoomable": false
},
"categoryField": "country",
"categoryAxis": {
"gridPosition": "start",
"gridAlpha": 0,
"tickPosition":"start",
"tickLength":20
}
});
var pie_chart = AmCharts.makeChart("piechart", {
"type": "pie",
"theme": "light",
"dataProvider": AmCharts.loadJSON('data1.json'),
"valueField": "visits",
"titleField": "country",
"balloon":{
"fixedPosition":true
}
});
function setDataSet( dataset_url ) {
bar_chart.dataProvider = pie_chart.dataProvider =         
AmCharts.loadJSON(dataset_url);
bar_chart.validateData();
pie_chart.validateData();
}

来源：https://stackoverflow.com/questions/53962755/changing-data-values-in-amcharts-with-drop-down-selection

标签

javascript

amcharts