2

我在 IE9 中收到此错误。在所有其他浏览器 - chrome、Firefox 中，我的图表都可以正常工作。任何人都可以就如何解决此错误提出他们的想法吗？

我正在使用 d3 创建饼图。我动态获取路径并附加在 diDataUrlPrefix 中。

var width = 960,
   height = 437,
   radius = Math.min(width, height) / 2;
var mainfile = diDataUrlPrefix + "/appsec/csvs/Legal-RAG.csv";

var color = d3.scale.ordinal()
    .range(["#a00000","#Ffb400","#78a22f"]);//Ffb400




    var arc = d3.svg.arc()
    .outerRadius(radius - 45)
    .innerRadius(radius -200);


    var pie = d3.layout.pie()
    .sort(null)
    .value(function(d) {return d.Components;});

    var svg = d3.select("#mainchart").append("svg")
    .attr("width", width)
    .attr("height", height)
    .attr("style","margin-right:100px;margin-left:20px;margin-top:-20px")
    .append("g")
    .attr("transform", "translate(" + width / 3.2 + "," + height /2.5 + ")");

    d3.csv(mainfile, function(error, data) {
        // Iterate through each status to determine if there are any components
        // Do this avoiding the use of .forEach (IE9 error)
        // VW 2013-09-29
        var length = data.length;
        for(var i=0; i< length; i++) {
            var d = data[i];
            d.Components = +d.Components;
            if(d.Components >0) {
                glblcount=1;
            }
        }

        var g = svg.selectAll(".arc")
        .data(pie(data))
        .enter().append("g")
        .attr("class", "arc")

        g.append("path")
        .attr("d", arc)
        .style("fill","#FFFFFF")
        .transition()
        .ease("bounce")
        .duration(1000)
        .delay(function(d, i) {return i * 500;})
        .style("fill", function(d) {return color(d.data.Source);});

        g.append("text")
        .attr("transform", function(d) 
        {
            var c = arc.centroid(d);
            var param = c[1]- 20;
            var param1= c[0]- 30;
            return "translate(" + param1 + "," + param + ")";
            //return "translate(" + arc.centroid(d) + ")";
        })
        .attr("dy", ".35em")
        .style("text-anchor", "middle")
        .attr("style","font-family: Arial;border: solid 1px" )
        .style("font-color",function(d){
            if ((d.data.Source) =="Amber")
               {
                   //alert(d.data.Source);
                   return "#000000";
               }
               else
                   {
                       return "#ffffff";
                   }

        })
        .transition()
        .ease("bounce")
        .duration(1000)
        .delay(function(d, i) {return i * 500;})
        .text(function(d) { 
            if (eval(d.data.Components) >0)
               {
                   return ((d.data.Status));
               }

        });

调用 d3.layout.pie() 时出现错误。它引发以下错误： SCRIPT438: Object doesn't support property or method 'map' d3.v3.js, line 4351 character 7

function pie(data) {
      var values = data.map(function(d, i) {
        return +value.call(pie, d, i);
      });

谢谢，克里希纳.V

4

2 回答 2

2

map是 Javascript 的一个相对较新的补充，因此并未在所有浏览器中实现。此页面包含更多信息，以及不支持它的浏览器的实现。在您的代码中包含此页面上的代码应该可以解决问题。

于 2013-09-30T11:23:25.360 回答
0

Map 应该在 IE9 上运行，但我知道 D3 在 IE8 及以下版本中存在问题。也许您需要修改您的函数以不使用“map”或“foreach”javascript 方法。相反，请尝试使用 jQuery 的相同功能。

function pie(data) {
  var values = jQuery.map(data, function(d, i) {
    return +value.call(pie, d, i);
  });

你有更多信息在这里。

于 2016-02-12T14:46:15.200 回答