javascript - 如何在 VUE 3 上使用 VivaGraphJS 在浏览器上显示图表?
问题描述
我正在尝试在主页视图中使用 VUE 3 在浏览器上显示图表。为此,我使用命令安装了 VivaGraphJS
npm i vivagraphjs
然后我从网站https://www.npmjs.com/package/vivagraphjs中获取了最小的示例,并尝试了几种方法将其包含在模板中,但没有成功。
<template>
<div id="graphDiv">{{graph()}}</div>
</template>
<script>
import * as Viva from '/node_modules/vivagraphjs/dist/vivagraph.js'
export default {
name: 'Home',
setup(){
const graph = () => {
let graph = Viva.Graph.graph()
graph.addLink(1, 2)
let renderer = Viva.Graph.View.renderer(graph, {
container: document.getElementById('graphDiv')
})
renderer.run()
}
return { graph }
}}
</script>
当我 console.log() 渲染器时,我可以在控制台中看到对象,所以我知道所有功能都在工作。但是浏览器中没有显示任何内容。
非常感谢
解决方案
推荐阅读
- javascript - 如何将 wavesurfer js 与新的 Laravel 项目集成
- javascript - 如何在 prestashop (1.7) 中创建 onclick ajax 函数并构建正确的 url 链接
- docker - Docker Swarm:节点恢复活动后重新应用服务的放置偏好
- apache - 从同一目录提供的 API 和静态 html
- c++ - 为什么在这种情况下编译器无法优化 vtable(静态关键字/单例模式)
- r - 如何将多个 2D R 图组合成一个 3D 图
- python - 如何使用 pyspark 随着时间的推移有效地实现 groupby 和后续滚动应用
- python-3.x - 如何在 python 中使用特定字符串删除 Power Point 幻灯片?
- html - 为什么这部分会在 Outlook Web 中出现空白?
- html - 如何在动态网页中使用@media 打印查询?我现在得到的只是一个空白页