vitalif-js
/
dimple
mirror of https://github.com/vitalif/dimple
1
0
Fork 0
Code Issues Releases Wiki Activity

Version 2.1

gh-pages
johnkiernander 2014-07-24 10:58:51 +01:00
parent 132b47a854
commit f6cbcab690
446 changed files with 15743 additions and 436 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
adhoc_viewer.html
View File

@ -8,7 +8,7 @@
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<title id="title"></title>
<script type="application/javascript" src="/lib/d3.v3.min.js"></script>
<script type="application/javascript" src="/dist/dimple.v2.0.0.min.js"></script>
<script type="application/javascript" src="/dist/dimple.v2.1.0.min.js"></script>
<link rel="stylesheet" href="/stylesheets/styles.css">
<link rel="stylesheet" href="/stylesheets/pygment_trac.css">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
@ -43,10 +43,10 @@
</table>
<h3>Libraries</h3>
<p>
<a href="/dist/dimple.v2.0.0.js">
<a href="/dist/dimple.v2.1.0.js">
Full Javascript Library With Comments
</a><br/>
<a href="/dist/dimple.v2.0.0.min.js">
<a href="/dist/dimple.v2.1.0.min.js">
Minified Javascript Library
</a><br/>
<a href="https://github.com/PMSI-AlignAlytics/dimple/zipball/master">
@ -58,6 +58,9 @@
</p>
<h3>Resources</h3>
<p>
<a href="/index.html">
Home
</a><br/>
<a href="/examples_index.html">
Examples
</a><br/>
@ -119,12 +122,12 @@
$.get("adhoc/" + spec.id + ".html", function (page) {
$("#codeContainer").text(
page.slice(page.indexOf("<div"))
.replace("src=\"/dist/dimple.v2.0.0.js\"", "src=\"http://dimplejs.org/dist/dimple.v2.0.0.min.js\"")
.replace("src=\"/dist/dimple.v2.1.0.js\"", "src=\"http://dimplejs.org/dist/dimple.v2.1.0.min.js\"")
.replace("src=\"/lib/d3.v3.min.js\"", "src=\"http://d3js.org/d3.v3.min.js\"")
);
$("#chartBox").html(
page.slice(page.indexOf("<div"))
.replace("src=\"/dist/dimple.v2.0.0.js\"", "")
.replace("src=\"/dist/dimple.v2.1.0.js\"", "")
.replace("src=\"/lib/d3.v3.min.js\"", "")
);
});

9
advanced_examples_index.html
View File

@ -35,10 +35,10 @@
<p></p>
<h3>Libraries</h3>
<p>
<a href="/dist/dimple.v2.0.0.js">
<a href="/dist/dimple.v2.1.0.js">
Full Javascript Library With Comments
</a><br/>
<a href="/dist/dimple.v2.0.0.min.js">
<a href="/dist/dimple.v2.1.0.min.js">
Minified Javascript Library
</a><br/>
<a href="https://github.com/PMSI-AlignAlytics/dimple/zipball/master">
@ -50,6 +50,9 @@
</p>
<h3>Resources</h3>
<p>
<a href="/index.html">
Home
</a><br/>
<a href="/examples_index.html">
Examples
</a><br/>
@ -85,7 +88,7 @@
$("#next").text(data[0].shortTitle + " >");
}
data.forEach(function (spec, i) {
$("#examples").append("<a class=\"example\" href=\"/advanced_examples_viewer.html?id=" + spec.id + "\"><img src=\"/images/" + spec.id + ".png\"></a>");
$("#examples").append("<a class=\"example\" href=\"/advanced_examples_viewer.html?id=" + spec.id + "\"><img src=\"/images/" + spec.id + ".jpg\"></a>");
});
});
</script>

66
advanced_examples_viewer.html
View File

@ -8,7 +8,7 @@
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<title id="title"></title>
<script type="application/javascript" src="/lib/d3.v3.min.js"></script>
<script type="application/javascript" src="/dist/dimple.v2.0.0.min.js"></script>
<script type="application/javascript" src="/dist/dimple.v2.1.0.min.js"></script>
<link rel="stylesheet" href="/stylesheets/styles.css">
<link rel="stylesheet" href="/stylesheets/pygment_trac.css">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
@ -43,10 +43,10 @@
</table>
<h3>Libraries</h3>
<p>
<a href="/dist/dimple.v2.0.0.js">
<a href="/dist/dimple.v2.1.0.js">
Full Javascript Library With Comments
</a><br/>
<a href="/dist/dimple.v2.0.0.min.js">
<a href="/dist/dimple.v2.1.0.min.js">
Minified Javascript Library
</a><br/>
<a href="https://github.com/PMSI-AlignAlytics/dimple/zipball/master">
@ -58,6 +58,9 @@
</p>
<h3>Resources</h3>
<p>
<a href="/index.html">
Home
</a><br/>
<a href="/examples_index.html">
Examples
</a><br/>
@ -109,44 +112,49 @@
// Prompt if no query string is passed. Mainly useful for debugging.
if (id == undefined) { id = window.prompt("Please enter an example id","bars_vertical"); }
$.getJSON("/advanced_examples_meta.json", function(data) {
var found = false;
data.forEach(function (spec, i) {
if (spec.id == id) {
found = true;
// Set the text elements
$("#title").text(spec.title);
$("#heading").text(spec.title);
$("#desc").text(spec.desc);
// Set the code display
$.get("examples/" + spec.id + ".html", function (page) {
$("#codeContainer").text(
page.slice(page.indexOf("<div"))
.replace("src=\"/dist/dimple.v2.0.0.js\"", "src=\"http://dimplejs.org/dist/dimple.v2.0.0.min.js\"")
.replace("src=\"/lib/d3.v3.min.js\"", "src=\"http://d3js.org/d3.v3.min.js\"")
$("#codeContainer").text(
page.slice(page.indexOf("<div"))
.replace("src=\"/dist/dimple.v2.1.0.js\"", "src=\"http://dimplejs.org/dist/dimple.v2.1.0.min.js\"")
.replace("src=\"/lib/d3.v3.min.js\"", "src=\"http://d3js.org/d3.v3.min.js\"")
);
$("#chartBox").html(
page.slice(page.indexOf("<div"))
.replace("src=\"/dist/dimple.v2.0.0.js\"", "")
.replace("src=\"/lib/d3.v3.min.js\"", "")
page.slice(page.indexOf("<div"))
.replace("src=\"/dist/dimple.v2.1.0.js\"", "")
.replace("src=\"/lib/d3.v3.min.js\"", "")
);
});
// Set the previous links
if (i == 0) {
$("#prev").attr("href","/advanced_examples_index.html");
$("#prev").text("< Advanced Index");
}
else {
$("#prev").attr("href","/advanced_examples_viewer.html?id=" + data[i-1].id);
$("#prev").text("< " + data[i-1].shortTitle);
}
// Set the next links
if (i == data.length - 1) {
$("#next").remove();
}
else {
$("#next").attr("href","/advanced_examples_viewer.html?id=" + data[i+1].id);
$("#next").text(data[i+1].shortTitle + " >");
}
}
});
// Set the previous links
if (i == 0) {
$("#prev").attr("href", "/advanced_examples_index.html");
$("#prev").text("< Advanced Index");
}
else {
$("#prev").attr("href", "/advanced_examples_viewer.html?id=" + data[i - 1].id);
$("#prev").text("< " + data[i - 1].shortTitle);
}
// Set the next links
if (i == data.length - 1) {
$("#next").remove();
}
else {
$("#next").attr("href", "/advanced_examples_viewer.html?id=" + data[i + 1].id);
$("#next").text(data[i + 1].shortTitle + " >");
}
}
});
if (!found) {
window.location.replace("/advanced_examples_index.html");
}
});
</script>
<script type="text/javascript">

5272
dist/dimple.v2.1.0.js vendored Normal file
View File

File diff suppressed because it is too large Load Diff

3
dist/dimple.v2.1.0.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

45
examples/advanced_animated_multiple_pie_bubbles.html Normal file
View File

@ -0,0 +1,45 @@
<!----------------------------------------------------------------->
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
var myChart = new dimple.chart(svg, data);
myChart.setBounds(60, 30, 470, 300)
// Define all the axes
var xAxis = myChart.addMeasureAxis("x", "Distribution");
var yAxis = myChart.addMeasureAxis("y", "Price");
var segments = myChart.addMeasureAxis("p", "Unit Sales");
var size = myChart.addMeasureAxis("z", "Sales Value");
var ring = myChart.addSeries(["Price Tier", "Channel"], dimple.plot.pie);
var pie = myChart.addSeries(["Price Tier", "Owner"], dimple.plot.pie);
// Zoom in the axis bounds
xAxis.overrideMin = 40;
xAxis.overrideMax = 70;
yAxis.overrideMax = 150;
// Set the maximum radius for the bubbles
ring.radius = 75;
pie.radius = 75;
// Create fixed 10px ring with a 5px
// margin (negative sizes are calculated inwards)
ring.innerRadius = "-10px";
pie.outerRadius = "-15px";
// Draw averages for the pie and ring
ring.aggregate = dimple.aggregateMethod.avg;
pie.aggregate = dimple.aggregateMethod.avg;
// Animate by date
myChart.setStoryboard("Date");
myChart.draw();
});
</script>
</div>

4
examples/advanced_bar_labels.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
// This is the simple vertical grouped stacked 100% bar example
var svg = dimple.newSvg("#chartContainer", 590, 400);

4
examples/advanced_bullet.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
// Create the svg and set the dimensions

4
examples/advanced_change_bubbles.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/advanced_dynamic_line_color.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/advanced_grouped_mekko.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/advanced_interactive_legends.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/advanced_lollipop_with_hover.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);

4
examples/advanced_matrix.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
// Create the svg and set the dimensions

4
examples/advanced_pong.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
var data = [

4
examples/advanced_price_range_lollipop.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/advanced_responsive_sizing.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer" style="height: 100%">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
// In version 1.1.0 it's possible to initialise any size parameter with a
// % value as well as pixels

4
examples/advanced_storyboard_control.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/advanced_time_axis.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);

4
examples/advanced_trellis_bar.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/advanced_waterfall.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
// This code should support any data in this structure changing the data here

4
examples/area_steps_horizontal.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/area_steps_horizontal_grouped.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/area_steps_horizontal_grouped_100pct.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/area_steps_horizontal_grouped_stacked.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/area_steps_horizontal_stacked.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/area_steps_horizontal_stacked_100pct.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/area_steps_vertical.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/area_steps_vertical_grouped.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/area_steps_vertical_grouped_100pct.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/area_steps_vertical_grouped_stacked.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/area_steps_vertical_stacked.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/area_steps_vertical_stacked_100pct.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/areas_curvy.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/areas_dual_measure.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/areas_horizontal.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/areas_horizontal_grouped.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/areas_horizontal_grouped_100pct.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/areas_horizontal_grouped_stacked.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/areas_horizontal_stacked.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/areas_horizontal_stacked_100pct.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/areas_vertical.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/areas_vertical_grouped.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/areas_vertical_grouped_100pct.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/areas_vertical_grouped_stacked.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/areas_vertical_stacked.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/areas_vertical_stacked_100pct.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bars_dual_measure_floating.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bars_horizontal.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bars_horizontal_floating.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bars_horizontal_grouped.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bars_horizontal_grouped_stacked.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bars_horizontal_grouped_stacked_100pct.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bars_horizontal_mekko.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bars_horizontal_stacked.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bars_horizontal_stacked_100pct.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bars_matrix.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bars_vertical.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bars_vertical_floating.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bars_vertical_grouped.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bars_vertical_grouped_stacked.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bars_vertical_grouped_stacked_100pct.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bars_vertical_mekko.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bars_vertical_stacked.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bars_vertical_stacked_100pct.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bubbles_horizontal_grouped.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bubbles_horizontal_lollipop.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bubbles_matrix.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bubbles_standard.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bubbles_vertical_grouped.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/bubbles_vertical_lollipop.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/lines_curvy.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/lines_dual_measure.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/lines_horizontal.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/lines_horizontal_grouped.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/lines_horizontal_grouped_stacked.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/lines_horizontal_stacked.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/lines_vertical.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/lines_vertical_grouped.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/lines_vertical_grouped_stacked.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/lines_vertical_stacked.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

