Standalone Examples » Opening / Closing a segment

This shows how you can use the d3pie.openSegment() and d3pie.closeSegment() functions to dynamically open or close a pie segment. Click on the buttons underneath the chart.



var pie = new d3pie("pie", {
	header: {
		title: {
			text: "Another Pie Chart"
		}
	},
	data: {
		content: [
			{ label: "A", value: 1 },
			{ label: "B", value: 2 },
			{ label: "C", value: 3 },
			{ label: "D", value: 4 },
			{ label: "E", value: 5 },
			{ label: "F", value: 6 },
			{ label: "G", value: 7 },
			{ label: "H", value: 8 }
		]
	}
});

// some custom code to illustrate how to use openSegment() and closeSegment()
$(function() {
	$(".openSegmentBtn").on("click", function(e) {
		var index = parseInt($(e.target).data("index"), 10);
		pie.openSegment(index);
	});

	$("#closeSegmentBtn").on("click", function() {
		pie.closeSegment();
	});
});