2

我正在尝试将 d3 图嵌入到车把模板中，但是当我嵌入车把的对象 registryhelper 时，返回 [object SVGSVGElement] 而不是 html。

带有车把注册表帮助器的 D3 图形

 Handlebars.registerHelper('list', function() {
 svg = d3.select('p').append("svg").attr("width",w).attr("height",h);
 var rect1 =svg.append("rect").attr("x",0).attr("y",3*h/4).
 attr("width",w).attr("height",rect_1_h).style("fill",rect_1_color);
 return svg;
 });

车把模板

{{#each objects}}
 <tr>
 <td><p>{{#list}}{{/list}}</p></td>
 </tr>
 {{/each}}
4

1 回答 1

3

Handlebars 正在显示对象的toString值svg。

使用html()方法获取 的 HTML 表示svg，见https://github.com/mbostock/d3/wiki/Selections#wiki-html

然后用于Handlebars.SafeString指示 Handlebars 不转义 HTML，如下所示：return new Handlebars.SafeString(svg.html())

但在此之前，请考虑您的示例中的一些问题：

  1. 您正在使用d3.select这意味着，从 DOM 中选择一个元素。然后你会直接影响 DOM 中的那个元素。不像“函数”那样工作，可能你想要做的是p在内存中创建元素。或者，也许您可​​以在不创建 Handlebars 助手的情况下解决使用 DOM 的问题。

  2. 一个小问题：添加var到 svg 或者您将使用全局。

于 2013-02-13T13:40:26.510 回答