Skip to content

Instantly share code, notes, and snippets.

@joelthchao
Last active March 18, 2018 11:20
Show Gist options
  • Save joelthchao/a828614014a404ca775bb91084347ec0 to your computer and use it in GitHub Desktop.
Save joelthchao/a828614014a404ca775bb91084347ec0 to your computer and use it in GitHub Desktop.
DHT
<head>
<!-- Plotly.js -->
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
</head>
<body>
<!-- Plotly chart will be drawn inside this DIV -->
<div id="plot"></div>
<script>
Plotly.d3.csv("record/dht.csv", function(err, rows){
function unpack(rows, key) {
return rows.map(function(row) { return row[key]; });
}
var trace1 = {
type: "scatter",
mode: "lines",
name: 'Temperature',
x: unpack(rows, 'Date'),
y: unpack(rows, 'Temperature'),
line: {color: '#17BECF'}
}
var trace2 = {
type: "scatter",
mode: "lines",
name: 'Humidity',
x: unpack(rows, 'Date'),
y: unpack(rows, 'Humidity'),
line: {color: '#7F7F7F'},
yaxis: 'y2'
}
var data = [trace1,trace2];
var layout = {
title: 'Home Environment monitor',
yaxis: {title: 'Temperature'},
yaxis2: {
title: 'Humidity',
overlaying: 'y',
side: 'right'
}
};
Plotly.newPlot('plot', data, layout);
})
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment