我的使用flotr的饼图html文件没有完全工作



我只是想用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>

您可以检查浏览器的类型,使用哪种浏览器?如果是IE,你应该添加

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

<head>段中的第一行,并添加

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

在CCD_ 2中为了兼容性。你应该加一行:

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

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

(注意:我的一些答案字符串被stackoverflow网站搞砸了。很抱歉)

图例配置中可能有错误,我删除了它,图例显示正确。看看:http://jsfiddle.net/Kpmcn/

相关内容

  • 没有找到相关文章

最新更新