0

我只是想使用 flotr（用于开发各种图表的开源 javascript）绘制一个简单的饼图。但是我给出的代码有一点作用。图表已绘制并且爆炸属性、水平线和垂直线都可以正常工作。但是鼠标跟踪器和图例不起作用。我想我在代码中犯了一些错误。但我无法清除它。请任何人帮助我。提前致谢。

<html>
<head>
<script type="text/javascript" src="prototype-1.6.0.2.js"></script>
<script type="text/javascript" src="flotr.js"></script>
</head>
    <body>
        <div id="container" style="width:600px;height:300px;" ></div>

        <script type="text/javascript">
        (function basic_pie(container) {
  var
    d1 = [[0, 4]],
    d2 = [[0, 3]],
    d3 = [[0, 1.03]],
    d4 = [[0, 3.5]],
    graph;
   graph = Flotr.draw('container', [
    { data : d1, label : 'Comedy' },
    { data : d2, label : 'Action' },
    { data : d3, label : 'Romance',
      pie : {
        explode : 50
      }
    },
    { data : d4, label : 'Drama' }
  ], {
    HtmlText : false,
    grid : {
      verticalLines : false,
      horizontalLines : false
    },
    xaxis : { showLabels : false },
    yaxis : { showLabels : false },
    pie : {
      show : true, 
      explode : 6
    },
    mouse : { track : true },
    legend : {
      position : 'se',
      backgroundColor : '#D2E8FF'
    }
  });
})(document.getElementById("editor-render-0"));
</script>
</body>
</html>
4

2 回答 2

1

您可以查看浏览器的类型，您使用的是哪种浏览器？如果是 IE，你应该添加

meta http-equiv="X-UA-Compatible" content="IE=edge"

在<head>段的第一行，并添加

[if IE]> script type="text/javascript" src="../lib/excanvas.js">script <![endif]

为了<head>兼容性。你应该添加一行：

var container = document.getElementById(' container ');

infunction basic_pie(container)的第一行以容器元素为目标。

（注意：我的一些答案字符串被stackoverflow网站弄乱了。抱歉）

于 2013-05-08T02:51:52.253 回答
0

您的图例配置可能有错误，我将其删除并且图例正确显示。看看：http: //jsfiddle.net/Kpmcn/

于 2012-07-12T19:30:42.237 回答