Skip to content

Commit 64e8302

Browse files
New Examples
1 parent 1571010 commit 64e8302

21 files changed

Lines changed: 253 additions & 18 deletions

dist/dimple.v1.2.0.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3453,8 +3453,7 @@ var dimple = {
34533453
return d3.svg.line()
34543454
.x(function (d) { return (series.x._hasCategories() || !originProperty ? d.x : series.x[originProperty]); })
34553455
.y(function (d) { return (series.y._hasCategories() || !originProperty ? d.y : series.y[originProperty]); })
3456-
.interpolate(inter)
3457-
.tension(series.interpolationTe);
3456+
.interpolate(inter);
34583457
};
34593458

34603459
// Handle the special interpolation handling for step

dist/dimple.v1.2.0.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.
Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -13,12 +13,9 @@
1313
x.addOrderRule("Date");
1414
myChart.addMeasureAxis("y", "Unit Sales");
1515
myChart.addSeries("Owner", dimple.plot.bar);
16-
17-
// Set the ease to bounce and stagger drawing so that
18-
// each bar is offset from the bar before
16+
myChart.setStoryboard("Price Tier");
1917
myChart.ease = "bounce"
2018
myChart.staggerDraw = true;
21-
2219
myChart.addLegend(200, 10, 380, 20, "right");
2320
myChart.draw(800);
2421
});
Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,15 +9,14 @@
99
d3.tsv("/data/example_data.tsv", function (data) {
1010
var myChart = new dimple.chart(svg, data);
1111
myChart.setBounds(60, 80, 480, 260)
12-
myChart.addMeasureAxis("x", "Price");
13-
myChart.addMeasureAxis("y", "Distribution");
12+
myChart.addMeasureAxis("x", "Price Monthly Change");
13+
myChart.addMeasureAxis("y", "Distribution Monthly Change");
1414
myChart.addMeasureAxis("z", "Sales Value");
15-
myChart.addSeries(["SKU", "Channel", "Owner"], dimple.plot.area);
1615
myChart.addSeries(["SKU", "Channel", "Owner"], dimple.plot.bubble);
1716
myChart.addLegend(200, 10, 380, 20, "right");
1817
myChart.setStoryboard("Date");
1918
myChart.ease = "elastic";
20-
myChart.draw(1000);
19+
myChart.draw(2000);
2120
myChart.legends = [];
2221
});
2322
</script>

examples/areas_curvy.html

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
<!----------------------------------------------------------------->
2+
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
3+
<!----------------------------------------------------------------->
4+
<div id="chartContainer">
5+
<script src="/lib/d3.v3.min.js"></script>
6+
<script src="/dist/dimple.v1.2.0.js"></script>
7+
<script type="text/javascript">
8+
var svg = dimple.newSvg("#chartContainer", 590, 400);
9+
d3.tsv("/data/example_data.tsv", function (data) {
10+
data = dimple.filterData(data, "Owner", ["Aperture", "Black Mesa"])
11+
var myChart = new dimple.chart(svg, data);
12+
myChart.setBounds(60, 30, 505, 305);
13+
var x = myChart.addCategoryAxis("x", "Month");
14+
x.addOrderRule("Date");
15+
myChart.addMeasureAxis("y", "Unit Sales");
16+
var s = myChart.addSeries("Channel", dimple.plot.area);
17+
s.interpolation = "cardinal";
18+
myChart.addLegend(60, 10, 500, 20, "right");
19+
myChart.draw();
20+
});
21+
</script>
22+
</div>

examples/areas_dual_measure.html

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<!----------------------------------------------------------------->
2+
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
3+
<!----------------------------------------------------------------->
4+
<div id="chartContainer">
5+
<script src="/lib/d3.v3.min.js"></script>
6+
<script src="/dist/dimple.v1.2.0.js"></script>
7+
<script type="text/javascript">
8+
var svg = dimple.newSvg("#chartContainer", 590, 400);
9+
d3.tsv("/data/example_data.tsv", function (data) {
10+
var myChart = new dimple.chart(svg, data);
11+
myChart.setBounds(50, 40, 500, 310)
12+
var x = myChart.addMeasureAxis("x", "Distribution");
13+
var y = myChart.addMeasureAxis("y", "Price");
14+
var s = myChart.addSeries(["SKU", "Price Tier"], dimple.plot.area);
15+
s.aggregate = dimple.aggregateMethod.avg;
16+
s.lineMarkers = true;
17+
myChart.addLegend(30, 10, 500, 35, "right");
18+
myChart.draw();
19+
});
20+
</script>
21+
</div>

