Question

大佬们，我用iframe嵌套官方的demo https://iclient.supermap.io/examples/openlayers/editor.html#turf_classificationAnalysis,在安卓手机浏览器中快读拖动地图后，地图莫名其妙全部错乱了，往上拖变放大，往下拖变缩小之类的。
不用iframe就不会有问题

Answer 1

您好，官网示例的编辑器和框架设计上主要考虑仅作为演示示例使用，

确实没有考量示例editor再嵌套至其它开发内容中。

和iframe有冲突的话，建议您可以尝试直接使用编辑器内本身的页面内容，

以确定您冲突的具体是editor.html还是turf_classificationAnalysis.html。

https://iclient.supermap.io/examples/openlayers/turf_classificationAnalysis.html

您可以下载完整版iserver，安装后启动的iserver是包括官网上iClient的这些示例内容的，

其中editor.html和turf_classificationAnalysis.html都是有的，您可以在您自己部署的iserver中修改代码，以实现您项目中的兼容使用。

希望可以帮助到您。

于丁

1

9,633EXP 2023年03月16日

感谢你的回答，我试着使用https://iclient.supermap.io/examples/openlayers/turf_classificationAnalysis.html 问题依然重现，

<!DOCTYPE html>

<head>

<title>Document</title>

</head>

<body>

width="100%" allowfullscreen height="100%"></iframe>

</div>

</body>

</html>

leif18

2EXP 2023年03月16日

我的项目需求是：我用H5做的一个地图功能页面，要用iframe嵌套在其他项目中，在安卓手机浏览上出现了以上问。
最初我怀疑是我的H5地图页面有问题，因此我试着用官网的一个地图页面用iframe嵌套，没想到问题依旧，所以我现在不知道问题出现在哪里

leif18

2EXP 2023年03月16日

你好，我这边用你的代码，在pc端火狐开发版浏览器的pc浏览模式下、安卓浏览模式下，红米K30自带浏览器，iPhone14pro自带浏览器下，

测试上拖下托等都是正常移动，双指开闭才会缩放，都是正常的。

我这边可能建议您从具体的系统、厂商、浏览器和开发框架的环节来定位您使用iframe时的异常情况。

您也可以尝试在iframe试试直接初始化使用iclient的代码而不是html的话是否正常，

如果正常你可以从iframe引用html的角度排查一下。

测试视频：

链接：https://pan.baidu.com/s/1TZxaSFDBq4H-re8Vj1hAHw?pwd=qzky
提取码：qzky
--来自百度网盘超级会员V5的分享

于丁

9,633EXP 2023年03月16日

你好，感谢您的回答，可能我没描述清楚，我用华为手机自带浏览器，小米手机自带浏览器，在地图上快速向下拖动地图就会重现问题

这问题的确困扰我们很久，非常希望能得到你们的指点，再次感谢！

leif18

2EXP 2023年03月16日

你好给你看下我拍的测试视频：百度网盘链接: https://pan.baidu.com/s/1pGdJ9Fi-X4oooTm5ONksCg 提取码: 2kmg

leif18

2EXP 2023年03月17日

按上面的方法具体定位下导致出现的环节或者原因呢，我这边没有复现您的使用情况。

于丁

9,633EXP 2023年03月17日

我这边只要是安卓手机就会复现，麻烦您有时间的话看看我拍的视频，指点一下我是哪里出问题了

leif18

2EXP 2023年03月17日

我这边已经看了您的视频，但是看了也没法猜到您代码过程中有什么问题，

只能给您测试排查思路，您这边根据您项目情况实际上手测测找到问题才好帮您解决。

于丁

9,633EXP 2023年03月17日

你好，代码就是官方的demo

<!DOCTYPE html>
<html lang="en">

<head>
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Document</title>
</head>

<body>
     <div style="width: 100%; height:100vh">
          <iframe src="https://iclient.supermap.io/examples/openlayers/turf_classificationAnalysis.html" frameborder="0"
               width="100%" allowfullscreen height="100%"></iframe>
     </div>
</body>

</html>

leif18

2EXP 2023年03月17日

您这边私聊下我您的电话联系方式。

于丁

9,633EXP 2023年03月17日

请登录或者注册后回答这个问题。

1个回答

请登录或者注册后再添加评论。

请 登录 或者 注册 后回答这个问题。

1个回答

请 登录 或者 注册 后再添加评论。

智能推荐

请登录或者注册后回答这个问题。

请登录或者注册后再添加评论。