首页 / 浏览问题 / 三维GIS / 问题详情
webgl鼠标惯性操作
222EXP 2023年05月12日

当我点击弹窗弹出地图之后cesium 鼠标惯性消失了,原因是我初始化地图上已经操作过地图,我想知道是否有办法将鼠标惯性事件继续保留在后续的地图操作上。
我自己写了一个测试的例子在下面,麻烦知道的大佬帮忙解决一下。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>测试多视口下cesium是否卡顿</title>
  <script src="../lib/supermap/Cesium.js"></script>
  <link  href="../lib/supermap/Widgets/widgets.css" rel="stylesheet">
<body>
<div onclick="openMap()">打开三视口</div>
<div id="viewer"></div>
<div id="map" style="display: none"  >
</div>
<script>
  function createBlankViewer(viewerElement,options) {
    const defaultOptions = {
      geocoder: false, // 位置查找工具
      homeButton: false, // 视角返回初始位置
      sceneModePicker: false, // 选择视角的模式(球体、平铺、斜视平铺)
      navigationHelpButton: false, // 导航帮助(手势,鼠标)
      baseLayerPicker: false,
      infoBox: false,
      animation: false,
      fullscreenButton: false,
      timeline: false,
      // 注销掉默认的图层
      // imageryProvider: new SingleTileImageryProvider({
      //   url: process.env.BASE_URL + 'lib/cesium/map_bg.jpg',
      // }),
      //resolutionScale:1,
      contextOptions: {
        //webgl截屏设置
        webgl: {
          alpha: true,
          depth: true,
          stencil: true,
          antialias: true,
          premultipliedAlpha: true,
          //通过canvas.toDataURL()实现截图需要将该项设置为true
          preserveDrawingBuffer: true,
          failIfMajorPerformanceCaveat: true,
        },
      },
      navigation:false,
    };

    const option =
      typeof options === 'object'
        ? { ...defaultOptions, ...options }
        : defaultOptions;
    const viewer = new Cesium.Viewer(viewerElement, option);
    // @ts-expect-error 调整内部属性。
    // viewer._cesiumWidget._creditContainer.style.display = 'none';

    //关闭掉太阳月亮
    // viewer.scene.sun.show = false;
    // viewer.scene.moon.show = false;

    //关闭天空盒子
    //viewer.scene.skyBox.show = false
    // viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK);
    // viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK);
    return viewer;
  }

  function openMap(){
    document.getElementById("map").style= "display:block"
  }

  /**
   * 操作:复现bug 1. 先转动地球 2.点击打开三视口
   *
   * 测试结果,当第一个地图操作过之后惯性事件就会被占用,在操作其他地图惯性事件就会丢失掉了,所以不是代码原因的卡顿,而是超图固有的bug
   */
  window.onload = function(){

    let viewer = createBlankViewer(document.getElementById("viewer"));

    let map = new Cesium.Viewer(document.getElementById("map"));
    map.scene.debugShowFramesPerSecond = false;
    map.scene.hdrEnabled = false;
    map.scene.sun.show = true;
    map.scene.multiViewportMode = 4;

  }


</script>

<style>
  #viewer{
    width: 100vw;
    height: 100vh;

  }
  #map{
    top: 0px;
    position: fixed;
    width: 100vw;
    height: 100vh;
    z-index: 200;
  }
</style>
</body>

</html>

1个回答

您好,本地测试弹出三个视口后,鼠标并未消失。

题中所说的鼠标消失是指?

1,865EXP 2023年05月12日
是鼠标惯性消失了,显得卡卡的,
正常情况:第一次打开页面不操作,然后直接点击打开三视口
异常情况:第一次打开页面先操作地图缩放,然后在点击打开三视口,鼠标惯性消失了
我这边按您说的异常情况测试了,并未出现‘鼠标惯性消失’的情况。

您可以添加鼠标点击事件,打印鼠标位置,看是否有正常输出;或者换一台设备测试看看是否出现相同问题。
这个差异很小,你对比这看就会发现了
测试了示例,在第一个地图窗口旋转地球后,再打开多视口,再旋转地球,地图惯性事件消失。该问题已上报缺陷,后续问题修复再联系您。
您好,多视口地球惯性事件消失问题新版本已修复,私信发您下载地址。
...