可否用d3中的.html()去直接写一个defs之类的

[ckinmind]

经过测试可以

const defs = svgElems.append("defs")
const filter = defs.append("filter")
      .attr("id", "drop-shadow")
      .attr("height", "130%")



    filter.append("feGaussianBlur")
      .attr("in", "SourceAlpha")
      .attr("stdDeviation", 4)
      .attr("result", "blur")
    filter.append("feOffset")
      .attr("in", "blur")
      .attr("dx", 2)
      .attr("dy", 2)
      .attr("result", "offsetBlur")
    filter.append("feFlood")
      .attr("in", "offsetBlur")
      .attr("flood-color", "#3d3d3d")
      .attr("flood-opacity", "0.5")
      .attr("result", "offsetColor")
    filter.append("feComposite")
      .attr("in", "offsetColor")
      .attr("in2", "offsetBlur")
      .attr("operator", "in")
      .attr("result", "offsetBlur")

    const feMerge = filter.append("feMerge")

    feMerge.append("feMergeNode")
      .attr("in", "offsetBlur")
    feMerge.append("feMergeNode")
      .attr("in", "SourceGraphic")

/******   以上这段代码可以写成   ****** /

svgElems.append('defs')
      .html(`<filter id="drop-shadow">
<feGaussianBlur in="SourceAlpha" stdDeviation="4" result="blur"></feGaussianBlur>
<feOffset in="blur" dx="2" dy="2" result="offsetBlur"></feOffset><feFlood in="offsetBlur" flood-color="#3d3d3d" flood-opacity="0.5" result="offsetColor"></feFlood>
<feComposite in="offsetColor" in2="offsetBlur" operator="in" result="offsetBlur"></feComposite><feMerge><feMergeNode in="offsetBlur"></feMergeNode><feMergeNode in="SourceGraphic"></feMergeNode></feMerge></filter>`)

经过测试这两种方式等价，但是明显下面这种方式看起来方便很多