如何启用捏放大? [英] How to enable pinch to zoom?

查看:236
本文介绍了如何启用捏放大?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我一直在使用PhoneGap的创建了一个简单的移动应用。
它包含一个HTML页面,它完美地打开我的手机在Android设备上,但捏变焦未启用。
我尝试添加几个库和元的名字,但它似乎并没有工作。

I have created a simple mobile app using Phonegap. It contains a single HTML page, it opens perfectly on my mobile Android device but the pinch to zoom is not enabled. I have tried to add several libraries and meta name but it doesn't seem to work.

中的HTML页面显示谷歌地图与标记。
下面是完整的code:

The HTML page displays a Google Map with markers. Here is the complete code:

<!DOCTYPE html>
<html>
  <head>
    <title>Simple Map</title>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <META HTTP-EQUIV="Refresh" CONTENT="420">
    <style type="text/css">
      html, body, #map-canvas {
        height: 100%;
        margin: 0px;
        padding: 0px
      }

       .labels {
     color: orange;
     background-color: black;
     font-family: "Lucida Grande", "Arial", sans-serif;
     font-size: 10px;
     font-weight: bold;
     text-align: center;
     width: 50px;     
     border: 2px solid black;
     white-space: nowrap;}
    </style>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="https://jquery-xml2json-plugin.googlecode.com/svn/trunk/jquery.xml2json.js" type="text/javascript" language="javascript"></script>
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
    <script src="http://google-maps-utility-library-v3.googlecode.com/svn/tags/markerwithlabel/1.0.1/src/markerwithlabel.js"></script>
    <script>
var markers = [];
var map = null;

  $.get('Customers.xml', function(xml) {
      var jsonObj = $.xml2json(xml);
        $.each(jsonObj.Marker, function(){
            var stat = this.site_status == "Critical" ? "http://maps.google.com/mapfiles/ms/micons/red-dot.png" : "http://maps.google.com/mapfiles/ms/micons/green-dot.png";
                 var mark = {
                        title: this.title,
                        location: this.site_location,
                        icon: stat
                        }
                markers.push(mark);
        });
        for(var i=0; i< markers.length; i++){
          var maddress = markers[i].location;
          var image = markers[i].icon;
          var custname = markers[i].title;
          geocodeAddress(maddress, image, custname,map); 
        } 
});     

function geocodeAddress(maddress, image, custname,map) {
  var geocoder = new google.maps.Geocoder();
  geocoder.geocode( { 'address': maddress}, function(results, status) { 
    if (status == google.maps.GeocoderStatus.OK) {   
      var myLatlng = new google.maps.LatLng(results[0].geometry.location.lat(),results[0].geometry.location.lng());
      var iconBase = 'https://maps.google.com/mapfiles/kml/shapes/';
      var marker = new MarkerWithLabel({
      position: myLatlng, map:map, icon: image,labelContent: custname,
       labelAnchor: new google.maps.Point(22, 0),
       labelClass: "labels", // the CSS class for the label
       labelStyle: {opacity: 0.75}});
    } else {
      alert("Geocode was not successful for the following reason: " + status);
    }
  });
}

function initialize() {
    var chicago = new google.maps.LatLng(35.442579,-40.895920);
    var mapOptions = {
        zoom: 4,
        center: chicago,
        mapTypeId: google.maps.MapTypeId.ROADMAP
  }

  map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
}
google.maps.event.addDomListener(window, 'load', initialize);
    </script>
  </head>
  <body>
     <div id="map-canvas"></div>
  </body>
</html>

我应该补充,以使捏放大?
先谢谢了。

What should I add in order to enable 'pinch to zoom' ? Thanks in advance.

推荐答案

有pintch放大,你必须创建一个点击和双击一个google.maps.event。您可以在您创建的标记或整个地图上附加此事件。告诉我,如果你需要一些例子,并要附加您的活动或搜索护目镜地图的事件是什么。有例子字面上百万在线。

to have pintch to zoom you have to create a google.maps.event with "click" or "doubleclick". you can attach this event on marker you created or on entire map. tell me if you need some example and to what you want to attach your event or search for goggle map events. there are literally 1000000 of examples online.

下面是谷歌地图的网站一个简单的例子:简单的单击事件谷歌地图

Here is a simple example from google map site: Simple click event in google map

这篇关于如何启用捏放大?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