diff --git a/src/components/charts/BarChartComponent/axes.js b/src/components/charts/BarChartComponent/axes.js index c966c86b9..ece241baa 100644 --- a/src/components/charts/BarChartComponent/axes.js +++ b/src/components/charts/BarChartComponent/axes.js @@ -26,9 +26,9 @@ export const populateY0Axis = (svg, rangeY, width, data, fields) => { svg .select("g.y0-axis") .append("line") - .attr("y1", rangeY(-3)) + .attr("y1", rangeY(0)) .attr("x1", 0) - .attr("y2", rangeY(-3)) + .attr("y2", rangeY(0)) .attr("x2", width) .attr("stroke-width", 1) .attr("opacity", 0.5) diff --git a/src/components/charts/BarChartComponent/data.js b/src/components/charts/BarChartComponent/data.js index 4cc666ed9..a4d6e75db 100644 --- a/src/components/charts/BarChartComponent/data.js +++ b/src/components/charts/BarChartComponent/data.js @@ -104,7 +104,11 @@ export const drawData = ( if (yChanged || reRender) { return dimensions.height; } else { - return ranges.y(d.valuePrev); + if (d.valuePrev < 0) { + return ranges.y(0); + } else { + return ranges.y(d.valuePrev); + } } }) .attr("height", d => { @@ -116,7 +120,13 @@ export const drawData = ( }) .transition() .duration(1000) - .attr("y", d => ranges.y(d.value)) + .attr("y", d => { + if (d.value < 0) { + return ranges.y(0); + } else { + return ranges.y(d.value); + } + }) .attr("height", d => Math.abs(ranges.y(d.value) - ranges.y(0))) .attr("fill", d => ranges.z(d.key)); };