<html lang="en">
<head>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="http://dimplejs.org/dist/dimple.v2.0.0.min.js"></script>
</head>
<body>
<div id="chart" style="background:grey"></div>
</body>
</html>
var svg1 = dimple.newSvg("#chart", 600, 400);
var data1 = [
[
{week: 'week 1', miles: 1},
{week: 'week 2', miles: 2},
{week: 'week 3', miles: 3},
{week: 'week 4', miles: 4}
],
[
{week: 'week 1', miles: 2},
{week: 'week 2', miles: 4},
{week: 'week 3', miles: 6},
{week: 'week 4', miles: 8}
]
];
var chart1 = new dimple.chart(svg1);
var xAxis = chart1.addCategoryAxis("x", "week");
var yAxis = chart1.addMeasureAxis("y", "miles");
s1 = chart1.addSeries("Bill", dimple.plot.line);
s1.data = data1[0];
s1.plot=dimple.plot.line;
s2 = chart1.addSeries("Sarah", dimple.plot.line);
s2.data = data1[1];
s2.plot=dimple.plot.line;
chart1.draw(1000);
Output
300px
You can jump to the latest bin by adding /latest
to your URL
Keyboard Shortcuts
Shortcut | Action |
---|---|
ctrl + [num] | Toggle nth panel |
ctrl + 0 | Close focused panel |
ctrl + enter | Re-render output. If console visible: run JS in console |
Ctrl + l | Clear the console |
ctrl + / | Toggle comment on selected lines |
ctrl + ] | Indents selected lines |
ctrl + [ | Unindents selected lines |
tab | Code complete & Emmet expand |
ctrl + shift + L | Beautify code in active panel |
ctrl + s | Save & lock current Bin from further changes |
ctrl + shift + s | Open the share options |
ctrl + y | Archive Bin |
Complete list of JS Bin shortcuts |
JS Bin URLs
URL | Action |
---|---|
/ | Show the full rendered output. This content will update in real time as it's updated from the /edit url. |
/edit | Edit the current bin |
/watch | Follow a Code Casting session |
/embed | Create an embeddable version of the bin |
/latest | Load the very latest bin (/latest goes in place of the revision) |
/[username]/last | View the last edited bin for this user |
/[username]/last/edit | Edit the last edited bin for this user |
/[username]/last/watch | Follow the Code Casting session for the latest bin for this user |
/quiet | Remove analytics and edit button from rendered output |
.js | Load only the JavaScript for a bin |
.css | Load only the CSS for a bin |
Except for username prefixed urls, the url may start with http://jsbin.com/abc and the url fragments can be added to the url to view it differently. |