22
examples/pie_bubble.html Normal file
View File

@ -0,0 +1,22 @@
<!----------------------------------------------------------------->
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
data = dimple.filterData(data, "Date", "01/12/2012");
var myChart = new dimple.chart(svg, data);
myChart.setBounds(60, 30, 500, 330)
myChart.addMeasureAxis("y", "Unit Sales Monthly Change");
myChart.addMeasureAxis("x", "Price Monthly Change");
myChart.addMeasureAxis("p", "Operating Profit");
myChart.addMeasureAxis("z", "Operating Profit");
myChart.addSeries(["Owner", "Channel"], dimple.plot.pie);
myChart.addLegend(200, 10, 360, 20, "right");
myChart.draw();
});
</script>
</div>

21
examples/pie_horizontal_grouped.html Normal file
View File

@ -0,0 +1,21 @@
<!----------------------------------------------------------------->
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
var myChart = new dimple.chart(svg, data);
myChart.setBounds(65, 50, 505, 330)
myChart.addCategoryAxis("x", ["Price Tier", "Channel"]);
myChart.addMeasureAxis("y", "Unit Sales");
myChart.addMeasureAxis("p", "Unit Sales");
var pies = myChart.addSeries("Owner", dimple.plot.pie);
pies.radius = 20;
myChart.addLegend(170, 10, 410, 20, "right");
myChart.draw();
});
</script>
</div>

25
examples/pie_horizontal_lollipop.html Normal file
View File

@ -0,0 +1,25 @@
<!----------------------------------------------------------------->
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
data = dimple.filterData(data, "Date", [
"01/07/2012", "01/08/2012", "01/09/2012",
"01/10/2012", "01/11/2012", "01/12/2012"]);
var myChart = new dimple.chart(svg, data);
myChart.setBounds(75, 30, 480, 330)
myChart.addMeasureAxis("x", "Unit Sales");
var y = myChart.addCategoryAxis("y", "Month");
y.addOrderRule("Date");
myChart.addMeasureAxis("p", "Unit Sales");
var pies = myChart.addSeries("Channel", dimple.plot.pie);
pies.radius = 20;
myChart.addLegend(180, 10, 360, 20, "right");
myChart.draw();
});
</script>
</div>

21
examples/pie_matrix.html Normal file
View File

@ -0,0 +1,21 @@
<!----------------------------------------------------------------->
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
var myChart = new dimple.chart(svg, data);
myChart.setBounds(95, 25, 475, 335)
myChart.addCategoryAxis("x", "Price Tier");
myChart.addCategoryAxis("y", "Pack Size");
myChart.addMeasureAxis("p", "Unit Sales");
var pies = myChart.addSeries("Channel", dimple.plot.pie);
pies.radius = 25;
myChart.addLegend(240, 10, 330, 20, "right");
myChart.draw();
});
</script>
</div>

22
examples/pie_scatter.html Normal file
View File

@ -0,0 +1,22 @@
<!----------------------------------------------------------------->
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
data = dimple.filterData(data, "Date", "01/12/2012");
var myChart = new dimple.chart(svg, data);
myChart.setBounds(60, 30, 500, 330)
myChart.addMeasureAxis("y", "Unit Sales Monthly Change");
myChart.addMeasureAxis("x", "Price Monthly Change");
myChart.addMeasureAxis("p", "Operating Profit");
var pies = myChart.addSeries(["Owner", "Channel"], dimple.plot.pie);
pies.radius = 20;
myChart.addLegend(200, 10, 360, 20, "right");
myChart.draw();
});
</script>
</div>

18
examples/pie_standard.html Normal file
View File

@ -0,0 +1,18 @@
<!----------------------------------------------------------------->
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
var myChart = new dimple.chart(svg, data);
myChart.setBounds(20, 20, 460, 360)
myChart.addMeasureAxis("p", "Unit Sales");
myChart.addSeries("Owner", dimple.plot.pie);
myChart.addLegend(500, 20, 90, 300, "left");
myChart.draw();
});
</script>
</div>

21
examples/pie_vertical_grouped.html Normal file
View File

