vue3使用heatmap.js绘制热力图报错？-灵析社区

import { ref, reactive, onMounted } from "vue" import h337 from "heatmapjs" onMounted(() => { console.log("onMounted") heatMapInit() console.log(heat.value) }) const heat = ref(null) const heatmap = ref() // 初始化 heat map const heatMapInit = () => { let heatmapInstance = h337.create({ container: heat.value }) var points = [] var max = 0 var width = 840 var height = 400 var len = 200 while (len--) { var val = Math.floor(Math.random() * 100) max = Math.max(max, val) var point = { x: Math.floor(Math.random() * width), y: Math.floor(Math.random() * height), value: val } points.push(point) } // heatmap data format var data = { max: max, data: points } // if you have a set of datapoints always use setData instead of addData // for data initialization heatmapInstance.addData(data) } 使用报错： heatmap.min.js:9 Uncaught (in promise) TypeError: Cannot assign to read only property 'data' of object '#' at d2._colorize (heatmap.min.js:9:6235) at d2.renderPartial (heatmap.min.js:9:4158) at heatmap.min.js:9:6929 at a2.emit (heatmap.min.js:9:7041) at d2.addData (heatmap.min.js:9:1681) at g2.addData (heatmap.min.js:9:7804) at heatMapInit (heatmap.vue:44:1) at heatmap.vue:13:1 at runtime-core.esm-bundler.js:2675:88 at callWithErrorHandling (runtime-core.esm-bundler.js:158:18)