Question

我试图绘制raphaeljs饼图。我使用了与“http://g.raphaeljs.com/piechart2.html”相同的示例。它呈现给我文本，但饼图失踪。有人可以帮忙吗？

请找到以下代码。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
    <head>
        <title>g·Raphaël Dynamic Pie Chart Demo</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta name="author" content="Dmitry Baranovskiy">
        <meta name="description" content="Charting JavaScript Library">
        <link rel="stylesheet" href="demo.css" type="text/css" media="screen" charset="utf-8">
        <link rel="stylesheet" href="demo-print.css" type="text/css" media="print" charset="utf-8">
        <script src="raphael.js" type="text/javascript" charset="utf-8"></script>
        <script src="g.raphael.js" type="text/javascript" charset="utf-8"></script>
        <script src="g.pie.js" type="text/javascript" charset="utf-8"></script>
        <script type="text/javascript" charset="utf-8">
            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>
</html>

Answer 1

你有任何造型

<div id="holder"></div>

无论如何，请尝试使用

中的前两个值

var pie = r.g.piechart(320, 240, ...

他们确定定位。听起来像你的情况，你想让那些更小。

绘制gRaphaeljs饼图

1 个答案: