【问题标题】:Typescript/d3, can't dynamically provide symbol typesTypescript/d3,不能动态提供符号类型
【发布时间】:2019-06-27 12:10:09
【问题描述】:

我正在尝试扩展网络可视化工具,使用户能够为网络中的节点设置自定义符号。尝试动态设置此形状时,出现错误:

Error: <path> attribute d: Expected moveto path command ('M' or 'm'), "function n(n,r){…".

在我看来,这不是给它一个函数返回的实际路径数据,而是传递函数本身。

我已经查看了 Setting d3 symbol conditionallyPassing a function to .attr('d')? 的类似问题的 javascript 代码。我还在https://github.com/abchakra/d3_work/blob/7b602690615790d38b00832750ead637c66e205d/gantt_ts/app/ts/lib/ganttChart.ts 的打字稿中尝试了类似的用例,但它似乎使用的是不同版本的打字稿? (在.attr("d", d =&gt; d3.symbol().size(2400).type(d.symbol)()); 行中没有为d 提供类型?)

我已经稍微简化了我正在尝试做的事情,以使问题更加明显。 直观地说,下面的代码应该将符号的类型分配给'circle',实际上,如果我只是将字符串粘贴到那里(.attr('d', d3.svg.symbol().type('circle'))),它就可以正常工作。但是,如果我尝试以任何方式传递 d 参数,则函数本身似乎是作为路径传递的,并且出现上述错误。

    var shape = function(d: any){
        return 'circle';
    }

    visualNodes = nodeLayer.selectAll('nodes')
        .data(nodes)
        .enter()
        .append('path')
        .attr('d', (d: any) => d3.svg.symbol().type(shape(d)))
        .attr('class', 'nodes')
        .style('fill', (n: dynamicgraph.Node) => getNodeColor(n))
         ...
        })

我希望能够使用 shape var 中的 d 参数来动态分配形状,我可能会以某种方式解决问题 - 但我想至少了解为什么 d3 是使用函数本身作为路径,以及为什么通过 d 进行更改。

【问题讨论】:

    标签: typescript d3.js


    【解决方案1】:

    .attr('d', (d: any) =&gt; d3.svg.symbol().type(shape(d))()) 给出了一个 TS2349 错误 - 所以我之前已将其关闭 - 但如果该错误被抑制,似乎可以正常工作。

    【讨论】:

      猜你喜欢
      • 2022-01-23
      • 2021-06-04
      • 2017-04-06
      • 2016-10-19
      • 1970-01-01
      • 2021-01-20
      • 2017-06-28
      • 1970-01-01
      • 2021-12-08
      相关资源
      最近更新 更多