zouyaoji / vue-cesium

🎉 Vue 3.x components for CesiumJS.
https://zouyaoji.top/vue-cesium
MIT License
1.49k stars 321 forks source link

[Bug Report] vue-cesium-v2同时启用arcgis地形+<vc-navigation>导航控件非常卡顿 #117

Open liuqun opened 3 years ago

liuqun commented 3 years ago

VueCesium version

2.2.5

OS/Browsers version

Windows10/Chrome最新版

Vue version

3.1.4

Reproduction Link

详见 测试代码

Steps to reproduce

测试发现同时启用arcgis-tiled-elevation地形 vc-navigation导航控件时会导致cesium非常卡顿。 测试代码 如下:

<template>
  <div class="viewer">
    <vc-viewer @ready="ready">
      <vc-layer-imagery>
        <vc-provider-imagery-bingmaps
          url="https://dev.virtualearth.net"
          bmKey="AgcbDCAOb9zMfquaT4Z-MdHX4AsHUNvs7xgdHefEA5myMHxZk87NTNgdLbG90IE-"
          mapStyle="Aerial"
        ></vc-provider-imagery-bingmaps>
      </vc-layer-imagery>
      <vc-provider-terrain-arcgis-tiled-elevation
        :url="'https://elevation3d.arcgis.com/arcgis/rest/services/WorldElevation3D/Terrain3D/ImageServer'"
      ></vc-provider-terrain-arcgis-tiled-elevation>
      <vc-navigation></vc-navigation>
    </vc-viewer>
  </div>
</template>

<script>
export default {
  data() {
    return {
      terrainUrl:
        "https://elevation3d.arcgis.com/arcgis/rest/services/WorldElevation3D/Terrain3D/ImageServer",
    }
  },
  methods: {
    ready(cesiumInstance) {
      const { Cesium, viewer } = cesiumInstance
      var target = new Cesium.Cartesian3(
        300770.50872389384,
        5634912.131394585,
        2978152.2865545116
      )
      var offset = new Cesium.Cartesian3(
        6344.974098678562,
        -793.3419798081741,
        2499.9508860763162
      )
      viewer.camera.lookAt(target, offset);
      viewer.camera.lookAtTransform(Cesium.Matrix4.IDENTITY)

      //调试信息:FPS帧数
      viewer.scene.debugShowFramesPerSecond = true
    },
  },
}
</script>

What is Expected?

平均帧率50fps左右,界面流畅顺滑

What is actually happening?

测试发现同时启用arcgis-tiled-elevation地形 vc-navigation导航控件时会导致cesium非常卡顿, 帧率下降到10fps以下

zouyaoji commented 3 years ago

我测了一下,这应该是在arcgis地形下,坐标拾取性能很低。

https://github.com/CesiumGS/cesium/issues/8481 官方已经有人提了,还没解决,我们保持跟进。 如果要用arcgis地形,建议组件先屏蔽鼠标信息。

<vc-navigation :otherOpts="false"></vc-navigation>

或者将 otherOpts.statusBarOpts.showMouseInfo赋值为false