I've broken down 10+ years of 15-minute candlestick data into single years in order for it to load more quickly. I am relatively new to coding and am modifying one of amcharts terrific demos to see if I can get it to work and I'm running into a problem. I believe I am close as I can see the new data file loading in the console and sources but I do not understand what is needed to trigger the chart to load the new data file. Data files are named as "2023_day.js" etc.
Specifically, I am trying to modify script src path to load different data file and I'm not sure how to get the data file name passed to the index.js loadData function.
// Function that dynamically loadsdata in index.js
function loadData(ticker, series, granularity) {
var data = (window)["2023" + "_" + granularity];
am5.array.each(series, function(item) {
item.data.setAll(data);
});
}
index.html is as follows
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>GBPJPY Chart</title>
<link rel="stylesheet" href="index.css" />
</head>
<body>
<div id="chartcontrols" style="padding-left:15px"></div>
<div id="chartdiv"></div>
<script src="../index.js"></script>
<script src="../xy.js"></script>
<script src="../stock.js"></script>
<script src="../themes/Animated.js"></script>
<!--<script src="./data/2023_day.js"></script>-->
<select onChange="changeYear(this.value);">
<option value="-">Select Study Year</option>
<option value="2023">2023</option>
<option value="2022">2022</option>
<option value="2021">2021</option>
<option value="2020">2020</option>
<option value="2019">2019</option>
<option value="2018">2018</option>
<option value="2017">2017</option>
<option value="2016">2016</option>
<option value="2015">2015</option>
<option value="2014">2014</option>
<option value="2013">2013</option>
</select>
<div id="output">
<script id="year" type="text/javascript" src="./data/2023_day.js"></script>
</div>
<script type="text/javascript">
function changeYear(value) {
console.log(value);
var s = document.createElement("script");
s.type = "text/javascript";
s.src = "./data/"+value+"_day.js";
s.innerHTML = null;
s.id = "year";
document.getElementById("output").innerHTML = "";
document.getElementById("output").appendChild(s);
console.log(s.src);
}
</script>
<script src="index.js"></script>
<div id="chartdiv"></div>
</body>
</html>
data files are formatted as
window["2019_day"] = [
{Date:1546318800000,Open:139.82,High:139.82,Low:139.82,Close:139.82,Volume:3},
{Date:1546319700000,Open:139.82,High:139.82,Low:139.82,Close:139.82,Volume:3},
{Date:1546320600000,Open:139.82,High:139.82,Low:139.82,Close:139.82,Volume:3},
{Date:1546321500000,Open:139.82,High:139.82,Low:139.82,Close:139.82,Volume:3},
{Date:1546322400000,Open:139.89,High:139.89,Low:139.83,Close:139.83,Volume:3},
]
and are named using same convention (ie 2019_day.js). I can refer to any single data file and chart loads properly.
Any help would be much appreciated.