PieChart (pieRadius = 0.4)
PieChart (pieRadius = 0.2)
// Define a dataset.
var dataset = {
'myFirstDataset': [[0, 3], [1, 2], [2, 1.414], [3, 2.3]],
'mySecondDataset': [[0, 1.4], [1, 2.67], [2, 1.34], [3, 1.2]],
'myThirdDataset': [[0, 0.46], [1, 1.45], [2, 1.0], [3, 1.6]],
'myFourthDataset': [[0, 0.3], [1, 0.83], [2, 0.7], [3, 0.2]]
};
// Define options.
var options = {
// Define a padding for the canvas node.
padding: {
left: 30,
right: 0,
top: 10,
bottom: 30
},
// Background color to render.
background: {
color: '#f2f2f2'
},
// Use the predefined blue colorscheme.
colorScheme: 'blue',
axis: {
// The fontcolor of the labels is black.
labelColor: '#000000',
// Add the ticks. Keep in mind, x and y axis are swapped
// when the BarOrientation is horizontal.
x: {
ticks: [
{v:0, label:'January'},
{v:1, label:'February'},
{v:2, label:'March'},
{v:3, label:'April'}
]
}
}
};
// Instantiate a new PieCart.
var pie = new Plotr.PieChart('pie1',options);
// Add a dataset to it.
pie.addDataset(dataset);
// Render it.
pie.render();
// Change some attributes.
Object.extend(options,{
// Use the predefined grey colorscheme.
colorScheme: 'grey',
// Change the radius to 0.2 (default = 0.4).
pieRadius: '0.2',
// Background color to render.
background: {
color: '#d8efb0'
}
});
// Instead of instantiating a new PieChart object,
// you also can use reset(), that resets the options and datasets.
pie.reset();
pie.addDataset(dataset);
// Render the PieChart.
pie.render('pie2', options);