D3js Parallel coordinates of categorical data

Question

I am looking for a way to add categorical data to d3js parallel coordinates. D3js is new to me, I can understand some of what is being done, but could not figure out how to do it. Parallel sets are not a good option, as most of my data is continuous.

If you are thinking of an example with a car, I would like to be able to filter by brand along the axis (for example, a filter so that only data on Ford is displayed). I assume that a specific variable will be required to determine each car (e.g. Peugeot, Ford, BMW, Audi, etc.)

Here is an example of a car.

http://bl.ocks.org/1341281

Thanks to everyone who answers.

Answer 1

In fact, all you need is an ordinal scale! The axis takes care of the rest.

Check here .

I basically changed:

x.domain(dimensions = d3.keys(cars[0]).filter(function(d) { return d != "name" && (y[d] = d3.scale.linear() .domain(d3.extent(cars, function(p) { return +p[d]; })) .range([h, 0])); })); 

in

 x.domain(dimensions = d3.keys(cars[0]).filter(function(d) { if(d === "name") return false; if(d === "colour") { y[d] = d3.scale.ordinal() .domain(cars.map(function(p) { return p[d]; })) .rangePoints([h, 0]); } else { y[d] = d3.scale.linear() .domain(d3.extent(cars, function(p) { return +p[d]; })) .range([h, 0]); } return true; })); 

And I added one column categorical column to the data. I was a bit lazy for hard coding, whose property is string.