mirror of https://github.com/vitalif/dimple
In Out Animation Improvement
parent
1e867416ac
commit
6ec000b3d6
|
@ -3365,10 +3365,10 @@ var dimple = {
|
|||
d.zField.join(" ").split(" ").join("_");
|
||||
})
|
||||
.attr("cx", function (d) {
|
||||
return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._origin);
|
||||
return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._previousOrigin);
|
||||
})
|
||||
.attr("cy", function (d) {
|
||||
return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._origin);
|
||||
return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._previousOrigin);
|
||||
})
|
||||
.attr("r", 0)
|
||||
.attr("opacity", function (d) { return dimple._helpers.opacity(d, chart, series); })
|
||||
|
@ -3679,13 +3679,17 @@ var dimple = {
|
|||
// the first aggField defines the points and the others define the line
|
||||
firstAgg = (series.x._hasCategories() || series.y._hasCategories() ? 0 : 1),
|
||||
// Build the point calculator
|
||||
lineCoords = d3.svg.line()
|
||||
.x(function (d) { return dimple._helpers.cx(d, chart, series); })
|
||||
.y(function (d) { return dimple._helpers.cy(d, chart, series); }),
|
||||
updateCoords = d3.svg.line()
|
||||
.x(function (d) { return (dimple._helpers.cx(d, chart, series)).toFixed(2); })
|
||||
.y(function (d) { return (dimple._helpers.cy(d, chart, series)).toFixed(2); }),
|
||||
// Build the point calculator
|
||||
entryExitCoords = d3.svg.line()
|
||||
.x(function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._origin); })
|
||||
.y(function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._origin); }),
|
||||
entryCoords = d3.svg.line()
|
||||
.x(function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._previousOrigin).toFixed(2); })
|
||||
.y(function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._previousOrigin).toFixed(2); }),
|
||||
// Build the point calculator
|
||||
exitCoords = d3.svg.line()
|
||||
.x(function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._origin).toFixed(2); })
|
||||
.y(function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._origin).toFixed(2); }),
|
||||
graded = false,
|
||||
i,
|
||||
k,
|
||||
|
@ -3780,8 +3784,8 @@ var dimple = {
|
|||
.append("circle")
|
||||
.attr("id", function (d) { return d.key; })
|
||||
.attr("class", markerBackClasses.join(" "))
|
||||
.attr("cx", function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._origin); })
|
||||
.attr("cy", function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._origin); })
|
||||
.attr("cx", function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._previousOrigin); })
|
||||
.attr("cy", function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._previousOrigin); })
|
||||
.attr("r", 0)
|
||||
.attr("fill", "white")
|
||||
.attr("stroke", "none");
|
||||
|
@ -3794,6 +3798,8 @@ var dimple = {
|
|||
|
||||
// Remove
|
||||
rem = addTransition(markerBacks.exit(), duration)
|
||||
.attr("cx", function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._origin); })
|
||||
.attr("cy", function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._origin); })
|
||||
.attr("r", 0);
|
||||
|
||||
// Run after transition methods
|
||||
|
@ -3835,8 +3841,8 @@ var dimple = {
|
|||
.on("mouseleave", function (e) {
|
||||
self.leaveEventHandler(e, this, chart, series);
|
||||
})
|
||||
.attr("cx", function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._origin); })
|
||||
.attr("cy", function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._origin); })
|
||||
.attr("cx", function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._previousOrigin); })
|
||||
.attr("cy", function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._previousOrigin); })
|
||||
.attr("r", 0)
|
||||
.attr("opacity", (series.lineMarkers || lineDataRow.data.length < 2 ? lineDataRow.color.opacity : 0))
|
||||
.call(function () {
|
||||
|
@ -3866,6 +3872,8 @@ var dimple = {
|
|||
|
||||
// Remove
|
||||
rem = addTransition(markers.exit(), duration)
|
||||
.attr("cx", function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._origin); })
|
||||
.attr("cy", function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._origin); })
|
||||
.attr("r", 0);
|
||||
|
||||
// Run after transition methods
|
||||
|
@ -3938,9 +3946,11 @@ var dimple = {
|
|||
dimple._addGradient(lineData[i].key, "fill-line-gradient-" + lineData[i].keyString, (series.x._hasCategories() ? series.x : series.y), data, chart, duration, "fill");
|
||||
}
|
||||
// Get the points that this line will appear
|
||||
lineData[i].entryExit = entryExitCoords(lineData[i].data);
|
||||
lineData[i].entry = entryCoords(lineData[i].data);
|
||||
// Get the actual points of the line
|
||||
lineData[i].line = lineCoords(lineData[i].data);
|
||||
lineData[i].update = updateCoords(lineData[i].data);
|
||||
// Get the actual points of the line
|
||||
lineData[i].exit = exitCoords(lineData[i].data);
|
||||
// Add the color in this loop, it can't be done during initialisation of the row becase
|
||||
// the lines should be ordered first (to ensure standard distribution of colors
|
||||
lineData[i].color = chart.getColor(lineData[i].key.length > 0 ? lineData[i].key[lineData[i].key.length - 1] : "All");
|
||||
|
@ -3965,7 +3975,7 @@ var dimple = {
|
|||
return className + " dmp-line " + d.keyString;
|
||||
})
|
||||
.attr("d", function (d) {
|
||||
return d.entryExit;
|
||||
return d.entry;
|
||||
})
|
||||
.call(function () {
|
||||
// Apply formats optionally
|
||||
|
@ -3981,13 +3991,13 @@ var dimple = {
|
|||
|
||||
// Update
|
||||
updated = addTransition(theseShapes, duration)
|
||||
.attr("d", function (d) { return d.line; })
|
||||
.attr("d", function (d) { return d.update; })
|
||||
.each(drawMarkerBacks)
|
||||
.each(drawMarkers);
|
||||
|
||||
// Remove
|
||||
removed = addTransition(theseShapes.exit(), duration)
|
||||
.attr("d", function (d) { return d.entryExit; })
|
||||
.attr("d", function (d) { return d.exit; })
|
||||
.each(drawMarkerBacks)
|
||||
.each(drawMarkers);
|
||||
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -0,0 +1,66 @@
|
|||
<!----------------------------------------------------------------->
|
||||
<!-- AUTOMATICALLY GENERATED CODE - PLEASE EDIT TEMPLATE INSTEAD -->
|
||||
<!----------------------------------------------------------------->
|
||||
<div id="chartContainer">
|
||||
<script src="/lib/d3.v3.min.js"></script>
|
||||
<script src="/dist/dimple.v1.2.0.js"></script>
|
||||
<script type="text/javascript">
|
||||
var dim = {"width":590,"height":450}; //chart container width
|
||||
var data = [{"date":"01-02-2010","cost":"11.415679194952766"},{"date":"01-03-2010","cost":"10.81875691467018"},{"date":"01-04-2010","cost":"12.710197879070897"}];
|
||||
|
||||
function barplot(id,dim,data)
|
||||
{
|
||||
keys = Object.keys(data[0]);
|
||||
var xcord = keys[0];
|
||||
var ycord = keys[1];
|
||||
var svg = dimple.newSvg(id, dim.width, dim.height);
|
||||
|
||||
var myChart = new dimple.chart(svg,data);
|
||||
myChart.setBounds(60, 30, 505, 305);
|
||||
|
||||
var x = myChart.addCategoryAxis("x", xcord);
|
||||
x.addOrderRule(xcord);
|
||||
x.showGridlines = true;
|
||||
|
||||
var y = myChart.addMeasureAxis("y", ycord);
|
||||
y.showGridlines = true;
|
||||
y.tickFormat = ',.1f';
|
||||
|
||||
var xDummy = myChart.addTimeAxis("x", "date", "%y", "%y");
|
||||
xDummy.overrideMin = d3.time.format("%y").parse("00");
|
||||
xDummy.overrideMax = d3.time.format("%y").parse("01");
|
||||
xDummy.hidden = true;
|
||||
|
||||
var s = myChart.addSeries(null, dimple.plot.bar);
|
||||
var s1 = myChart.addSeries(null, dimple.plot.line);
|
||||
s1.lineWeight = 3;
|
||||
s1.lineMarkers = true;
|
||||
|
||||
|
||||
var s3 = myChart.addSeries("Price Break", dimple.plot.line, [xDummy, y]);
|
||||
s3.data = [
|
||||
{ "Price Break" : "high", "cost" : 12.71, "date" : "00" }, { "Price Break" : "high", "cost" : 12.71, "date" : "01" },
|
||||
{ "Price Break" : "avg", "cost" : 11.65, "date" : "00" }, { "Price Break" : "avg", "cost" : 11.65, "date" : "01" },
|
||||
{ "Price Break" : "low", "cost" : 10.82, "date" : "00" }, { "Price Break" : "low", "cost" : 10.82, "date" : "01" }
|
||||
];
|
||||
|
||||
myChart.draw(1500);
|
||||
|
||||
// function addHorizontalLine(value, color) {
|
||||
// svg
|
||||
// .append("line")
|
||||
// .attr("x1", myChart._xPixels())
|
||||
// .attr("y1", s.y._scale(value))
|
||||
// .attr("x2", myChart._xPixels() + myChart._widthPixels())
|
||||
// .attr("y2", s.y._scale(avg))
|
||||
// .style("stroke", color);
|
||||
// }
|
||||
|
||||
// addHorizontalLine(avg
|
||||
|
||||
}
|
||||
|
||||
barplot("body",dim,data);
|
||||
|
||||
</script>
|
||||
</div>
|
|
@ -54,10 +54,10 @@
|
|||
d.zField.join(" ").split(" ").join("_");
|
||||
})
|
||||
.attr("cx", function (d) {
|
||||
return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._origin);
|
||||
return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._previousOrigin);
|
||||
})
|
||||
.attr("cy", function (d) {
|
||||
return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._origin);
|
||||
return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._previousOrigin);
|
||||
})
|
||||
.attr("r", 0)
|
||||
.attr("opacity", function (d) { return dimple._helpers.opacity(d, chart, series); })
|
||||
|
|
|
@ -15,13 +15,17 @@
|
|||
// the first aggField defines the points and the others define the line
|
||||
firstAgg = (series.x._hasCategories() || series.y._hasCategories() ? 0 : 1),
|
||||
// Build the point calculator
|
||||
lineCoords = d3.svg.line()
|
||||
.x(function (d) { return dimple._helpers.cx(d, chart, series); })
|
||||
.y(function (d) { return dimple._helpers.cy(d, chart, series); }),
|
||||
updateCoords = d3.svg.line()
|
||||
.x(function (d) { return (dimple._helpers.cx(d, chart, series)).toFixed(2); })
|
||||
.y(function (d) { return (dimple._helpers.cy(d, chart, series)).toFixed(2); }),
|
||||
// Build the point calculator
|
||||
entryExitCoords = d3.svg.line()
|
||||
.x(function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._origin); })
|
||||
.y(function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._origin); }),
|
||||
entryCoords = d3.svg.line()
|
||||
.x(function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._previousOrigin).toFixed(2); })
|
||||
.y(function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._previousOrigin).toFixed(2); }),
|
||||
// Build the point calculator
|
||||
exitCoords = d3.svg.line()
|
||||
.x(function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._origin).toFixed(2); })
|
||||
.y(function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._origin).toFixed(2); }),
|
||||
graded = false,
|
||||
i,
|
||||
k,
|
||||
|
@ -116,8 +120,8 @@
|
|||
.append("circle")
|
||||
.attr("id", function (d) { return d.key; })
|
||||
.attr("class", markerBackClasses.join(" "))
|
||||
.attr("cx", function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._origin); })
|
||||
.attr("cy", function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._origin); })
|
||||
.attr("cx", function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._previousOrigin); })
|
||||
.attr("cy", function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._previousOrigin); })
|
||||
.attr("r", 0)
|
||||
.attr("fill", "white")
|
||||
.attr("stroke", "none");
|
||||
|
@ -130,6 +134,8 @@
|
|||
|
||||
// Remove
|
||||
rem = addTransition(markerBacks.exit(), duration)
|
||||
.attr("cx", function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._origin); })
|
||||
.attr("cy", function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._origin); })
|
||||
.attr("r", 0);
|
||||
|
||||
// Run after transition methods
|
||||
|
@ -171,8 +177,8 @@
|
|||
.on("mouseleave", function (e) {
|
||||
self.leaveEventHandler(e, this, chart, series);
|
||||
})
|
||||
.attr("cx", function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._origin); })
|
||||
.attr("cy", function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._origin); })
|
||||
.attr("cx", function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._previousOrigin); })
|
||||
.attr("cy", function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._previousOrigin); })
|
||||
.attr("r", 0)
|
||||
.attr("opacity", (series.lineMarkers || lineDataRow.data.length < 2 ? lineDataRow.color.opacity : 0))
|
||||
.call(function () {
|
||||
|
@ -202,6 +208,8 @@
|
|||
|
||||
// Remove
|
||||
rem = addTransition(markers.exit(), duration)
|
||||
.attr("cx", function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._origin); })
|
||||
.attr("cy", function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._origin); })
|
||||
.attr("r", 0);
|
||||
|
||||
// Run after transition methods
|
||||
|
@ -274,9 +282,11 @@
|
|||
dimple._addGradient(lineData[i].key, "fill-line-gradient-" + lineData[i].keyString, (series.x._hasCategories() ? series.x : series.y), data, chart, duration, "fill");
|
||||
}
|
||||
// Get the points that this line will appear
|
||||
lineData[i].entryExit = entryExitCoords(lineData[i].data);
|
||||
lineData[i].entry = entryCoords(lineData[i].data);
|
||||
// Get the actual points of the line
|
||||
lineData[i].line = lineCoords(lineData[i].data);
|
||||
lineData[i].update = updateCoords(lineData[i].data);
|
||||
// Get the actual points of the line
|
||||
lineData[i].exit = exitCoords(lineData[i].data);
|
||||
// Add the color in this loop, it can't be done during initialisation of the row becase
|
||||
// the lines should be ordered first (to ensure standard distribution of colors
|
||||
lineData[i].color = chart.getColor(lineData[i].key.length > 0 ? lineData[i].key[lineData[i].key.length - 1] : "All");
|
||||
|
@ -301,7 +311,7 @@
|
|||
return className + " dmp-line " + d.keyString;
|
||||
})
|
||||
.attr("d", function (d) {
|
||||
return d.entryExit;
|
||||
return d.entry;
|
||||
})
|
||||
.call(function () {
|
||||
// Apply formats optionally
|
||||
|
@ -317,13 +327,13 @@
|
|||
|
||||
// Update
|
||||
updated = addTransition(theseShapes, duration)
|
||||
.attr("d", function (d) { return d.line; })
|
||||
.attr("d", function (d) { return d.update; })
|
||||
.each(drawMarkerBacks)
|
||||
.each(drawMarkers);
|
||||
|
||||
// Remove
|
||||
removed = addTransition(theseShapes.exit(), duration)
|
||||
.attr("d", function (d) { return d.entryExit; })
|
||||
.attr("d", function (d) { return d.exit; })
|
||||
.each(drawMarkerBacks)
|
||||
.each(drawMarkers);
|
||||
|
||||
|
|
|
@ -3365,10 +3365,10 @@ var dimple = {
|
|||
d.zField.join(" ").split(" ").join("_");
|
||||
})
|
||||
.attr("cx", function (d) {
|
||||
return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._origin);
|
||||
return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._previousOrigin);
|
||||
})
|
||||
.attr("cy", function (d) {
|
||||
return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._origin);
|
||||
return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._previousOrigin);
|
||||
})
|
||||
.attr("r", 0)
|
||||
.attr("opacity", function (d) { return dimple._helpers.opacity(d, chart, series); })
|
||||
|
@ -3679,13 +3679,17 @@ var dimple = {
|
|||
// the first aggField defines the points and the others define the line
|
||||
firstAgg = (series.x._hasCategories() || series.y._hasCategories() ? 0 : 1),
|
||||
// Build the point calculator
|
||||
lineCoords = d3.svg.line()
|
||||
.x(function (d) { return dimple._helpers.cx(d, chart, series); })
|
||||
.y(function (d) { return dimple._helpers.cy(d, chart, series); }),
|
||||
updateCoords = d3.svg.line()
|
||||
.x(function (d) { return (dimple._helpers.cx(d, chart, series)).toFixed(2); })
|
||||
.y(function (d) { return (dimple._helpers.cy(d, chart, series)).toFixed(2); }),
|
||||
// Build the point calculator
|
||||
entryExitCoords = d3.svg.line()
|
||||
.x(function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._origin); })
|
||||
.y(function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._origin); }),
|
||||
entryCoords = d3.svg.line()
|
||||
.x(function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._previousOrigin).toFixed(2); })
|
||||
.y(function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._previousOrigin).toFixed(2); }),
|
||||
// Build the point calculator
|
||||
exitCoords = d3.svg.line()
|
||||
.x(function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._origin).toFixed(2); })
|
||||
.y(function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._origin).toFixed(2); }),
|
||||
graded = false,
|
||||
i,
|
||||
k,
|
||||
|
@ -3780,8 +3784,8 @@ var dimple = {
|
|||
.append("circle")
|
||||
.attr("id", function (d) { return d.key; })
|
||||
.attr("class", markerBackClasses.join(" "))
|
||||
.attr("cx", function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._origin); })
|
||||
.attr("cy", function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._origin); })
|
||||
.attr("cx", function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._previousOrigin); })
|
||||
.attr("cy", function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._previousOrigin); })
|
||||
.attr("r", 0)
|
||||
.attr("fill", "white")
|
||||
.attr("stroke", "none");
|
||||
|
@ -3794,6 +3798,8 @@ var dimple = {
|
|||
|
||||
// Remove
|
||||
rem = addTransition(markerBacks.exit(), duration)
|
||||
.attr("cx", function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._origin); })
|
||||
.attr("cy", function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._origin); })
|
||||
.attr("r", 0);
|
||||
|
||||
// Run after transition methods
|
||||
|
@ -3835,8 +3841,8 @@ var dimple = {
|
|||
.on("mouseleave", function (e) {
|
||||
self.leaveEventHandler(e, this, chart, series);
|
||||
})
|
||||
.attr("cx", function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._origin); })
|
||||
.attr("cy", function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._origin); })
|
||||
.attr("cx", function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._previousOrigin); })
|
||||
.attr("cy", function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._previousOrigin); })
|
||||
.attr("r", 0)
|
||||
.attr("opacity", (series.lineMarkers || lineDataRow.data.length < 2 ? lineDataRow.color.opacity : 0))
|
||||
.call(function () {
|
||||
|
@ -3866,6 +3872,8 @@ var dimple = {
|
|||
|
||||
// Remove
|
||||
rem = addTransition(markers.exit(), duration)
|
||||
.attr("cx", function (d) { return (series.x._hasCategories() ? dimple._helpers.cx(d, chart, series) : series.x._origin); })
|
||||
.attr("cy", function (d) { return (series.y._hasCategories() ? dimple._helpers.cy(d, chart, series) : series.y._origin); })
|
||||
.attr("r", 0);
|
||||
|
||||
// Run after transition methods
|
||||
|
@ -3938,9 +3946,11 @@ var dimple = {
|
|||
dimple._addGradient(lineData[i].key, "fill-line-gradient-" + lineData[i].keyString, (series.x._hasCategories() ? series.x : series.y), data, chart, duration, "fill");
|
||||
}
|
||||
// Get the points that this line will appear
|
||||
lineData[i].entryExit = entryExitCoords(lineData[i].data);
|
||||
lineData[i].entry = entryCoords(lineData[i].data);
|
||||
// Get the actual points of the line
|
||||
lineData[i].line = lineCoords(lineData[i].data);
|
||||
lineData[i].update = updateCoords(lineData[i].data);
|
||||
// Get the actual points of the line
|
||||
lineData[i].exit = exitCoords(lineData[i].data);
|
||||
// Add the color in this loop, it can't be done during initialisation of the row becase
|
||||
// the lines should be ordered first (to ensure standard distribution of colors
|
||||
lineData[i].color = chart.getColor(lineData[i].key.length > 0 ? lineData[i].key[lineData[i].key.length - 1] : "All");
|
||||
|
@ -3965,7 +3975,7 @@ var dimple = {
|
|||
return className + " dmp-line " + d.keyString;
|
||||
})
|
||||
.attr("d", function (d) {
|
||||
return d.entryExit;
|
||||
return d.entry;
|
||||
})
|
||||
.call(function () {
|
||||
// Apply formats optionally
|
||||
|
@ -3981,13 +3991,13 @@ var dimple = {
|
|||
|
||||
// Update
|
||||
updated = addTransition(theseShapes, duration)
|
||||
.attr("d", function (d) { return d.line; })
|
||||
.attr("d", function (d) { return d.update; })
|
||||
.each(drawMarkerBacks)
|
||||
.each(drawMarkers);
|
||||
|
||||
// Remove
|
||||
removed = addTransition(theseShapes.exit(), duration)
|
||||
.attr("d", function (d) { return d.entryExit; })
|
||||
.attr("d", function (d) { return d.exit; })
|
||||
.each(drawMarkerBacks)
|
||||
.each(drawMarkers);
|
||||
|
||||
|
|
Loading…
Reference in New Issue