2016-02-23 3 views
0

Я использую geoxml3 с локальной машины для загрузки kml. Однако центр просмотра по умолчанию меняется после загрузки kml. Я попытался добавить строку «preserveViewport: true», но все-таки я получу полный просмотр kml после загрузки. любое предложение прекратить это.KML переопределение представления по умолчанию после загрузки

Вот мой код

<html> 
    <head> 
    <title>Google Map</title> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
    <meta charset="utf-8"> 
    <style> 
     html, body, #map { 
      margin: 0; 
      padding: 0; 
      height: 100%; 
       } 
    </style> 
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> 
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script> 
<script type="text/javascript" src="geoxml3-master/polys/geoxml3.js"></script> 
<script type="text/javascript" src="geoxml3-master/ProjectedOverlay.js"></script> 

    <script> 
var myCenter=new google.maps.LatLng(13.751768, 100.537606); 
var map; 
var marker; 
var mapProp; 
function initialize() 
{ 
    mapProp = { 
     center:myCenter, 
     zoom:17, 
     mapTypeId:google.maps.MapTypeId.ROADMAP 
    }; 

    map=new google.maps.Map(document.getElementById("map"),mapProp); 


      var parser = new geoXML3.parser({ 
         suppressInfoWindows: true, 
         map: map, 
         preserveViewport: true 
        }); 
      parser.parse('test.kml'); 

     } 
google.maps.event.addDomListener(window, 'load', initialize); 


    </script> 

    </head> 

<body> 
    <div style="height:100%; width:100%;"> 
     <div id="map"></div> 
    </div> 
</body> 

ответ

0

Для geoxml3, эквивалент preserveViewport является zoom. Установите для него значение true (по умолчанию) для автоматического масштабирования в соответствии с KML, установите для него значение false, чтобы отключить эту функцию.

var myCenter=new google.maps.LatLng(13.751768, 100.537606); 
var map; 
var marker; 
var mapProp; 
function initialize() { 
    mapProp = { 
    center:myCenter, 
    zoom:17, 
    mapTypeId:google.maps.MapTypeId.ROADMAP 
}; 

map=new google.maps.Map(document.getElementById("map"),mapProp); 
var parser = new geoXML3.parser({ 
     suppressInfoWindows: true, 
     map: map, 
     zoom: false 
    }); 
parser.parse('test.kml'); 
} 
google.maps.event.addDomListener(window, 'load', initialize); 

фрагмент кода:

var myCenter = new google.maps.LatLng(13.751768, 100.537606); 
 
var map; 
 
var marker; 
 
var mapProp; 
 

 
function initialize() { 
 
    mapProp = { 
 
    center: myCenter, 
 
    zoom: 5, 
 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
 
    }; 
 

 
    map = new google.maps.Map(document.getElementById("map"), mapProp); 
 
    var parser = new geoXML3.parser({ 
 
    suppressInfoWindows: true, 
 
    map: map, 
 
    zoom: false 
 
    }); 
 
    parser.parseKmlString(testKML); 
 
} 
 

 
google.maps.event.addDomListener(window, "load", initialize); 
 
var testKML = '<?xml version="1.0" encoding="UTF-8" ?><kml xmlns="http://www.opengis.net/kml/2.2"><Document><Style id="yellow_pin"><IconStyle><scale>1.1</scale><Icon><href>http://maps.google.com/mapfiles/kml/pushpin/ylw-pushpin.png</href></Icon><hotSpot x="20" y="2" xunits="pixels" yunits="pixels"/></IconStyle></Style><Style id="arrow_reverse"><IconStyle><scale>1.1</scale><Icon><href>http://maps.google.com/mapfiles/kml/shapes/arrow-reverse.png</href></Icon><hotSpot x="54" y="42" xunits="pixels" yunits="pixels"/></IconStyle></Style><Style id="marker_A"><IconStyle><scale>1.1</scale><Icon><href>http://maps.google.com/mapfiles/kml/paddle/A.png</href></Icon><hotSpot x="32" y="1" xunits="pixels" yunits="pixels"/></IconStyle></Style><Placemark><styleUrl>#yellow_pin</styleUrl><name><![CDATA[marker 1]]></name><description><![CDATA[description 1]]></description><Point><extrude>1</extrude><altitudeMode>relativeToGround</altitudeMode><coordinates>107.666015625,12.81152174509788,0</coordinates></Point></Placemark><Placemark><styleUrl>#arrow_reverse</styleUrl><name><![CDATA[marker 2]]></name><description><![CDATA[description 2]]></description><Point><extrude>1</extrude><altitudeMode>relativeToGround</altitudeMode><coordinates>100.0634765625,4.402391829093915,0</coordinates></Point></Placemark><Placemark><styleUrl>#marker_A</styleUrl><name><![CDATA[marker 3]]></name><description><![CDATA[description 3]]></description><Point><extrude>1</extrude><altitudeMode>relativeToGround</altitudeMode><coordinates>99.5361328125,11.64007838467894,0</coordinates></Point></Placemark><Placemark><name><![CDATA[marker 4]]></name><description><![CDATA[description 4]]></description><Point><extrude>1</extrude><altitudeMode>relativeToGround</altitudeMode><coordinates>105.556640625,38.65119833229951,0</coordinates></Point></Placemark><Placemark><name><![CDATA[marker 5]]></name><description><![CDATA[description 5]]></description><Point><extrude>1</extrude><altitudeMode>relativeToGround</altitudeMode><coordinates>-93.1201171875,42.032974332441405,0</coordinates></Point></Placemark></Document></kml>';
html, 
 
body, 
 
#map { 
 
    height: 100%; 
 
    width: 100%; 
 
    margin: 0px; 
 
    padding: 0px 
 
}
<script src="https://maps.googleapis.com/maps/api/js"></script> 
 
<script src="http://geoxml3.googlecode.com/svn/branches/polys/geoxml3.js"></script> 
 
<div id="map"></div>

+0

Это работало очень хорошо. Спасибо :) –