fix(arc): Correction on rendering 0 values

- When data value is 0 make path to have zero dimension
- Split .redrawArc() to .bindArcEvent()/.redrawArcText() to decrease complexity

Fix #652
Close #656

spec/shape/shape.arc-spec.js

@@ -324,7 +324,7 @@ describe("SHAPE ARC", () => {
 
 			const chartArc = chart.$.main.select(`.${CLASS.chartArcs}`);
 			const min = chartArc.select(`.${CLASS.chartArcsGaugeMin}`);
-			const max = chartArc.select(`.${CLASS.chartArcsGaugeMax}`)
+			const max = chartArc.select(`.${CLASS.chartArcsGaugeMax}`);
 
 			// check if gauge value text is centered
 			expect(+chartArc.select(`.${CLASS.gaugeValue}`).attr("dy")).to.be.above(0);
@@ -385,4 +385,29 @@ describe("SHAPE ARC", () => {
 			}, 500);
 		});
 	});
+
+	describe("check for 0 or null value rendering", () => {
+		let chart;
+
+		before(() => {
+			chart = util.generate({
+				data: {
+					columns: [["data1", 100], ["data2", 0], ["data3", null]],
+					type: "donut"
+				},
+				donut: {
+					title: "Iris Petal Width"
+				}
+			});
+		});
+
+		it("the dimension should be 0x0", () => {
+			["data1", "data2"].forEach(id => {
+				const rect = chart.$.arc.select(`.${CLASS.arc}-${id}`).node().getBBox();
+
+				expect(rect.width === 0).to.be.true;
+				expect(rect.height === 0).to.be.true;
+			});
+		});
+	});
 });