mirror of https://github.com/vitalif/dimple
Composite Category Axes
parent
c9087f9480
commit
bd63f88d90
|
@ -279,7 +279,7 @@ var dimple = {
|
|||
this._max = (this.overrideMax !== null ? this.overrideMax : this._max);
|
||||
|
||||
// If this is an x axis
|
||||
if (this.position === "x") {
|
||||
if (this.position === "x" && this._scale === null) {
|
||||
if (this._hasTimeField()) {
|
||||
this._scale = d3.time.scale()
|
||||
.rangeRound([this.chart._xPixels(), this.chart._xPixels() + this.chart._widthPixels()])
|
||||
|
@ -296,6 +296,12 @@ var dimple = {
|
|||
.nice();
|
||||
} else if (this.measure === null || this.measure === undefined) {
|
||||
distinctCats = getOrderedCategories(this, "x", "y");
|
||||
// If there are any slaves process accordingly
|
||||
if (this._slaves !== null && this._slaves !== undefined) {
|
||||
this._slaves.forEach(function (slave) {
|
||||
distinctCats = distinctCats.concat(getOrderedCategories(slave, "x", "y"));
|
||||
}, this);
|
||||
}
|
||||
this._scale = d3.scale.ordinal()
|
||||
.rangePoints([this.chart._xPixels(), this.chart._xPixels() + this.chart._widthPixels()])
|
||||
.domain(distinctCats.concat([""]));
|
||||
|
@ -321,7 +327,7 @@ var dimple = {
|
|||
break;
|
||||
}
|
||||
}
|
||||
} else if (this.position === "y") {
|
||||
} else if (this.position === "y" && this._scale === null) {
|
||||
if (this._hasTimeField()) {
|
||||
this._scale = d3.time.scale()
|
||||
.rangeRound([this.chart._yPixels() + this.chart._heightPixels(), this.chart._yPixels()])
|
||||
|
@ -338,6 +344,12 @@ var dimple = {
|
|||
.nice();
|
||||
} else if (this.measure === null || this.measure === undefined) {
|
||||
distinctCats = getOrderedCategories(this, "y", "x");
|
||||
// If there are any slaves process accordingly
|
||||
if (this._slaves !== null && this._slaves !== undefined) {
|
||||
this._slaves.forEach(function (slave) {
|
||||
distinctCats = distinctCats.concat(getOrderedCategories(slave, "y", "x"));
|
||||
}, this);
|
||||
}
|
||||
this._scale = d3.scale.ordinal()
|
||||
.rangePoints([this.chart._yPixels() + this.chart._heightPixels(), this.chart._yPixels()])
|
||||
.domain(distinctCats.concat([""]));
|
||||
|
@ -364,7 +376,7 @@ var dimple = {
|
|||
break;
|
||||
}
|
||||
}
|
||||
} else if (this.position.length > 0 && this.position[0] === "z") {
|
||||
} else if (this.position.length > 0 && this.position[0] === "z" && this._scale === null) {
|
||||
if (this.useLog) {
|
||||
this._scale = d3.scale.log()
|
||||
.range([this.chart._heightPixels() / 300, this.chart._heightPixels() / 10])
|
||||
|
@ -379,7 +391,7 @@ var dimple = {
|
|||
.range([this.chart._heightPixels() / 300, this.chart._heightPixels() / 10])
|
||||
.domain([this._min, this._max]);
|
||||
}
|
||||
} else if (this.position.length > 0 && this.position[0] === "c") {
|
||||
} else if (this.position.length > 0 && this.position[0] === "c" && this._scale === null) {
|
||||
this._scale = d3.scale.linear()
|
||||
.range([0, (this.colors === null || this.colors.length === 1 ? 1 : this.colors.length - 1)])
|
||||
.domain([this._min, this._max]);
|
||||
|
@ -629,17 +641,26 @@ var dimple = {
|
|||
aggField = [],
|
||||
key,
|
||||
k,
|
||||
i,
|
||||
newRow,
|
||||
updateData;
|
||||
|
||||
if (series.categoryFields === null || series.categoryFields === undefined || series.categoryFields.length === 0) {
|
||||
aggField = ["All"];
|
||||
} else if (series.categoryFields.length === 1 && d[series.categoryFields[0]] === undefined) {
|
||||
aggField = [series.categoryFields[0]];
|
||||
} else {
|
||||
series.categoryFields.forEach(function (cat) {
|
||||
aggField.push(d[cat]);
|
||||
}, this);
|
||||
// Iterate the category fields
|
||||
for (i = 0; i < series.categoryFields.length; i += 1) {
|
||||
// Either add the value of the field or the name itself. This allows users to add custom values, for example
|
||||
// Setting a particular color for a set of values can be done by using a non-existent final value and then coloring
|
||||
// by it
|
||||
if (d[series.categoryFields[i]] === undefined) {
|
||||
aggField.push(series.categoryFields[i]);
|
||||
} else {
|
||||
aggField.push(d[series.categoryFields[i]]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Add a key
|
||||
key = aggField.join("/") + "_" + xField.join("/") + "_" + yField.join("/") + "_" + zField.join("/");
|
||||
// See if this field has already been added.
|
||||
|
@ -1258,7 +1279,13 @@ var dimple = {
|
|||
}, this);
|
||||
axis._max = distinctCats.length;
|
||||
}
|
||||
|
||||
// Set the bounds on all slaves
|
||||
if (axis._slaves !== null && axis._slaves !== undefined && axis._slaves.length > 0) {
|
||||
axis._slaves.forEach(function (slave) {
|
||||
slave._min = axis._min;
|
||||
slave._max = axis._max;
|
||||
}, this);
|
||||
}
|
||||
// Update the axis now we have all information set
|
||||
axis._update();
|
||||
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -10,10 +10,13 @@
|
|||
data = dimple.filterData(data, "Owner", ["Aperture", "Black Mesa"])
|
||||
var myChart = new dimple.chart(svg, data);
|
||||
myChart.setBounds(60, 30, 505, 305);
|
||||
var x = myChart.addCategoryAxis("x", "Month");
|
||||
x.addOrderRule("Date");
|
||||
myChart.addMeasureAxis("y", "Unit Sales");
|
||||
myChart.addSeries("Channel", dimple.plot.line);
|
||||
var x1 = myChart.addCategoryAxis("x", "Month");
|
||||
x1.addOrderRule("Date");
|
||||
var x2 = myChart.addCategoryAxis(x1, "Price Tier");
|
||||
var y1 = myChart.addMeasureAxis("y", "Unit Sales");
|
||||
var y2 = myChart.addMeasureAxis("y", "Operating Profit");
|
||||
myChart.addSeries("Channel", dimple.plot.line, [x1, y1]);
|
||||
myChart.addSeries("Channel", dimple.plot.bar, [x2, y2]);
|
||||
myChart.addLegend(60, 10, 500, 20, "right");
|
||||
myChart.draw();
|
||||
});
|
||||
|
|
|
@ -7,10 +7,13 @@
|
|||
data = dimple.filterData(data, "Owner", ["Aperture", "Black Mesa"])
|
||||
var myChart = new dimple.chart(svg, data);
|
||||
myChart.setBounds(60, 30, 505, 305);
|
||||
var x = myChart.addCategoryAxis("x", "Month");
|
||||
x.addOrderRule("Date");
|
||||
myChart.addMeasureAxis("y", "Unit Sales");
|
||||
myChart.addSeries("Channel", dimple.plot.line);
|
||||
var x1 = myChart.addCategoryAxis("x", "Month");
|
||||
x1.addOrderRule("Date");
|
||||
var x2 = myChart.addCategoryAxis(x1, "Price Tier");
|
||||
var y1 = myChart.addMeasureAxis("y", "Unit Sales");
|
||||
var y2 = myChart.addMeasureAxis("y", "Operating Profit");
|
||||
myChart.addSeries("Channel", dimple.plot.line, [x1, y1]);
|
||||
myChart.addSeries("Channel", dimple.plot.bar, [x2, y2]);
|
||||
myChart.addLegend(60, 10, 500, 20, "right");
|
||||
myChart.draw();
|
||||
});
|
||||
|
|
|
@ -45,7 +45,7 @@
|
|||
this._max = (this.overrideMax !== null ? this.overrideMax : this._max);
|
||||
|
||||
// If this is an x axis
|
||||
if (this.position === "x") {
|
||||
if (this.position === "x" && this._scale === null) {
|
||||
if (this._hasTimeField()) {
|
||||
this._scale = d3.time.scale()
|
||||
.rangeRound([this.chart._xPixels(), this.chart._xPixels() + this.chart._widthPixels()])
|
||||
|
@ -62,6 +62,12 @@
|
|||
.nice();
|
||||
} else if (this.measure === null || this.measure === undefined) {
|
||||
distinctCats = getOrderedCategories(this, "x", "y");
|
||||
// If there are any slaves process accordingly
|
||||
if (this._slaves !== null && this._slaves !== undefined) {
|
||||
this._slaves.forEach(function (slave) {
|
||||
distinctCats = distinctCats.concat(getOrderedCategories(slave, "x", "y"));
|
||||
}, this);
|
||||
}
|
||||
this._scale = d3.scale.ordinal()
|
||||
.rangePoints([this.chart._xPixels(), this.chart._xPixels() + this.chart._widthPixels()])
|
||||
.domain(distinctCats.concat([""]));
|
||||
|
@ -87,7 +93,7 @@
|
|||
break;
|
||||
}
|
||||
}
|
||||
} else if (this.position === "y") {
|
||||
} else if (this.position === "y" && this._scale === null) {
|
||||
if (this._hasTimeField()) {
|
||||
this._scale = d3.time.scale()
|
||||
.rangeRound([this.chart._yPixels() + this.chart._heightPixels(), this.chart._yPixels()])
|
||||
|
@ -104,6 +110,12 @@
|
|||
.nice();
|
||||
} else if (this.measure === null || this.measure === undefined) {
|
||||
distinctCats = getOrderedCategories(this, "y", "x");
|
||||
// If there are any slaves process accordingly
|
||||
if (this._slaves !== null && this._slaves !== undefined) {
|
||||
this._slaves.forEach(function (slave) {
|
||||
distinctCats = distinctCats.concat(getOrderedCategories(slave, "y", "x"));
|
||||
}, this);
|
||||
}
|
||||
this._scale = d3.scale.ordinal()
|
||||
.rangePoints([this.chart._yPixels() + this.chart._heightPixels(), this.chart._yPixels()])
|
||||
.domain(distinctCats.concat([""]));
|
||||
|
@ -130,7 +142,7 @@
|
|||
break;
|
||||
}
|
||||
}
|
||||
} else if (this.position.length > 0 && this.position[0] === "z") {
|
||||
} else if (this.position.length > 0 && this.position[0] === "z" && this._scale === null) {
|
||||
if (this.useLog) {
|
||||
this._scale = d3.scale.log()
|
||||
.range([this.chart._heightPixels() / 300, this.chart._heightPixels() / 10])
|
||||
|
@ -145,7 +157,7 @@
|
|||
.range([this.chart._heightPixels() / 300, this.chart._heightPixels() / 10])
|
||||
.domain([this._min, this._max]);
|
||||
}
|
||||
} else if (this.position.length > 0 && this.position[0] === "c") {
|
||||
} else if (this.position.length > 0 && this.position[0] === "c" && this._scale === null) {
|
||||
this._scale = d3.scale.linear()
|
||||
.range([0, (this.colors === null || this.colors.length === 1 ? 1 : this.colors.length - 1)])
|
||||
.domain([this._min, this._max]);
|
||||
|
|
|
@ -110,17 +110,26 @@
|
|||
aggField = [],
|
||||
key,
|
||||
k,
|
||||
i,
|
||||
newRow,
|
||||
updateData;
|
||||
|
||||
if (series.categoryFields === null || series.categoryFields === undefined || series.categoryFields.length === 0) {
|
||||
aggField = ["All"];
|
||||
} else if (series.categoryFields.length === 1 && d[series.categoryFields[0]] === undefined) {
|
||||
aggField = [series.categoryFields[0]];
|
||||
} else {
|
||||
series.categoryFields.forEach(function (cat) {
|
||||
aggField.push(d[cat]);
|
||||
}, this);
|
||||
// Iterate the category fields
|
||||
for (i = 0; i < series.categoryFields.length; i += 1) {
|
||||
// Either add the value of the field or the name itself. This allows users to add custom values, for example
|
||||
// Setting a particular color for a set of values can be done by using a non-existent final value and then coloring
|
||||
// by it
|
||||
if (d[series.categoryFields[i]] === undefined) {
|
||||
aggField.push(series.categoryFields[i]);
|
||||
} else {
|
||||
aggField.push(d[series.categoryFields[i]]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Add a key
|
||||
key = aggField.join("/") + "_" + xField.join("/") + "_" + yField.join("/") + "_" + zField.join("/");
|
||||
// See if this field has already been added.
|
||||
|
|
|
@ -103,7 +103,13 @@
|
|||
}, this);
|
||||
axis._max = distinctCats.length;
|
||||
}
|
||||
|
||||
// Set the bounds on all slaves
|
||||
if (axis._slaves !== null && axis._slaves !== undefined && axis._slaves.length > 0) {
|
||||
axis._slaves.forEach(function (slave) {
|
||||
slave._min = axis._min;
|
||||
slave._max = axis._max;
|
||||
}, this);
|
||||
}
|
||||
// Update the axis now we have all information set
|
||||
axis._update();
|
||||
|
||||
|
|
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue