feat(pie): Intent to ship pie's pdding and innerRadius options.

Add new options padding and innerRadius for pie

Fix #301
Close #304

demo/demo.js

@@ -2233,6 +2233,21 @@ var demos = {
 				}
 			}
 		},
+		InnerRadius: {
+			options: {
+				data: {
+					columns: [
+						['data1', 30],
+						['data2', 50],
+						['data3', 20]
+					],
+					type: 'pie'
+				},
+				pie: {
+					innerRadius: 20
+				}
+			}
+		},
 		PadAngle: {
 			options: {
 				data: {
@@ -2246,6 +2261,21 @@ var demos = {
 					padAngle: 0.1
 				}
 			}
+		},
+		Padding: {
+			options: {
+				data: {
+					columns: [
+						['data1', 30],
+						['data2', 50],
+						['data3', 20]
+					],
+					type: 'pie'
+				},
+				pie: {
+					padding: 3
+				}
+			}
 		}
 	},
 	API: {

spec/internals/arc-spec.js

@@ -117,6 +117,28 @@ describe("ARC", () => {
 			expect(chart.internal.pie.padAngle()()).to.be.equal(value);
 			expect(chart.internal.main.selectAll(`text.${CLASS.chartArcsTitle} tspan`).size()).to.be.equal(3);
 		});
+
+		it("check for padding and innerRadius", () => {
+			const padding = 5;
+			const innerRadius = 20;
+			const chart = util.generate({
+				data: {
+					columns: [
+						["data1", 60],
+						["data2", 40]
+					],
+					type: "pie"
+				},
+				pie: {
+					padding,
+					innerRadius
+				}
+			});
+			const internal = chart.internal;
+
+			expect(internal.pie.padAngle()()).to.be.equal(padding * 0.01);
+			expect(internal.innerRadius).to.be.equal(innerRadius);
+		});
 	});
 
 	describe("show gauge", () => {

src/config/Options.js

@@ -2313,7 +2313,9 @@ export default class Options {
 			 * @property {Number} [pie.label.threshold=0.05] Set threshold to show/hide labels.
 			 * @property {Number|Function} [pie.label.ratio=undefined] Set ratio of labels position.
 			 * @property {Boolean} [pie.expand=true] Enable or disable expanding pie pieces.
+			 * @property {Number} [pie.innerRadius=0] Sets the inner radius of pie arc.
 			 * @property {Number} [pie.padAngle=0] Set padding between data.
+			 * @property {Number} [pie.padding=0] Sets the gap between pie arcs.
 			 * @example
 			 *  pie: {
 			 *      label: {
@@ -2332,7 +2334,9 @@ export default class Options {
 			 *          ratio: 0.5
 			 *      },
 			 *      expand: false,
-			 *      padAngle: 0.1
+			 *      innerRadius: 0,
+			 *      padAngle: 0.1,
+			 *      padding: 0
 			 *  }
 			 */
 			pie_label_show: true,
@@ -2341,7 +2345,9 @@ export default class Options {
 			pie_label_ratio: undefined,
 			pie_expand: {},
 			pie_expand_duration: 50,
+			pie_innerRadius: 0,
 			pie_padAngle: 0,
+			pie_padding: 0,
 
 			/**
 			 * Set gauge options

src/shape/arc.js

@@ -18,14 +18,19 @@ extend(ChartInternal.prototype, {
 		const $$ = this;
 		const config = $$.config;
 
+		const padAngle = $$.hasType("pie") && config.pie_padding ?
+			config.pie_padding * 0.01 : config[`${config.data_type}_padAngle`] ?
+				config[`${config.data_type}_padAngle`] : 0;
+
 		$$.pie = d3Pie()
-			.padAngle(config[`${config.data_type}_padAngle`] || 0)
+			.padAngle(padAngle)
 			.value(d => d.values.reduce((a, b) => a + b.value, 0));
 
 		if (!config.data_order) {
 			$$.pie.sort(null);
 		}
 	},
+
 	updateRadius() {
 		const $$ = this;
 		const config = $$.config;
@@ -35,16 +40,24 @@ extend(ChartInternal.prototype, {
 		$$.radius = $$.radiusExpanded * 0.95;
 		$$.innerRadiusRatio = w ? ($$.radius - w) / $$.radius : 0.6;
 
+		const innerRadius = config.pie_innerRadius ?
+			config.pie_innerRadius : (
+				config.pie_padding ?
+					config.pie_padding * ($$.innerRadiusRatio + 0.1) : 0
+			);
+
 		$$.innerRadius = $$.hasType("donut") || $$.hasType("gauge") ?
-			$$.radius * $$.innerRadiusRatio : 0;
+			$$.radius * $$.innerRadiusRatio : innerRadius;
 	},
+
 	updateArc() {
 		const $$ = this;
 
 		$$.svgArc = $$.getSvgArc();
 		$$.svgArcExpanded = $$.getSvgArcExpanded();
 		$$.svgArcExpandedSub = $$.getSvgArcExpanded(0.98);
 	},
+
 	updateAngle(dValue) {
 		const $$ = this;
 		const config = $$.config;