I was kinda trying to make a chart out of PyTrends and it seems like js code is working, but something just messes up in html and I was really conserned till the point, where there was no info in the internet. In a console it always shows an error 'Calling Plotly.plot as if redrawing but this container doesn't yet have a plot. <div id="myDiv" class="js-plotly-plot">…'. Please, help. Here are the code parts, that seem to not work:
<html>
<head>
<title>DungeonMaster</title>
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
<script src="{{url_for('static', filename='charts.js')}}"></script>
<style>
body, #charts{
height: 100%;
}
</style>
</head>
<body onload="loadChart();">
<div id="myDiv"></div>
</body>
</html>
JS code for processing the data into the chart
function loadChart() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function(){
if (this.readyState === 4 && this.status === 200){
console.log(this.response);
var chartData = getChartParams(this.response);
Plotly.plot('myDiv', chartData, chartLayout);
}
};
xhttp.open("GET", "/data");
xhttp.send();
var chartLayout = {
title:"Popularity dynamics of Skateboarding"
}
function getChartParams(jsonstr) {
var file = JSON.parse(jsonstr)
var chartObject = {
x : file[1],
y : file[0],
type:'scatter'
}
return chartObject
}
}
Thank you very much!