@ -0,0 +1,21 @@
<!----------------------------------------------------------------->
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
var myChart = new dimple.chart(svg, data);
myChart.setBounds(65, 50, 505, 310)
myChart.addCategoryAxis("x", ["Price Tier", "Channel"]);
myChart.addMeasureAxis("y", "Unit Sales");
myChart.addMeasureAxis("p", "Unit Sales");
var pies = myChart.addSeries("Owner", dimple.plot.pie);
pies.radius = 20;
myChart.addLegend(170, 10, 410, 20, "right");
myChart.draw();
});
</script>
</div>

25
examples/pie_vertical_lollipop.html Normal file
View File

@ -0,0 +1,25 @@
<!----------------------------------------------------------------->
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
data = dimple.filterData(data, "Date", [
"01/07/2012", "01/08/2012", "01/09/2012",
"01/10/2012", "01/11/2012", "01/12/2012"]);
var myChart = new dimple.chart(svg, data);
myChart.setBounds(60, 30, 500, 330)
var x = myChart.addCategoryAxis("x", "Month");
x.addOrderRule("Date");
myChart.addMeasureAxis("y", "Unit Sales");
myChart.addMeasureAxis("p", "Unit Sales");
var pies = myChart.addSeries("Channel", dimple.plot.pie);
pies.radius = 20;
myChart.addLegend(140, 10, 360, 20, "right");
myChart.draw();
});
</script>
</div>

23
examples/ring_bubble.html Normal file
View File

@ -0,0 +1,23 @@
<!----------------------------------------------------------------->
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
data = dimple.filterData(data, "Date", "01/12/2012");
var myChart = new dimple.chart(svg, data);
myChart.setBounds(60, 30, 500, 330)
myChart.addMeasureAxis("x", "Unit Sales Monthly Change");
myChart.addMeasureAxis("y", "Price Monthly Change");
myChart.addMeasureAxis("p", "Operating Profit");
myChart.addMeasureAxis("z", "Operating Profit");
var rings = myChart.addSeries(["SKU", "Channel"], dimple.plot.pie);
rings.innerRadius = "80%";
myChart.addLegend(200, 10, 360, 20, "right");
myChart.draw();
});
</script>
</div>

22
examples/ring_horizontal_grouped.html Normal file
View File

@ -0,0 +1,22 @@
<!----------------------------------------------------------------->
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
var myChart = new dimple.chart(svg, data);
myChart.setBounds(75, 50, 495, 310)
myChart.addMeasureAxis("x", "Unit Sales");
myChart.addCategoryAxis("y", ["Price Tier", "Channel"]);
myChart.addMeasureAxis("p", "Unit Sales");
var rings = myChart.addSeries("Pack Size", dimple.plot.pie);
rings.innerRadius = 15;
rings.outerRadius = 20;
myChart.addLegend(170, 10, 410, 20, "right");
myChart.draw();
});
</script>
</div>

26
examples/ring_horizontal_lollipop.html Normal file
View File

@ -0,0 +1,26 @@
<!----------------------------------------------------------------->
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
data = dimple.filterData(data, "Date", [
"01/07/2012", "01/08/2012", "01/09/2012",
"01/10/2012", "01/11/2012", "01/12/2012"]);
var myChart = new dimple.chart(svg, data);
myChart.setBounds(75, 30, 480, 330)
myChart.addMeasureAxis("x", "Unit Sales");
var y = myChart.addCategoryAxis("y", "Month");
y.addOrderRule("Date");
myChart.addMeasureAxis("p", "Unit Sales");
var rings = myChart.addSeries("Channel", dimple.plot.pie);
rings.innerRadius = 15;
rings.outerRadius = 20;
myChart.addLegend(180, 10, 360, 20, "right");
myChart.draw();
});
</script>
</div>

22
examples/ring_matrix.html Normal file
View File

@ -0,0 +1,22 @@
<!----------------------------------------------------------------->
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
var myChart = new dimple.chart(svg, data);
myChart.setBounds(95, 25, 475, 335)
myChart.addCategoryAxis("x", "Price Tier");
myChart.addCategoryAxis("y", "Pack Size");
myChart.addMeasureAxis("p", "Unit Sales");
var rings = myChart.addSeries("Channel", dimple.plot.pie);
rings.innerRadius = 15;
rings.outerRadius = 25;
myChart.addLegend(240, 10, 330, 20, "right");
myChart.draw();
});
</script>
</div>

