Permalink
Browse files

fix ordinal exclude dimensions hack, display tweaks

  • Loading branch information...
1 parent 758cafb commit 76a16963fa51ba558a19b420cecb6516f923069a @syntagmatic committed Mar 17, 2013
Showing with 12 additions and 9 deletions.
  1. +7 −6 d3.parcoords.js
  2. +3 −1 examples/veterans.html
  3. +2 −2 index.html
View
@@ -5,7 +5,7 @@ d3.parcoords = function(config) {
types: {},
brushed: false,
mode: "default",
- rate: 10,
+ rate: 20,
width: 600,
height: 300,
margin: { top: 24, right: 0, bottom: 12, left: 0 },
@@ -112,12 +112,13 @@ d3.parcoords = function(config) {
});
// hack to remove ordinal dimensions with many values
- pc.dimensions().forEach(function(p,i) {
- if (__.types[p] == "string" && yscale[p].domain().length > 60) {
- __.dimensions.splice(i,1);
- pc.dimensions(__.dimensions);
+ pc.dimensions(pc.dimensions().filter(function(p,i) {
+ var uniques = yscale[p].domain().length;
+ if (__.types[p] == "string" && (uniques > 60 || uniques < 2)) {
+ return false;
}
- });
+ return true;
+ }));
// xscale
xscale.rangePoints([0, w()], 1);
View
@@ -52,6 +52,8 @@
<div id="grid"></div>
<div id="pager"></div>
<script id="brushing">
+var parcoords = d3.parcoords();
+
// load csv file and create the chart
d3.csv('../data/ngl_wyoming.csv', function(data) {
// process veterans dataset
@@ -79,7 +81,7 @@
// slickgrid needs each data element to have an id
data.forEach(function(d,i) { d.id = d.id || i; });
- var parcoords = d3.parcoords()("#example")
+ parcoords("#example")
.data(data)
.alpha(0.1)
.mode("queue") // progressive rendering
View
@@ -408,7 +408,7 @@ <h3>Progressive Rendering</h3>
<p>With thousands of data points, the chart will get less responsive when brushing. The interface may stutter or freeze, frustrating the user. To solve this, enable progressive rendering by setting the render <a href="https://github.com/syntagmatic/parallel-coordinates#parcoords_mode">mode</a> to <em>"queue"</em>.</p>
<p>Change the speed of rendering by setting the <a href="https://github.com/syntagmatic/parallel-coordinates#parcoords_rate">rate</a>. You can read more about this technique on the <a href="http://bl.ocks.org/d/3341641/">Render Queue</a> page.</p>
-<div id="example-progressive" class="parcoords" style="width:1200px;margin-left:-200px;"></div>
+<div id="example-progressive" class="parcoords" style="width:1300px;margin-left:-250px;height:270px;"></div>
<pre><a href="#" class="show-code" data-code="progressive">Show code</a></pre>
<script id="progressive">// linear color scale
@@ -432,7 +432,7 @@ <h3>Progressive Rendering</h3>
.data(data)
.color(color)
.alpha(0.4)
- .margin({ top: 24, left: 90, bottom: 12, right: 0 })
+ .margin({ top: 24, left: 150, bottom: 12, right: 0 })
.mode("queue")
.render()
.brushable() // enable brushing

0 comments on commit 76a1696

Please sign in to comment.