Question

我正在尝试将单选按钮添加到具有轴和形状的区域：

var triangleFunctions = ['Perpendicular Bisector', 'Median', 'Altitude'],
    selected = 0;

var form = svg.append('form');

var labelEnter = form.selectAll('span')
                     .data(triangleFunctions)
                     .enter().append('span');

labelEnter.append('input').attr({
  type: 'radio',
  class: 'shape',
  name: 'mode',
  value: function(d, i) {return i;}
});

labelEnter.append("label").text(function(d) {return d;});

您可以看到代码here的jsbin。

标签和输入未显示。

Answer 1

您可以使用foreignObject（但要注意它在IE中不起作用）：

var form = svg.append("foreignObject").attr("width", "400")
    .attr("height", "50").append("xhtml:body").append('form');

请注意，body标记是必需的，并且还必须包含xhtml:部分。

演示：http://jsbin.com/mafikorezo/edit?js,output

添加单选按钮和标签到d3.js

1 个答案: