我需要一个带有一个指针和多个指针的平移。一个指针用于在 map 上绘制,多个指针用于拖动 map 。
创建自定义平移手势后,我无法触发 native 平移事件,例如 panstart
或 panend
。如何让两个自定义手势分别触发 native 事件。
这是我的 HTML 代码:
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' lang='en'>
<head>
<meta content='width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;' name='viewport' />
</head>
<body>
<div id="log" style="position:absolute;top:10px;left:10px;"> Hi</div>
<div id="mymap" style="width: 300px;height:400px;border:1px solid #c0c0c0; background-color:blue">
</div>
<script type="text/javascript" src="./js/build.js"></script>
</body>
</html>
这是我的 JavaScript 代码:
var Hammer = require('hammerjs');
var map = document.getElementById('mymap');
var mc = new Hammer.Manager(map);
var pan1p = new Hammer.Pan({
event: 'pan1p',
direction: Hammer.DIRECTION_ALL,
pointers: 1,
preventDefault: true});
var pan2p = new Hammer.Pan({
event: 'pan2p',
direction: Hammer.DIRECTION_ALL,
pointers: 2,
preventDefault: true});
pan2p.recognizeWith(pan1p);
pan1p.requireFailure(pan2p);
mc.add([pan1p, pan2p]);
mc.on('pan1p', function(ev) {
var log = document.getElementById('log');
log.innerHTML = 'pan1p: ' + JSON.stringify(ev);
});
mc.on('pan2p', function(ev) {
var log = document.getElementById('log');
log.innerHTML = 'pan2p: ' + JSON.stringify(ev);
});
mc.on('panstart', function(ev) {
var log = document.getElementById('log');
log.innerHTML = 'panstart: '+JSON.stringify(ev);
});
最佳答案
它必须是 pan1pstart
,因为原始事件 pan
已命名为 pan1p
mc.on('panstart', function(ev) {
var log = document.getElementById('log');
log.innerHTML = 'panstart: '+JSON.stringify(ev);
});
得到hammer.js repository的澄清
关于javascript - Hammer.js panstart 具有自定义平移手势,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33852163/