vitalif-js
/
dimple
mirror of https://github.com/vitalif/dimple
1
0
Fork 0
Code Issues Releases Wiki Activity

Fixed Droplines for Bar and Bubble Popups

master
John Kiernander 2013-05-29 08:41:57 +01:00
parent 686647dc5f
commit 975d9bba9d
4 changed files with 98 additions and 86 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

90
dist/dimple.v1.js vendored
View File

@ -2138,6 +2138,7 @@ dimple.plot.bar = {
var height = parseFloat(selectedShape.attr("height"));
var opacity = selectedShape.attr("opacity");
var fill = selectedShape.attr("fill");
var dropDest = series._dropLineOrigin();
// Fade the popup stroke mixing the shape fill with 60% white
var popupStrokeColor = d3.rgb(
@ -2158,12 +2159,12 @@ dimple.plot.bar = {
.attr("class", "hoverShapes");
// Add a drop line to the x axis
if (!series.x._hasCategories()) {
if (!series.x._hasCategories() && dropDest.y !== null) {
g.append("line")
.attr("x1", (x < series.x._origin ? x : x + width ) - 1)
.attr("y1", (y < series.y._origin ? y + height : y ))
.attr("x2", (x < series.x._origin ? x : x + width ) - 1)
.attr("y2", (y < series.y._origin ? y + height : y ))
.attr("x1", (x < series.x._origin ? x + 1 : x + width - 1))
.attr("y1", (y < dropDest.y ? y + height : y ))
.attr("x2", (x < series.x._origin ? x + 1 : x + width - 1))
.attr("y2", (y < dropDest.y ? y + height : y ))
.style("fill", "none")
.style("stroke", fill)
.style("stroke-width", 2)
@ -2173,16 +2174,16 @@ dimple.plot.bar = {
.delay(animDuration / 2)
.duration(animDuration / 2)
.ease("linear")
.attr("y2", series.y._origin);
.attr("y2", dropDest.y);
}
// Add a drop line to the y axis
if (!series.y._hasCategories()) {
if (!series.y._hasCategories() && dropDest.x !== null) {
g.append("line")
.attr("x1", (x < series.x._origin ? x + width : x ))
.attr("y1", (y < series.y._origin ? y : y + height ) + 1)
.attr("x2", (x < series.x._origin ? x + width : x ))
.attr("y2", (y < series.y._origin ? y : y + height ) + 1)
.attr("x1", (x < dropDest.x ? x + width : x ))
.attr("y1", (y < series.y._origin ? y + 1 : y + height - 1 ))
.attr("x2", (x < dropDest.x ? x + width : x ))
.attr("y2", (y < series.y._origin ? y + 1 : y + height - 1 ))
.style("fill", "none")
.style("stroke", fill)
.style("stroke-width", 2)
@ -2192,7 +2193,7 @@ dimple.plot.bar = {
.delay(animDuration / 2)
.duration(animDuration / 2)
.ease("linear")
.attr("x2", series.x._origin);
.attr("x2", dropDest.x);
}
// Add a group for text
@ -2432,6 +2433,7 @@ dimple.plot.bubble = {
var r = parseFloat(selectedShape.attr("r"));
var opacity = selectedShape.attr("opacity");
var fill = selectedShape.attr("fill");
var dropDest = series._dropLineOrigin();
// Fade the popup stroke mixing the shape fill with 60% white
var popupStrokeColor = d3.rgb(
@ -2468,38 +2470,42 @@ dimple.plot.bubble = {
.style("stroke-width", 2);
// Add a drop line to the x axis
g.append("line")
.attr("x1", cx)
.attr("y1", (cy < series.y._origin ? cy + r + 4 : cy - r - 4 ))
.attr("x2", cx)
.attr("y2", (cy < series.y._origin ? cy + r + 4 : cy - r - 4 ))
.style("fill", "none")
.style("stroke", fill)
.style("stroke-width", 2)
.style("stroke-dasharray", ("3, 3"))
.style("opacity", opacity)
.transition()
.delay(animDuration / 2)
.duration(animDuration / 2)
.ease("linear")
.attr("y2", series.y._origin);
if (dropDest.y !== null) {
g.append("line")
.attr("x1", cx)
.attr("y1", (cy < dropDest.y ? cy + r + 4 : cy - r - 4 ))
.attr("x2", cx)
.attr("y2", (cy < dropDest.y ? cy + r + 4 : cy - r - 4 ))
.style("fill", "none")
.style("stroke", fill)
.style("stroke-width", 2)
.style("stroke-dasharray", ("3, 3"))
.style("opacity", opacity)
.transition()
.delay(animDuration / 2)
.duration(animDuration / 2)
.ease("linear")
.attr("y2", dropDest.y);
}
// Add a drop line to the y axis
g.append("line")
.attr("x1", (cx < series.x._origin ? cx + r + 4 : cx - r - 4 ))
.attr("y1", cy)
.attr("x2", (cx < series.x._origin ? cx + r + 4 : cx - r - 4 ))
.attr("y2", cy)
.style("fill", "none")
.style("stroke", fill)
.style("stroke-width", 2)
.style("stroke-dasharray", ("3, 3"))
.style("opacity", opacity)
.transition()
.delay(animDuration / 2)
.duration(animDuration / 2)
.ease("linear")
.attr("x2", series.x._origin);
if (dropDest.x !== null) {
g.append("line")
.attr("x1", (cx < dropDest.x ? cx + r + 4 : cx - r - 4 ))
.attr("y1", cy)
.attr("x2", (cx < dropDest.x ? cx + r + 4 : cx - r - 4 ))
.attr("y2", cy)
.style("fill", "none")
.style("stroke", fill)
.style("stroke-width", 2)
.style("stroke-dasharray", ("3, 3"))
.style("opacity", opacity)
.transition()
.delay(animDuration / 2)
.duration(animDuration / 2)
.ease("linear")
.attr("x2", dropDest.x);
}
// Add a group for text
var t = g.append("g");

4
dist/dimple.v1.min.js vendored
View File

File diff suppressed because one or more lines are too long

25
src/objects/plot/bar.js
View File

@ -107,6 +107,7 @@ dimple.plot.bar = {
var height = parseFloat(selectedShape.attr("height"));
var opacity = selectedShape.attr("opacity");
var fill = selectedShape.attr("fill");
var dropDest = series._dropLineOrigin();
// Fade the popup stroke mixing the shape fill with 60% white
var popupStrokeColor = d3.rgb(
@ -127,12 +128,12 @@ dimple.plot.bar = {
.attr("class", "hoverShapes");
// Add a drop line to the x axis
if (!series.x._hasCategories()) {
if (!series.x._hasCategories() && dropDest.y !== null) {
g.append("line")
.attr("x1", (x < series.x._origin ? x : x + width ) - 1)
.attr("y1", (y < series.y._origin ? y + height : y ))
.attr("x2", (x < series.x._origin ? x : x + width ) - 1)
.attr("y2", (y < series.y._origin ? y + height : y ))
.attr("x1", (x < series.x._origin ? x + 1 : x + width - 1))
.attr("y1", (y < dropDest.y ? y + height : y ))
.attr("x2", (x < series.x._origin ? x + 1 : x + width - 1))
.attr("y2", (y < dropDest.y ? y + height : y ))
.style("fill", "none")
.style("stroke", fill)
.style("stroke-width", 2)
@ -142,16 +143,16 @@ dimple.plot.bar = {
.delay(animDuration / 2)
.duration(animDuration / 2)
.ease("linear")
.attr("y2", series.y._origin);
.attr("y2", dropDest.y);
}
// Add a drop line to the y axis
if (!series.y._hasCategories()) {
if (!series.y._hasCategories() && dropDest.x !== null) {
g.append("line")
.attr("x1", (x < series.x._origin ? x + width : x ))
.attr("y1", (y < series.y._origin ? y : y + height ) + 1)
.attr("x2", (x < series.x._origin ? x + width : x ))
.attr("y2", (y < series.y._origin ? y : y + height ) + 1)
.attr("x1", (x < dropDest.x ? x + width : x ))
.attr("y1", (y < series.y._origin ? y + 1 : y + height - 1 ))
.attr("x2", (x < dropDest.x ? x + width : x ))
.attr("y2", (y < series.y._origin ? y + 1 : y + height - 1 ))
.style("fill", "none")
.style("stroke", fill)
.style("stroke-width", 2)
@ -161,7 +162,7 @@ dimple.plot.bar = {
.delay(animDuration / 2)
.duration(animDuration / 2)
.ease("linear")
.attr("x2", series.x._origin);
.attr("x2", dropDest.x);
}
// Add a group for text

65
src/objects/plot/bubble.js
View File

@ -103,6 +103,7 @@ dimple.plot.bubble = {
var r = parseFloat(selectedShape.attr("r"));
var opacity = selectedShape.attr("opacity");
var fill = selectedShape.attr("fill");
var dropDest = series._dropLineOrigin();
// Fade the popup stroke mixing the shape fill with 60% white
var popupStrokeColor = d3.rgb(
@ -139,38 +140,42 @@ dimple.plot.bubble = {
.style("stroke-width", 2);
// Add a drop line to the x axis
g.append("line")
.attr("x1", cx)
.attr("y1", (cy < series.y._origin ? cy + r + 4 : cy - r - 4 ))
.attr("x2", cx)
.attr("y2", (cy < series.y._origin ? cy + r + 4 : cy - r - 4 ))
.style("fill", "none")
.style("stroke", fill)
.style("stroke-width", 2)
.style("stroke-dasharray", ("3, 3"))
.style("opacity", opacity)
.transition()
.delay(animDuration / 2)
.duration(animDuration / 2)
.ease("linear")
.attr("y2", series.y._origin);
if (dropDest.y !== null) {
g.append("line")
.attr("x1", cx)
.attr("y1", (cy < dropDest.y ? cy + r + 4 : cy - r - 4 ))
.attr("x2", cx)
.attr("y2", (cy < dropDest.y ? cy + r + 4 : cy - r - 4 ))
.style("fill", "none")
.style("stroke", fill)
.style("stroke-width", 2)
.style("stroke-dasharray", ("3, 3"))
.style("opacity", opacity)
.transition()
.delay(animDuration / 2)
.duration(animDuration / 2)
.ease("linear")
.attr("y2", dropDest.y);
}
// Add a drop line to the y axis
g.append("line")
.attr("x1", (cx < series.x._origin ? cx + r + 4 : cx - r - 4 ))
.attr("y1", cy)
.attr("x2", (cx < series.x._origin ? cx + r + 4 : cx - r - 4 ))
.attr("y2", cy)
.style("fill", "none")
.style("stroke", fill)
.style("stroke-width", 2)
.style("stroke-dasharray", ("3, 3"))
.style("opacity", opacity)
.transition()
.delay(animDuration / 2)
.duration(animDuration / 2)
.ease("linear")
.attr("x2", series.x._origin);
if (dropDest.x !== null) {
g.append("line")
.attr("x1", (cx < dropDest.x ? cx + r + 4 : cx - r - 4 ))
.attr("y1", cy)
.attr("x2", (cx < dropDest.x ? cx + r + 4 : cx - r - 4 ))
.attr("y2", cy)
.style("fill", "none")
.style("stroke", fill)
.style("stroke-width", 2)
.style("stroke-dasharray", ("3, 3"))
.style("opacity", opacity)
.transition()
.delay(animDuration / 2)
.duration(animDuration / 2)
.ease("linear")
.attr("x2", dropDest.x);
}
// Add a group for text
var t = g.append("g");