- parent.innerHTML =
- "<p>No roll period.</p>" +
- "<div id='noroll' style='width:800px; height:320px;'></div>" +
- "<p>Roll period of 14 timesteps, custom range selector height and plot color.</p>" +
- "<div id='roll14' style='width:800px; height:320px;'></div>";
+ parent.innerHTML = [
+ "<style>",
+ " #darkbg .dygraph-axis-label { color: white; }",
+ " .dygraph-legend { text-align: right; }",
+ " #darkbg .dygraph-legend { background-color: #101015; }",
+ "</style>",
+ "<p>No roll period.</p>",
+ "<div id='noroll' style='width:600px; height:300px;'></div>",
+ "",
+ "<p>Roll period of 14 timesteps, custom range selector height and plot color.</p>",
+ "<div id='roll14' style='width:600px; height:300px;'></div>",
+ "",
+ "<div style='background-color: #101015; color: white'>",
+ "<p>Dark background, custom range selector gradient color.</p>",
+ "<div id='darkbg' style='width:600px; height:300px;'></div>",
+ "</div>"].join("\n");