You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by GitBox <gi...@apache.org> on 2021/10/28 02:02:29 UTC
[GitHub] [echarts] w840980261 opened a new issue #15967: treemap 在 vue3 中表现异常
w840980261 opened a new issue #15967:
URL: https://github.com/apache/echarts/issues/15967
### Version
5.1.1
### Reproduction link
[https://echarts.apache.org/examples/zh/editor.html?c=treemap-simple](https://echarts.apache.org/examples/zh/editor.html?c=treemap-simple)
### Steps to reproduce
用官方dom的基础矩形树作为option(如上链接)
### What is expected?
##### 1. setOption 后 treemap 恢复
##### 2. nodeClick:'zoomToNode' 是点击节点后缩放到节点
##### 3. roam:true 开启拖拽漫游（移动和缩放）
##### 4. resize 后重绘 treemap
### What is actually happening?
##### 1.第一次 setOption 后节点点击有效果，多次 setOption 生成的图无法点击也无法拖拽和缩放
##### 后面的问题都以一次 setOption 为前提
##### 2.点击节点后，图消失
##### 3.可以平移，但是滚动鼠标滚轮后，图消失
##### 4.触发 resize 后，图消失
<!-- This issue is generated by echarts-issue-helper. DO NOT REMOVE -->
<!-- This issue is in English. DO NOT REMOVE -->
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] susiwen8 closed issue #15967: treemap 在 vue3 中表现异常
Posted by GitBox <gi...@apache.org>.
susiwen8 closed issue #15967:
URL: https://github.com/apache/echarts/issues/15967
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] w840980261 commented on issue #15967: treemap 在 vue3 中表现异常
Posted by GitBox <gi...@apache.org>.
w840980261 commented on issue #15967:
URL: https://github.com/apache/echarts/issues/15967#issuecomment-956065023
```
<template>
<div ref="treemapDom" class="treemap"></div>
<button @click="clickReset">reset</button>
</template>
<script>
import * as echarts from 'echarts'
import { ref, onMounted } from 'vue'
export default {
setup() {
const treemapDom = ref()
const myChart = ref()
const drawMyChart = () => {
const option = {
series: [
{
type: 'treemap',
data: [
{
name: 'nodeA',
value: 10,
children: [
{
name: 'nodeAa',
value: 4,
},
{
name: 'nodeAb',
value: 6,
},
],
},
{
name: 'nodeB',
value: 20,
children: [
{
name: 'nodeBa',
value: 20,
children: [
{
name: 'nodeBa1',
value: 20,
},
],
},
],
},
],
},
],
}
myChart.value.setOption(option)
}
onMounted(() => {
myChart.value = echarts.init(treemapDom.value)
drawMyChart()
})
const clickReset = () => {
myChart.value.resize()
}
return {
treemapDom,
clickReset,
}
},
}
</script>
<style scoped>
.treemap {
width: 100%;
height: 600px;
}
</style>
```
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] susiwen8 closed issue #15967: treemap 在 vue3 中表现异常
Posted by GitBox <gi...@apache.org>.
susiwen8 closed issue #15967:
URL: https://github.com/apache/echarts/issues/15967
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] susiwen8 closed issue #15967: treemap 在 vue3 中表现异常
Posted by GitBox <gi...@apache.org>.
susiwen8 closed issue #15967:
URL: https://github.com/apache/echarts/issues/15967
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] echarts-bot[bot] commented on issue #15967: treemap 在 vue3 中表现异常
Posted by GitBox <gi...@apache.org>.
echarts-bot[bot] commented on issue #15967:
URL: https://github.com/apache/echarts/issues/15967#issuecomment-953439512
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] kongmoumou commented on issue #15967: treemap 在 vue3 中表现异常
Posted by GitBox <gi...@apache.org>.
kongmoumou commented on issue #15967:
URL: https://github.com/apache/echarts/issues/15967#issuecomment-957623225
```diff
import * as echarts from 'echarts'
-import { ref, onMounted } from 'vue'
+import { shallowRef, onMounted } from 'vue'
export default {
setup() {
const treemapDom = ref()
- const myChart = ref()
+ const myChart = shallowRef()
}
```
u should use `shallowRef`
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] kongmoumou commented on issue #15967: treemap 在 vue3 中表现异常
Posted by GitBox <gi...@apache.org>.
kongmoumou commented on issue #15967:
URL: https://github.com/apache/echarts/issues/15967#issuecomment-957623225
```diff
import * as echarts from 'echarts'
-import { ref, onMounted } from 'vue'
+import { shallowRef, onMounted } from 'vue'
export default {
setup() {
const treemapDom = ref()
- const myChart = ref()
+ const myChart = shallowRef()
}
```
u should use `shallowRef`
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] kongmoumou commented on issue #15967: treemap 在 vue3 中表现异常
Posted by GitBox <gi...@apache.org>.
kongmoumou commented on issue #15967:
URL: https://github.com/apache/echarts/issues/15967#issuecomment-957623225
```diff
import * as echarts from 'echarts'
-import { ref, onMounted } from 'vue'
+import { shallowRef, onMounted } from 'vue'
export default {
setup() {
const treemapDom = ref()
- const myChart = ref()
+ const myChart = shallowRef()
}
```
u should use `shallowRef`
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org