23
examples/ring_multiple.html Normal file
View File

@ -0,0 +1,23 @@
<!----------------------------------------------------------------->
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
var myChart = new dimple.chart(svg, data);
myChart.setBounds(20, 20, 460, 360)
myChart.addMeasureAxis("p", "Unit Sales");
var outerRing = myChart.addSeries("Channel", dimple.plot.pie);
var innerRing = myChart.addSeries("Price Tier", dimple.plot.pie);
// Negatives are calculated from outside edge, positives from center
outerRing.innerRadius = "-30px";
innerRing.outerRadius = "-40px";
innerRing.innerRadius = "-70px";
myChart.addLegend(500, 20, 90, 300, "left");
myChart.draw();
});
</script>
</div>

23
examples/ring_scatter.html Normal file
View File

@ -0,0 +1,23 @@
<!----------------------------------------------------------------->
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
data = dimple.filterData(data, "Date", "01/12/2012");
var myChart = new dimple.chart(svg, data);
myChart.setBounds(60, 30, 500, 330)
myChart.addMeasureAxis("x", "Unit Sales Monthly Change");
myChart.addMeasureAxis("y", "Price Monthly Change");
myChart.addMeasureAxis("p", "Operating Profit");
var rings = myChart.addSeries(["Owner", "Channel"], dimple.plot.pie);
rings.innerRadius = 20;
rings.outerRadius = 25;
myChart.addLegend(200, 10, 360, 20, "right");
myChart.draw();
});
</script>
</div>

19
examples/ring_standard.html Normal file
View File

@ -0,0 +1,19 @@
<!----------------------------------------------------------------->
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
var myChart = new dimple.chart(svg, data);
myChart.setBounds(20, 20, 460, 360)
myChart.addMeasureAxis("p", "Unit Sales");
var ring = myChart.addSeries("Owner", dimple.plot.pie);
ring.innerRadius = "50%";
myChart.addLegend(500, 20, 90, 300, "left");
myChart.draw();
});
</script>
</div>

22
examples/ring_vertical_grouped.html Normal file
View File

@ -0,0 +1,22 @@
<!----------------------------------------------------------------->
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
var myChart = new dimple.chart(svg, data);
myChart.setBounds(65, 50, 505, 310)
myChart.addCategoryAxis("x", ["Price Tier", "Channel"]);
myChart.addMeasureAxis("y", "Unit Sales");
myChart.addMeasureAxis("p", "Unit Sales");
var rings = myChart.addSeries("Pack Size", dimple.plot.pie);
rings.innerRadius = 20;
rings.outerRadius = 30;
myChart.addLegend(170, 10, 410, 20, "right");
myChart.draw();
});
</script>
</div>

26
examples/ring_vertical_lollipop.html Normal file
View File

@ -0,0 +1,26 @@
<!----------------------------------------------------------------->
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
data = dimple.filterData(data, "Date", [
"01/07/2012", "01/08/2012", "01/09/2012",
"01/10/2012", "01/11/2012", "01/12/2012"]);
var myChart = new dimple.chart(svg, data);
myChart.setBounds(60, 30, 500, 330)
var x = myChart.addCategoryAxis("x", "Month");
x.addOrderRule("Date");
myChart.addMeasureAxis("y", "Unit Sales");
myChart.addMeasureAxis("p", "Unit Sales");
var rings = myChart.addSeries("Channel", dimple.plot.pie);
rings.innerRadius = 15;
rings.outerRadius = 20;
myChart.addLegend(140, 10, 360, 20, "right");
myChart.draw();
});
</script>
</div>

4
examples/scatter_horizontal_grouped.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

4
examples/scatter_horizontal_lollipop.html
View File

@ -2,8 +2,8 @@
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
<!----------------------------------------------------------------->
<div id="chartContainer">
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script src="/lib/d3.v3.4.8.js"></script>
<script src="/dist/dimple.v2.1.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {

Some files were not shown because too many files have changed in this diff Show More