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

Fixed adhoc charts

master 2.2.0
John Kiernander 2016-03-23 15:20:44 +00:00
parent 7d5cf26b65
commit dbf65501fb
7 changed files with 57 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
adhoc/adhoc_bar_custom_tooltips.html
View File

@ -1,6 +1,9 @@
<!DOCTYPE html>
<meta charset="utf-8">
<html>
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.min.js"></script>
<script src="/dist/dimple.v2.2.0.js"></script>
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
@ -19,4 +22,5 @@
myChart.draw();
});
</script>
</div>
</div>
</html>

10
adhoc/adhoc_bar_labels.html
View File

@ -1,6 +1,9 @@
<!DOCTYPE html>
<meta charset="utf-8">
<html>
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.min.js"></script>
<script src="/dist/dimple.v2.2.0.js"></script>
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script type="text/javascript">
// This is the simple vertical grouped stacked 100% bar example
var svg = dimple.newSvg("#chartContainer", 590, 400);
@ -44,4 +47,5 @@
myChart.draw(2000);
});
</script>
</div>
</div>
</html>

10
adhoc/adhoc_bar_scroll.html
View File

@ -1,6 +1,9 @@
<!DOCTYPE html>
<meta charset="utf-8">
<html>
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.min.js"></script>
<script src="/dist/dimple.v2.2.0.js"></script>
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script type="text/javascript">
// Start off with a couple of rows of data
var data = [
@ -29,4 +32,5 @@
myChart.draw(1000);
}, 500);
</script>
</div>
</div>
</html>

10
adhoc/adhoc_bounce_stagger.html
View File

@ -1,6 +1,9 @@
<!DOCTYPE html>
<meta charset="utf-8">
<html>
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.min.js"></script>
<script src="/dist/dimple.v2.2.0.js"></script>
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
@ -17,4 +20,5 @@
myChart.draw(800);
});
</script>
</div>
</div>
</html>

10
adhoc/adhoc_composite_axis_category.html
View File

@ -1,6 +1,9 @@
<!DOCTYPE html>
<meta charset="utf-8">
<html>
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.min.js"></script>
<script src="/dist/dimple.v2.2.0.js"></script>
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
@ -19,4 +22,5 @@
myChart.draw();
});
</script>
</div>
</div>
</html>

10
adhoc/adhoc_composite_axis_measure.html
View File

@ -1,6 +1,9 @@
<!DOCTYPE html>
<meta charset="utf-8">
<html>
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.min.js"></script>
<script src="/dist/dimple.v2.2.0.js"></script>
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.0.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
d3.tsv("/data/example_data.tsv", function (data) {
@ -17,4 +20,5 @@
myChart.draw();
});
</script>
</div>
</div>
</html>

41
adhoc/adhoc_dual_axis.html
View File

@ -1,34 +1,23 @@
<!DOCTYPE html>
<meta charset="utf-8">
<html>
<div id="chartContainer">
<script src="/lib/d3.v3.4.8.min.js"></script>
<script src="/dist/dimple.v2.2.0.js"></script>
<script src="/lib/d3.v3.min.js"></script>
<script src="/dist/dimple.v2.0.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, 50, 460, 280);
data = [
{ "Int": 1, "Float": 234, "Text": "XFBGR", "Date": "12/5/99", "Group": "A"},
{ "Int": 2, "Float": 54.35, "Text": "YTREB", "Date": "1/1/00", "Group": "A"},
{ "Int": 3, "Float": -453, "Text": "XGFDY", "Date": "2 February 2007", "Group": "B"},
{ "Int": 4, "Float": 5436546, "Text": "XGFDE", "Date": "2000-03-01", "Group": "B"},
{ "Int": 5, "Float": 4323, "Text": "YTREB", "Date": "10/10/2000", "Group": "C"},
{ "Int": 6, "Float": 0, "Text": "GFDHN", "Date": "11/10/2000", "Group": "C"},
{ "Int": 7, "Float": -453, "Text": "TRET", "Date": "10/9/2000", "Group": "D"},
{ "Int": 1, "Float": 5436546, "Text": "GFDGFDHG", "Date": "10/10/2000", "Group": "E"}
];
var s = dimple._getOrderedList(data, "Int", { ordering : "Text" });
console.log(s);
//
//
// var monthAxis = myChart.addCategoryAxis("x", "Owner");
// monthAxis.addOrderRule("Brand");
// var volumeAxis = myChart.addMeasureAxis("y", "Unit Sales");
// var profitAxis = myChart.addMeasureAxis("y", "Operating Profit");
// myChart.addSeries("Quantity", dimple.plot.line, [monthAxis, volumeAxis]);
// myChart.addSeries("Op. Profit", dimple.plot.line, [monthAxis, profitAxis]);
// myChart.addLegend(200, 10, 380, 20, "right");
// myChart.draw();
var monthAxis = myChart.addCategoryAxis("x", "Month");
monthAxis.addOrderRule("Date");
var volumeAxis = myChart.addMeasureAxis("y", "Unit Sales");
var profitAxis = myChart.addMeasureAxis("y", "Operating Profit");
myChart.addSeries("Quantity", dimple.plot.line, [monthAxis, volumeAxis]);
myChart.addSeries("Op. Profit", dimple.plot.line, [monthAxis, profitAxis]);
myChart.addLegend(200, 10, 380, 20, "right");
myChart.draw();
});
</script>
</div>
</div>
</html>