Я пытаюсь создать веб-приложение, которое имеет истинные возможности мультитач. Например, я хочу иметь возможность перетаскивать контейнер по экрану и одновременно масштабировать / панорамировать карту Google. Проблема, с которой я столкнулся, заключается в том, что если я касаюсь чего-то еще на странице (не на карте), а затем я касаюсь карты другим пальцем, карта действует так, как если бы оба пальца касались карты. Это приводит к попытке панорамирования на карте Google, когда один палец превращается в увеличение / уменьшение карты, потому что я касаюсь где-то еще на странице.
Я использую Hammer.js для других событий мультитач на этой странице. Я попытался поместить наложение поверх карты и вручную вызвать API-функции Google Maps для перемещения карты, что сработало хорошо, но есть много функций карты, которые мне не хватало бы, если бы я использовал наложение и вручную перемещал и масштабирования.
Я знаю, что существует список всех различных событий касания, которые происходят на веб-странице, но я не уверен, как реализовать этот список для решения этой проблемы, если это вообще возможно.
РЕДАКТИРОВАТЬ: Для получения дополнительной информации, вы можете воссоздать мою проблему, перейдя к документации Google Maps. https://developers.google.com/maps/documentation/javascript/examples/map-simple
Если вы работаете на устройстве с сенсорным экраном, коснитесь карты, чтобы начать панорамирование, как обычно, затем коснитесь некоторого пробела на странице другим пальцем. Если вы удалите палец, который был на карте, вы все равно можете контролировать положение пальцем, который его даже не касается.
Кто-то спросил код для справки, это так же близко, как я нашел, где была проблема. Это выдает «не правильно», если я сначала коснусь карты одним пальцем, а затем выключу карту другим, но я не уверен, куда идти дальше. Кроме того, он не распечатывается, если сначала я коснусь вне карты, а затем на карте.
this.map.addListener('mousedown', function(e) {
if(e.va.target.className == 'company-header') {
console.log('not correct')
}
});