Black Lives Matter. Please consider donating to Black Girls Code today.
https://www.blackgirlscode.com

Need Help: Getting a blank chart without data using Plotly.js

I am trying a very simple chart and do not get any data in the chart only the labeled axes. The console log shows the following message: “Calling Plotly.plot as if redrawing but this container doesn’t yet have a plot”. A search for this message in this forum led to one post where the individual did not have the data in an array, which I do as I had the variables printed to the console to check. I am on a Mac using Safari 13.1. The following code is producing the error.

function genData() {
	/*
		m = 9.873sin(4pid/365 + 3.588) - 7.655sin(2pid/365)
		For plotly.js need an object with two arrays (x,y) with the data 
		and type: 'scatter'
	*/
	
	const pi = Math.PI;
	const yrOfDays = 4;
	
	let days = [];
	for (i = 0; i <= yrOfDays; i++)
	{
		days = days.concat([i+1]);
	}
	
	let minutes = [];
	let min = 0;
	for (i = 0; i <= yrOfDays; i++)
	{
		min = 9.873 * Math.sin(4*pi*(i+1)/365 + 3.588) - 7.655 * Math.sin(2*pi*(i+1)/365);
		minutes = minutes.concat([min]);
	}
	
	const eot = {
		x: [...days],
		y: [...minutes],
		type: 'scatter'
	}; 
		
	return eot;
}


function graphEoT() {

	const EoT = document.getElementById("EoT");
	const eotArray = genData();
	
	Plotly.newPlot('EoT', eotArray);

} //end of function

I appreciate any and all comments especially when they help me learn something.

jhmiii

PS. The program should graph the Equation of Time, i.e. the difference between local time and the time shown on a sun clock. I plan to etch the chart onto a piece of brass to attach to the sun clock I made.

Put Eot not ‘Eot’ without the quotes

Plotly.newPlot(EoT, eotArray);

I also recommend using push instead of concat

Thanks for the advice Saratoga. As I lay in bed last night I decided to check for formatting issues with my call to Plotly.js. Upon checking I realized I had not included the array brackets around the constant eot. So I was not returning an array and consequently, not sending an array to Plotly. My mistake, though I must admit I don’t understand the need for the array format. Probably due to my general ignorance of the details of JavaScript. In any event I now see the desired graph and can get on with printing and etching the brass plate for the sun clock.

I will look into the rec on push versus concat.

Always learning,

jhmiii