problem drawing gRaphaeljs pie chart
Posted
by Aswad
on Stack Overflow
See other posts from Stack Overflow
or by Aswad
Published on 2009-11-05T16:07:55Z
Indexed on
2010/04/07
16:03 UTC
Read the original article
Hit count: 402
Hi,
I was trying to draw the raphaeljs piechart. I used the same example as shown on "http://g.raphaeljs.com/piechart2.html". It renders me the text but the pie charts goes missing.Can someone please help?
please find the code below.
g·Raphaël Dynamic Pie Chart Demo window.onload = function () { var r = Raphael("holder"); r.g.txtattr.font = "12px 'Fontin Sans', Fontin-Sans, sans-serif";
r.g.text(320, 100, "Interactive Pie Chart Demo").attr({"font-size": 20});
var pie = r.g.piechart(320, 240, 100, [55, 20, 13, 32, 5, 1, 2, 10], {legend: ["%%.%% – Enterprise Users", "IE Users"], legendpos: "west", href: ["http://raphaeljs.com", "http://g.raphaeljs.com"]});
pie.hover(function () {
this.sector.stop();
this.sector.scale(1.1, 1.1, this.cx, this.cy);
if (this.label) {
this.label[0].stop();
this.label[0].scale(1.5);
this.label[1].attr({"font-weight": 800});
}
}, function () {
this.sector.animate({scale: [1, 1, this.cx, this.cy]}, 500, "bounce");
if (this.label) {
this.label[0].animate({scale: 1}, 500, "bounce");
this.label[1].attr({"font-weight": 400});
}
});
};
</script>
</head>
<body class="raphael" id="g.raphael.dmitry.baranovskiy.com">
<div id="holder"></div>
<p>
Pie chart with legend, hyperlinks on two first sectors and hover effect.
</p>
<p>
Demo of <a href="http://g.raphaeljs.com/">g·Raphaël</a> JavaScript library.
</p>
</body>
© Stack Overflow or respective owner