如何在不使用外来对象d3的情况下在svg上添加表?

时间:2016-06-24 06:06:35

标签: javascript d3.js

我正在使用以下表格

var table = svg.append("foreignObject")
.attr("y",0)
.attr("width", "100%")
.attr("height", "50%")
.append("xhtml:body")

table.append("table")

table.append('thead').append('tr')
  .selectAll('th')

  .data(scope.columns).enter()
  .append('th')
  .attr('class', function(d) {
    return d.cl;
  })
  .text(function(d) {
    return d.head;
  });

// append body rows
table.append('tbody')
  .selectAll('tr')
  .data(scope.movies).enter()
  .append('tr')
  .selectAll('td')
  .data(function(row, i) {
    // evaluate column objects against the current row
    return scope.columns.map(function(c) {
      var cell = {};
      d3.keys(c).forEach(function(k) {
        cell[k] = typeof c[k] == 'function' ? c[k](row, i) : c[k];
      });
      return cell;
    });
  }).enter()
  .append('td')
  .html(function(d) {
    return d.html;
  })
  .attr('class', function(d) {
    return d.cl;
  });  

这在Chrome和Firefox中完美运行。在IE11中无法显示表

正如我所见,foreignObject并不适用于IE。如何不使用foreignObject?

感谢任何帮助。 (ps:我希望你不要介意我的英语,这太糟糕了。)

0 个答案:

没有答案