examples/areas_horizontal_stacked.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@
1313
var x = myChart.addCategoryAxis("x", "Month");
1414
x.addOrderRule("Date");
1515
myChart.addMeasureAxis("y", "Unit Sales");
16-
myChart.addSeries("Channel", dimple.plot.area);
16+
var s = myChart.addSeries("Channel", dimple.plot.area);
1717
myChart.addLegend(60, 10, 500, 20, "right");
1818
myChart.draw();
1919
});
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<!----------------------------------------------------------------->
2+
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
3+
<!----------------------------------------------------------------->
4+
<div id="chartContainer">
5+
<script src="/lib/d3.v3.min.js"></script>
6+
<script src="/dist/dimple.v1.2.0.js"></script>
7+
<script type="text/javascript">
8+
var svg = dimple.newSvg("#chartContainer", 590, 400);
9+
d3.tsv("/data/example_data.tsv", function (data) {
10+
data = dimple.filterData(data, "Month", "Dec-11");
11+
var myChart = new dimple.chart(svg, data);
12+
myChart.setBounds(60, 30, 510, 305)
13+
myChart.addMeasureAxis("x", "Price Monthly Change");
14+
myChart.addMeasureAxis("y", "Distribution Monthly Change");
15+
var s = myChart.addSeries(["SKU", "Channel"], dimple.plot.bar);
16+
s.stacked = false;
17+
myChart.addLegend(60, 10, 510, 20, "right");
18+
myChart.draw();
19+
});
20+
</script>
21+
</div>
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<!----------------------------------------------------------------->
2+
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
3+
<!----------------------------------------------------------------->
4+
<div id="chartContainer">
5+
<script src="/lib/d3.v3.min.js"></script>
6+
<script src="/dist/dimple.v1.2.0.js"></script>
7+
<script type="text/javascript">
8+
var svg = dimple.newSvg("#chartContainer", 590, 400);
9+
d3.tsv("/data/example_data.tsv", function (data) {
10+
var myChart = new dimple.chart(svg, data);
11+
myChart.setBounds(75, 30, 480, 315);
12+
myChart.addMeasureAxis("x", "Unit Sales");
13+
var y = myChart.addCategoryAxis("y", "Month");
14+
y.addOrderRule("Date");
15+
var s = myChart.addSeries("Channel", dimple.plot.bar);
16+
s.stacked = false;
17+
myChart.addLegend(60, 10, 510, 20, "right");
18+
myChart.draw();
19+
});
20+
</script>
21+
</div>
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<!----------------------------------------------------------------->
2+
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
3+
<!----------------------------------------------------------------->
4+
<div id="chartContainer">
5+
<script src="/lib/d3.v3.min.js"></script>
6+
<script src="/dist/dimple.v1.2.0.js"></script>
7+
<script type="text/javascript">
8+
var svg = dimple.newSvg("#chartContainer", 590, 400);
9+
d3.tsv("/data/example_data.tsv", function (data) {
10+
var myChart = new dimple.chart(svg, data);
11+
myChart.setBounds(60, 30, 510, 305)
12+
var x = myChart.addCategoryAxis("x", "Month");
13+
x.addOrderRule("Date");
14+
myChart.addMeasureAxis("y", "Unit Sales");
15+
var s = myChart.addSeries("Channel", dimple.plot.bar);
16+
s.stacked = false;
17+
myChart.addLegend(60, 10, 510, 20, "right");
18+
myChart.draw();
19+
});
20+
</script>
21+
</div>

0 commit comments

Comments
 (0)