Update to 1.1.5
|
@ -39,10 +39,10 @@
|
||||||
</table>
|
</table>
|
||||||
<h3>Libraries</h3>
|
<h3>Libraries</h3>
|
||||||
<p>
|
<p>
|
||||||
<a href="/dist/dimple.v1.1.4.js">
|
<a href="/dist/dimple.v1.1.5.js">
|
||||||
Full Javascript Library With Comments
|
Full Javascript Library With Comments
|
||||||
</a><br/>
|
</a><br/>
|
||||||
<a href="/dist/dimple.v1.1.4.min.js">
|
<a href="/dist/dimple.v1.1.5.min.js">
|
||||||
Minified Javascript Library
|
Minified Javascript Library
|
||||||
</a><br/>
|
</a><br/>
|
||||||
<a href="https://github.com/PMSI-AlignAlytics/dimple/zipball/master">
|
<a href="https://github.com/PMSI-AlignAlytics/dimple/zipball/master">
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
<meta http-equiv="X-UA-Compatible" content="chrome=1">
|
<meta http-equiv="X-UA-Compatible" content="chrome=1">
|
||||||
<title id="title"></title>
|
<title id="title"></title>
|
||||||
<script type="application/javascript" src="/lib/d3.v3.min.js"></script>
|
<script type="application/javascript" src="/lib/d3.v3.min.js"></script>
|
||||||
<script type="application/javascript" src="/dist/dimple.v1.1.4.min.js"></script>
|
<script type="application/javascript" src="/dist/dimple.v1.1.5.min.js"></script>
|
||||||
<link rel="stylesheet" href="/stylesheets/styles.css">
|
<link rel="stylesheet" href="/stylesheets/styles.css">
|
||||||
<link rel="stylesheet" href="/stylesheets/pygment_trac.css">
|
<link rel="stylesheet" href="/stylesheets/pygment_trac.css">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
|
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
|
||||||
|
@ -43,10 +43,10 @@
|
||||||
</p>
|
</p>
|
||||||
<h3>Libraries</h3>
|
<h3>Libraries</h3>
|
||||||
<p>
|
<p>
|
||||||
<a href="/dist/dimple.v1.1.4.js">
|
<a href="/dist/dimple.v1.1.5.js">
|
||||||
Full Javascript Library With Comments
|
Full Javascript Library With Comments
|
||||||
</a><br/>
|
</a><br/>
|
||||||
<a href="/dist/dimple.v1.1.4.min.js">
|
<a href="/dist/dimple.v1.1.5.min.js">
|
||||||
Minified Javascript Library
|
Minified Javascript Library
|
||||||
</a><br/>
|
</a><br/>
|
||||||
<a href="https://github.com/PMSI-AlignAlytics/dimple/zipball/master">
|
<a href="https://github.com/PMSI-AlignAlytics/dimple/zipball/master">
|
||||||
|
@ -115,12 +115,12 @@
|
||||||
$.get("examples/" + spec.id + ".html", function (page) {
|
$.get("examples/" + spec.id + ".html", function (page) {
|
||||||
$("#codeContainer").text(
|
$("#codeContainer").text(
|
||||||
page.slice(page.indexOf("<div"))
|
page.slice(page.indexOf("<div"))
|
||||||
.replace("src=\"/dist/dimple.v1.1.4.js\"", "src=\"http://dimplejs.org/dist/dimple.v1.1.4.min.js\"")
|
.replace("src=\"/dist/dimple.v1.1.5.js\"", "src=\"http://dimplejs.org/dist/dimple.v1.1.5.min.js\"")
|
||||||
.replace("src=\"/lib/d3.v3.min.js\"", "src=\"http://d3js.org/d3.v3.min.js\"")
|
.replace("src=\"/lib/d3.v3.min.js\"", "src=\"http://d3js.org/d3.v3.min.js\"")
|
||||||
);
|
);
|
||||||
$("#chartBox").html(
|
$("#chartBox").html(
|
||||||
page.slice(page.indexOf("<div"))
|
page.slice(page.indexOf("<div"))
|
||||||
.replace("src=\"/dist/dimple.v1.1.4.js\"", "")
|
.replace("src=\"/dist/dimple.v1.1.5.js\"", "")
|
||||||
.replace("src=\"/lib/d3.v3.min.js\"", "")
|
.replace("src=\"/lib/d3.v3.min.js\"", "")
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
// This is the simple vertical grouped stacked 100% bar example
|
// This is the simple vertical grouped stacked 100% bar example
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
|
|
||||||
// Create the svg and set the dimensions
|
// Create the svg and set the dimensions
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
|
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
|
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
|
|
||||||
// Create the svg and set the dimensions
|
// Create the svg and set the dimensions
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
var data = [
|
var data = [
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer" style="height: 100%">
|
<div id="chartContainer" style="height: 100%">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
// In version 1.1.0 it's possible to initialise any size parameter with a
|
// In version 1.1.0 it's possible to initialise any size parameter with a
|
||||||
// % value as well as pixels
|
// % value as well as pixels
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
@ -22,7 +22,9 @@
|
||||||
var indicatorColor = indicator.defaultColors[2];
|
var indicatorColor = indicator.defaultColors[2];
|
||||||
|
|
||||||
// The frame duration for the animation in milliseconds
|
// The frame duration for the animation in milliseconds
|
||||||
var frame = 750;
|
var frame = 2000;
|
||||||
|
|
||||||
|
var firstTick = true;
|
||||||
|
|
||||||
// Place the indicator bar chart to the right
|
// Place the indicator bar chart to the right
|
||||||
indicator.setBounds(434, 49, 153, 311);
|
indicator.setBounds(434, 49, 153, 311);
|
||||||
|
@ -73,12 +75,9 @@
|
||||||
s.shapes
|
s.shapes
|
||||||
.attr("rx", 10)
|
.attr("rx", 10)
|
||||||
.attr("ry", 10)
|
.attr("ry", 10)
|
||||||
.style("fill", defaultColor.fill)
|
.style("fill", function (d) { return (d.y === 'Jan-12' ? indicatorColor.fill : defaultColor.fill) })
|
||||||
.style("stroke", defaultColor.stroke)
|
.style("stroke", function (d) { return (d.y === 'Jan-12' ? indicatorColor.stroke : defaultColor.stroke) })
|
||||||
.style("opacity", 0.4);
|
.style("opacity", 0.4);
|
||||||
svg.selectAll("rect.Jan-12")
|
|
||||||
.style("fill", indicatorColor.fill)
|
|
||||||
.style("stroke", indicatorColor.stroke);
|
|
||||||
|
|
||||||
// Draw the main chart
|
// Draw the main chart
|
||||||
var bubbles = new dimple.chart(svg, data);
|
var bubbles = new dimple.chart(svg, data);
|
||||||
|
@ -121,18 +120,15 @@
|
||||||
|
|
||||||
// On tick of the main charts storyboard
|
// On tick of the main charts storyboard
|
||||||
function onTick(e) {
|
function onTick(e) {
|
||||||
|
if (!firstTick) {
|
||||||
// Color all shapes the same
|
// Color all shapes the same
|
||||||
s.shapes
|
s.shapes
|
||||||
.transition()
|
.transition()
|
||||||
.duration(frame / 2)
|
.duration(frame / 2)
|
||||||
.style("fill", defaultColor.fill)
|
.style("fill", function (d) { return (d.y === e ? indicatorColor.fill : defaultColor.fill) })
|
||||||
.style("stroke", defaultColor.stroke);
|
.style("stroke", function (d) { return (d.y === e ? indicatorColor.stroke : defaultColor.stroke) });
|
||||||
// Then color the selected shape differently
|
}
|
||||||
svg.selectAll("rect." + e)
|
firstTick = false;
|
||||||
.transition()
|
|
||||||
.duration(frame / 2)
|
|
||||||
.style("fill", indicatorColor.fill)
|
|
||||||
.style("stroke", indicatorColor.stroke);
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
|
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
|
|
||||||
// This code should support any data in this structure changing the data here
|
// This code should support any data in this structure changing the data here
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<!----------------------------------------------------------------->
|
<!----------------------------------------------------------------->
|
||||||
<div id="chartContainer">
|
<div id="chartContainer">
|
||||||
<script src="/lib/d3.v3.min.js"></script>
|
<script src="/lib/d3.v3.min.js"></script>
|
||||||
<script src="/dist/dimple.v1.1.4.js"></script>
|
<script src="/dist/dimple.v1.1.5.js"></script>
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
var svg = dimple.newSvg("#chartContainer", 590, 400);
|
||||||
d3.tsv("/data/example_data.tsv", function (data) {
|
d3.tsv("/data/example_data.tsv", function (data) {
|
||||||
|
|
|
@ -19,7 +19,9 @@
|
||||||
var indicatorColor = indicator.defaultColors[2];
|
var indicatorColor = indicator.defaultColors[2];
|
||||||
|
|
||||||
// The frame duration for the animation in milliseconds
|
// The frame duration for the animation in milliseconds
|
||||||
var frame = 750;
|
var frame = 2000;
|
||||||
|
|
||||||
|
var firstTick = true;
|
||||||
|
|
||||||
// Place the indicator bar chart to the right
|
// Place the indicator bar chart to the right
|
||||||
indicator.setBounds(434, 49, 153, 311);
|
indicator.setBounds(434, 49, 153, 311);
|
||||||
|
@ -70,12 +72,9 @@
|
||||||
s.shapes
|
s.shapes
|
||||||
.attr("rx", 10)
|
.attr("rx", 10)
|
||||||
.attr("ry", 10)
|
.attr("ry", 10)
|
||||||
.style("fill", defaultColor.fill)
|
.style("fill", function (d) { return (d.y === 'Jan-12' ? indicatorColor.fill : defaultColor.fill) })
|
||||||
.style("stroke", defaultColor.stroke)
|
.style("stroke", function (d) { return (d.y === 'Jan-12' ? indicatorColor.stroke : defaultColor.stroke) })
|
||||||
.style("opacity", 0.4);
|
.style("opacity", 0.4);
|
||||||
svg.selectAll("rect.Jan-12")
|
|
||||||
.style("fill", indicatorColor.fill)
|
|
||||||
.style("stroke", indicatorColor.stroke);
|
|
||||||
|
|
||||||
// Draw the main chart
|
// Draw the main chart
|
||||||
var bubbles = new dimple.chart(svg, data);
|
var bubbles = new dimple.chart(svg, data);
|
||||||
|
@ -118,18 +117,15 @@
|
||||||
|
|
||||||
// On tick of the main charts storyboard
|
// On tick of the main charts storyboard
|
||||||
function onTick(e) {
|
function onTick(e) {
|
||||||
|
if (!firstTick) {
|
||||||
// Color all shapes the same
|
// Color all shapes the same
|
||||||
s.shapes
|
s.shapes
|
||||||
.transition()
|
.transition()
|
||||||
.duration(frame / 2)
|
.duration(frame / 2)
|
||||||
.style("fill", defaultColor.fill)
|
.style("fill", function (d) { return (d.y === e ? indicatorColor.fill : defaultColor.fill) })
|
||||||
.style("stroke", defaultColor.stroke);
|
.style("stroke", function (d) { return (d.y === e ? indicatorColor.stroke : defaultColor.stroke) });
|
||||||
// Then color the selected shape differently
|
}
|
||||||
svg.selectAll("rect." + e)
|
firstTick = false;
|
||||||
.transition()
|
|
||||||
.duration(frame / 2)
|
|
||||||
.style("fill", indicatorColor.fill)
|
|
||||||
.style("stroke", indicatorColor.stroke);
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -39,10 +39,10 @@
|
||||||
</table>
|
</table>
|
||||||
<h3>Libraries</h3>
|
<h3>Libraries</h3>
|
||||||
<p>
|
<p>
|
||||||
<a href="/dist/dimple.v1.1.4.js">
|
<a href="/dist/dimple.v1.1.5.js">
|
||||||
Full Javascript Library With Comments
|
Full Javascript Library With Comments
|
||||||
</a><br/>
|
</a><br/>
|
||||||
<a href="/dist/dimple.v1.1.4.min.js">
|
<a href="/dist/dimple.v1.1.5.min.js">
|
||||||
Minified Javascript Library
|
Minified Javascript Library
|
||||||
</a><br/>
|
</a><br/>
|
||||||
<a href="https://github.com/PMSI-AlignAlytics/dimple/zipball/master">
|
<a href="https://github.com/PMSI-AlignAlytics/dimple/zipball/master">
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
<meta http-equiv="X-UA-Compatible" content="chrome=1">
|
<meta http-equiv="X-UA-Compatible" content="chrome=1">
|
||||||
<title id="title"></title>
|
<title id="title"></title>
|
||||||
<script type="application/javascript" src="/lib/d3.v3.min.js"></script>
|
<script type="application/javascript" src="/lib/d3.v3.min.js"></script>
|
||||||
<script type="application/javascript" src="/dist/dimple.v1.1.4.min.js"></script>
|
<script type="application/javascript" src="/dist/dimple.v1.1.5.min.js"></script>
|
||||||
<link rel="stylesheet" href="/stylesheets/styles.css">
|
<link rel="stylesheet" href="/stylesheets/styles.css">
|
||||||
<link rel="stylesheet" href="/stylesheets/pygment_trac.css">
|
<link rel="stylesheet" href="/stylesheets/pygment_trac.css">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
|
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
|
||||||
|
@ -43,10 +43,10 @@
|
||||||
</p>
|
</p>
|
||||||
<h3>Libraries</h3>
|
<h3>Libraries</h3>
|
||||||
<p>
|
<p>
|
||||||
<a href="/dist/dimple.v1.1.4.js">
|
<a href="/dist/dimple.v1.1.5.js">
|
||||||
Full Javascript Library With Comments
|
Full Javascript Library With Comments
|
||||||
</a><br/>
|
</a><br/>
|
||||||
<a href="/dist/dimple.v1.1.4.min.js">
|
<a href="/dist/dimple.v1.1.5.min.js">
|
||||||
Minified Javascript Library
|
Minified Javascript Library
|
||||||
</a><br/>
|
</a><br/>
|
||||||
<a href="https://github.com/PMSI-AlignAlytics/dimple/zipball/master">
|
<a href="https://github.com/PMSI-AlignAlytics/dimple/zipball/master">
|
||||||
|
@ -115,12 +115,12 @@
|
||||||
$.get("examples/" + spec.id + ".html", function (page) {
|
$.get("examples/" + spec.id + ".html", function (page) {
|
||||||
$("#codeContainer").text(
|
$("#codeContainer").text(
|
||||||
page.slice(page.indexOf("<div"))
|
page.slice(page.indexOf("<div"))
|
||||||
.replace("src=\"/dist/dimple.v1.1.4.js\"", "src=\"http://dimplejs.org/dist/dimple.v1.1.4.min.js\"")
|
.replace("src=\"/dist/dimple.v1.1.5.js\"", "src=\"http://dimplejs.org/dist/dimple.v1.1.5.min.js\"")
|
||||||
.replace("src=\"/lib/d3.v3.min.js\"", "src=\"http://d3js.org/d3.v3.min.js\"")
|
.replace("src=\"/lib/d3.v3.min.js\"", "src=\"http://d3js.org/d3.v3.min.js\"")
|
||||||
);
|
);
|
||||||
$("#chartBox").html(
|
$("#chartBox").html(
|
||||||
page.slice(page.indexOf("<div"))
|
page.slice(page.indexOf("<div"))
|
||||||
.replace("src=\"/dist/dimple.v1.1.4.js\"", "")
|
.replace("src=\"/dist/dimple.v1.1.5.js\"", "")
|
||||||
.replace("src=\"/lib/d3.v3.min.js\"", "")
|
.replace("src=\"/lib/d3.v3.min.js\"", "")
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
Before Width: | Height: | Size: 13 KiB After Width: | Height: | Size: 13 KiB |
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 12 KiB |
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 15 KiB |
Before Width: | Height: | Size: 13 KiB After Width: | Height: | Size: 13 KiB |
Before Width: | Height: | Size: 7.8 KiB After Width: | Height: | Size: 7.8 KiB |
Before Width: | Height: | Size: 10 KiB After Width: | Height: | Size: 10 KiB |
Before Width: | Height: | Size: 7.4 KiB After Width: | Height: | Size: 7.4 KiB |
Before Width: | Height: | Size: 5.8 KiB After Width: | Height: | Size: 5.8 KiB |
Before Width: | Height: | Size: 573 B After Width: | Height: | Size: 573 B |
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 11 KiB |
Before Width: | Height: | Size: 6.6 KiB After Width: | Height: | Size: 6.6 KiB |
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 15 KiB |
Before Width: | Height: | Size: 13 KiB After Width: | Height: | Size: 13 KiB |
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 20 KiB |
Before Width: | Height: | Size: 6.2 KiB After Width: | Height: | Size: 6.2 KiB |
Before Width: | Height: | Size: 9.8 KiB After Width: | Height: | Size: 9.8 KiB |
Before Width: | Height: | Size: 9.3 KiB After Width: | Height: | Size: 9.3 KiB |
Before Width: | Height: | Size: 23 KiB After Width: | Height: | Size: 23 KiB |
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 20 KiB |
Before Width: | Height: | Size: 13 KiB After Width: | Height: | Size: 13 KiB |
Before Width: | Height: | Size: 10 KiB After Width: | Height: | Size: 10 KiB |
Before Width: | Height: | Size: 9.2 KiB After Width: | Height: | Size: 9.2 KiB |
Before Width: | Height: | Size: 8.7 KiB After Width: | Height: | Size: 8.7 KiB |
Before Width: | Height: | Size: 21 KiB After Width: | Height: | Size: 21 KiB |
Before Width: | Height: | Size: 19 KiB After Width: | Height: | Size: 19 KiB |
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 12 KiB |
Before Width: | Height: | Size: 9.4 KiB After Width: | Height: | Size: 9.4 KiB |
Before Width: | Height: | Size: 9.9 KiB After Width: | Height: | Size: 9.4 KiB |
Before Width: | Height: | Size: 4.9 KiB After Width: | Height: | Size: 4.9 KiB |
Before Width: | Height: | Size: 6.7 KiB After Width: | Height: | Size: 6.7 KiB |
Before Width: | Height: | Size: 8.9 KiB After Width: | Height: | Size: 8.9 KiB |