极客观点
研发管理
HarmonyOS
最近在用vue开发一个练习的页面，其中一个页面想用d3做一些图表。
但是，发现无从下手，
在.vue文件里，操作DOM是this.$refs.name;获取到DOM，然后进行操作
而d3，是使用d3.select('p').append('svg')...这样获取到DOM元素，然后操作。
那么，要怎样在vue中使用d3呢？有人试过吗？
如何在vue中使用d3.js
阅读 27.8k
在 react 里用过 d3-shape，用 d3-shape 的 arc、symbol 等获取 path 的 d 数据，然后绑定到 SVG 中 path 的 d 属性上。
vue 里加图表的情况估计可以采用类似方法吧。
新手上路，请多包涵
我倒是没用d3插件，用的是原生获取dom节点，用svg原生语法创建节点，插入节点，倒也能实现，后边就犯难了！我页面手动创建的一个节点绑定了10个text标签，想用d3动态的展示数据！不知道如何下手！
撰写回答
你尚未登录，登录后可以
- 和开发者交流问题的细节
- 关注并接收问题和回答的更新提醒
- 参与内容的编辑和改进，让解决方法与时俱进
被 1 篇内容引用
推荐问题
不同页面之间可以通过localstorage保存响应式吗？
A页面选择一些选项，B页面上有一个下拉框，下拉框的内容和A页面上选中的内容同步，这该怎么做？这可以通过vue的响应式来实现吗？6 回答2.8k 阅读✓ 已解决
网站的不同域名互相跳转如何保持登录态？
一个网站部署了多个域名（不是子域名），比如：www.abc.com和www.aaa.com,如何从一个域名跳转到另一个域名的时候，仍然保持登录态呢？6 回答2.2k 阅读
Vue项目一个报错无法找到原因?
排查了好久实在没有找到哪儿出了问题，时不时弹出来，编译结果又是正常的，尝试排查了好久但是一直没有办法排查出来，有遇到过这种报错的同学吗？或者有没有同学提供一种排查思路，因为我真的搞懵逼了。哈哈哈。5 回答6.2k 阅读✓ 已解决
相同的HTML代码，用v-html与直接写在模板中染相表现差异巨大，如何规避？
可以通过下面的链接查看问题，template里面的html与v-html是一样的代码，但是表现差异巨大DEMO2 回答1.9k 阅读✓ 已解决
vite项目如何导入.pem公钥更规范？
vue3+vite的前端项目，需要使用公钥加密提交的参数，目前.pem文件存放在publicDir，通过fetch()读取.pem的值，感觉有点怪怪的。请问有没有更好的导入方式。2 回答1.4k 阅读✓ 已解决
使用vue-pdf本地浏览器使用chrome移动机型可以正常预览，但是到了线上就无法正常预览了?
线上打开pdf：pdf文件请求返回<html><body><!-- no enabled plugin supports this MIME type --></body></html>预览效果如下:而本地效果如下:pdf文件返回正常:使用的chrome的模拟机型均为iphoneX，请问有大佬遇到过这种问题吗4 回答2.6k 阅读
移动端切换路由后返回，视频启动播放会严重滞后，好怪？
路由a和路由b，其中路由a有一个视频。● 从路由a进入路由b，再返回路由a，调用视频play方法，视频会缓冲状态一会，才会播放。● 从路由a进入路由b，刷新b路由，再返回路由a，调用视频play方法，视频会立即播放。● 在b路由中刷新，调用视频play方法，视频会立即播放。2 回答1k 阅读✓ 已解决
宣传栏
这里有两个例子，应该可以帮到你。他们分别从不同的方向着手，来解决这个问题。
vue作为主导：
Composing D3 Visualizations With Vue.js
https://tyronetudehope.com/20...
文章中直接搜索关键字：VueLineChart.vue ，可以直达vue + d3 的部分。
作者也有给出源码。
d3作为主导：
D3 with Vue's Reactivity
https://jsfiddle.net/chrisvfr...
另外还有人写了个插件： https://github.com/jaredreich...
由于我自己没有vue + d3的经验，所以上面这些都是google回来的。关键词是 vue with d3 。
如果或者觉得还需要进一步的了解，可能要修改或者增加其他关键词。希望对你有帮助吧。