Svg中添加dom节点

Reason

相对于svg预定义的形状元素，dom元素可以直接使用css调整表现。因此在某些场景我们需要在svg中插入dom元素

Solution

首先插入foreignObject元素，然后再插入dom元素，例如：（这里使用d3js）

index.html

<svg></svg>
复制代码

index.js

import d3 from 'd3';
d3.select('svg')
.append('foreignObject')
.append('div')
复制代码

参考资料：stackoverflow.com/questions/1…

转载于:https://juejin.im/post/5c92d9f8f265da60f96f861e