<head>
<!-- Plotly.js -->
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
</head>
<body>
<div id="myDiv"></div>
</body>
function makeplot() {
Plotly.d3.csv("https://raw.githubusercontent.com/plotly/datasets/master/2014_apple_stock.csv", function(data){ processData(data) } );
};
function processData(allRows) {
console.log(allRows);
var x = [], y = [], standard_deviation = [];
for (var i=0; i<allRows.length; i++) {
row = allRows[i];
x.push( row['AAPL_x'] );
y.push( row['AAPL_y'] );
}
console.log( 'X',x, 'Y',y, 'SD',standard_deviation );
makePlotly( x, y, standard_deviation );
}
function makePlotly( x, y, standard_deviation ){
var plotDiv = document.getElementById("plot");
var traces = [{
x: x,
y: y
}];
var layout = {
title: 'Plotting CSV data from AJAX call',
xaxis:
{
fixedrange: true
}
};
Plotly.newPlot('myDiv', traces, layout,
{showSendToCloud:true});
};
makeplot();
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.