首页 > 解决方案 > 点击手势在移动 android chrome 上不起作用

问题描述

我编写了一个简单的“添加 POI”-javascript 地图,但是如何让 Tap-gesture 在 Android 上工作?

HERE-api (JS) 上的点击手势不起作用(使用三星 S10 和 Chrome)。您可以点击十几次才能识别点击。即使使用以下示例也是一个问题: https ://developer.here.com/api-explorer/maps-js/maps/position-on-mouse-click

用鼠标一切正常。使用 Android,您必须多次点击。我的猜测是,如果您的手指在点击时进行了轻微的拖动移动,则会激活 Map Pan 而不是点击。

<html>
<head>
<link rel="stylesheet" type="text/css" href="https://js.api.here.com/v3/3.1/mapsjs-ui.css" />
<script src="https://js.api.here.com/v3/3.1/mapsjs-core.js" type="text/javascript" charset="utf-8"></script>
    <script src="https://js.api.here.com/v3/3.1/mapsjs-service.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript" src="https://js.api.here.com/v3/3.1/mapsjs-ui.js"></script>
    <script type="text/javascript" src="https://js.api.here.com/v3/3.1/mapsjs-mapevents.js"></script>
    <script type="text/javascript" src="https://js.api.here.com/v3/3.1/mapsjs-clustering.js"></script>
</head>
<body>

<div id="map"></div>

<script>

    var platform = new H.service.Platform({
        useCIT: true,
        app_id: 'foo',
        apikey: 'bar',
        useHTTPS: true
    });

    var defaultLayers = platform.createDefaultLayers();

    var map = new H.Map(
        document.getElementById('map'),
        defaultLayers.vector.normal.map,
        {
            zoom: 6,
            pixelRatio: window.devicePixelRatio || 1
        });


    map.addEventListener('tap', function (evt) {
        alert('tap'); // PROBLEM: only randomly works!
    });

    var behavior = new H.mapevents.Behavior(new H.mapevents.MapEvents(map));
    var ui = H.ui.UI.createDefault(map, defaultLayers);

</script>
</body>
</html>

不会引发错误,但点击不会弹出警报。

标签: javascriptandroidhere-api

解决方案


首先,尝试只传递apiKey而不是传递app_id给平台服务实例。那么请将您的浏览器更新到最新版本。有关包含tap事件的完整工作代码,请查看以下更新的代码: https ://developer.here.com/documentation/examples/maps-js/maps/position-on-mouse-click


推荐阅读