天地图销毁（方案）

阿兵呐

于 2024-03-11 14:01:43 发布

阅读量437

点赞数 4

分类专栏： vue 地图大屏展示可视化文章标签：前端 javascript vue.js

本文链接：https://blog.csdn.net/weixin_46115723/article/details/136300059

版权

vue 同时被 3 个专栏收录

11 篇文章 0 订阅

订阅专栏

大屏展示可视化

4 篇文章 0 订阅

订阅专栏

地图

3 篇文章 0 订阅

订阅专栏

本文描述了在官方未提供API的情况下，如何销毁并重新创建天地图，包括删除原有节点、替换为新的空白节点的过程。

摘要由CSDN通过智能技术生成

官方未提供API，且发现天地图使用的并非Canvas，索性直接将节点删掉后重新创建一个空白的节点

<div id="mainMap" ref="mainMap">
  <div id="chartMap" ref="chartMap"></div>
</div>

// 销毁天地图
const destructionTMap = () => {
  if (TMap.value) {
    TMap.value = null;
    // 直接将节点给删掉
    const parentEl = document.getElementById('mainMap');
    const cahildrenEl = document.getElementById('chartMap');
    if(cahildrenEl) parentEl.removeChild(cahildrenEl);
    // 然后再手动将节点加进来
    const newCahildrenEl = document.createElement("div");
    newCahildrenEl.id = 'chartMap'
    newCahildrenEl.style = 'height: 100%;width: 100%;'
    parentEl.appendChild(newCahildrenEl)
  }
}