D3 Examples - Data Canvas Part 7

Data Canvas Part 7 - Scatter Lines

This program makes a scatter plot (with lines) and line chart from data in the Data Canvas - Sense Your City API and makes use of the Chiasm visualization runtime engine.

The line chart shows the temperature for all cities with available data. The program constantly fetches more data going back in time, in invervals of 24 hours with a resolution of 5 minutes.

Draws from

xxxxxxxxxx
 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <!--
      A data visualization editor.
      Curran Kelleher March 2015
    -->
    <title>Visualization Editor</title>
​
    <link rel="stylesheet" href="//curran.github.io/cdn/inlet/inlet.css">
    <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/codemirror/5.0.0/codemirror.css">
    <link rel="stylesheet" href="styles.css">
​
    <style>
    </style>
  </head>
  <body>
​
    <!-- The container for the runtime environment. -->
    <div id="container"></div>
​
    <!-- The gear icon in the upper right. -->
    <!-- Image from https://simpleicon.com/gear-12.html -->
    <img id="gear" src="gear.png">
​
    <!-- Use RequireJS for module loading. -->
    <script src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.16/require.min.js"></script>
​
    <!-- Configure AMD modules. -->
    <script src="requireJSConfig.js"></script>
​
    <!-- Run the main program. -->
    <script src="main.js"></script>
​
  </body>
</html>
​
    