This is the code I'm using to initiate my pie chart
pieGraph.ejChart(
{
series: [{
points: [{ x: 'Campaign 1', y: 13, text: '13% - Campaign 1', interior: 'rgb(4,57,91)' },
{ x: 'Campaign 2', y: 25, text: '25% - Campaign 2', interior: 'rgb(3,97,167)' },
{ x: 'Campaign 3', y: 12, text: '12% - Campaign 3', interior: 'rgb(0,134,187)' },
{ x: 'Campaign 4', y: 7, text: '7% - Campaign 4', interior: 'rgb(59,187,237)' },
{ x: 'Campaign 5', y: 10, text: '10% - Campaign 5', interior: 'rgb(130,205,237)' },
{ x: 'Campaign 6', y: 14, text: '14% - Campaign 6', interior: 'rgb(193,227,239)' },
{ x: 'Campaign 7', y: 10, text: '10% - Campaign 7', interior: 'rgb(179,222,202)' },
{ x: 'Campaign 8', y: 10, text: '10% - Campaign 8', interior: 'rgb(113,198,167)' }
],
labelPosition: 'outside',
marker: { textOffset: 40 },
name: 'pie', type: 'pie', explode: true,
pieOptions: { text: { font: { size: '12px'} } }
}],
pointRegionClick: function (sender) {
alert(sender.Data.Region.Region.PointIndex);
},
size: { height: scrollH },
legend: { visible: false }
});
Now scrollH in this instance is 480
And with this, the graph renders like this
https://www.dropbox.com/s/0bz57e235tz9n25/question_9_1_pie.jpg
As you can see from firebug, the rect is indeed 480px
in height, and 759px in width.
https://www.dropbox.com/s/5auxu0b3yvh9flg/question_9_2_pie.jpg
But the graph seems to render exactly at the center.
with a height of 275px, and a width of 446px.
https://www.dropbox.com/s/5auxu0b3yvh9flg/question_9_2_pie.jpg
How do I prevent this, and make the graph use up the entire width and height
This is a waste of useful space ?, the graph is too small.