1. Accueil
  2. Question et réponse
  3. comment utiliser le fichier kml dans mon code

comment utiliser le fichier kml dans mon code

2010-03-20 15 views
0

télécharger un fichier kml:comment utiliser le fichier kml dans mon code

<?xml version="1.0" encoding="UTF-8"?> 
<kml xmlns="http://www.opengis.net/kml/2.2"> 
    <Document> 
    <Style id="transGreenPoly"> 
     <LineStyle> 
     <width>1.5</width> 
     </LineStyle> 
     <PolyStyle> 
     <color>7d00ff00</color> 
     </PolyStyle> 
    </Style> 
    <Style id="transYellowPoly"> 
     <LineStyle> 
     <width>1.5</width> 
     </LineStyle> 
     <PolyStyle> 
     <color>7d00ffff</color> 
     </PolyStyle> 
    </Style> 
    <Style id="transRedPoly"> 
     <LineStyle> 
     <width>1.5</width> 
     </LineStyle> 
     <PolyStyle> 
     <color>7d0000ff</color> 
     </PolyStyle> 
    </Style> 
    <Style id="transBluePoly"> 
     <LineStyle> 
     <width>1.5</width> 
     </LineStyle> 
     <PolyStyle> 
     <color>7dff0000</color> 
     </PolyStyle> 
    </Style> 
    <Folder> 
     <name>Placemarks</name> 
     <open>0</open> 
     <Placemark> 
     <name>Simple placemark</name> 
     <description>Attached to the ground. Intelligently places itself at the height of the 
      underlying terrain.</description> 
     <Point> 
      <coordinates>-122.0822035425683,37.42228990140251,0</coordinates> 
     </Point> 
     </Placemark> 
     <Placemark> 
     <name>Descriptive HTML</name> 
     <description><![CDATA[Click on the blue link!<br/><br/> 
Placemark descriptions can be enriched by using many standard HTML tags.<br/> 
For example: 
<hr/> 
Styles:<br/> 
<i>Italics</i>, 
<b>Bold</b>, 
<u>Underlined</u>, 
<s>Strike Out</s>, 
subscript<sub>subscript</sub>, 
superscript<sup>superscript</sup>, 
<big>Big</big>, 
<small>Small</small>, 
<tt>Typewriter</tt>, 
<em>Emphasized</em>, 
<strong>Strong</strong>, 
<code>Code</code> 
<hr/> 
Fonts:<br/> 
<font color="red">red by name</font>, 
<font color="#408010">leaf green by hexadecimal RGB</font> 
<br/> 
<font size=1>size 1</font>, 
<font size=2>size 2</font>, 
<font size=3>size 3</font>, 
<font size=4>size 4</font>, 
<font size=5>size 5</font>, 
<font size=6>size 6</font>, 
<font size=7>size 7</font> 
<br/> 
<font face=times>Times</font>, 
<font face=verdana>Verdana</font>, 
<font face=arial>Arial</font><br/> 
<hr/> 
Links: 
<br/> 
<a href="http://earth.google.com/">Google Earth!</a> 
<br/> 
or: Check out our website at www.google.com 
<hr/> 
Alignment:<br/> 
<p align=left>left</p> 
<p align=center>center</p> 
<p align=right>right</p> 
<hr/> 
Ordered Lists:<br/> 
<ol><li>First</li><li>Second</li><li>Third</li></ol> 
<ol type="a"><li>First</li><li>Second</li><li>Third</li></ol> 
<ol type="A"><li>First</li><li>Second</li><li>Third</li></ol> 
<hr/> 
Unordered Lists:<br/> 
<ul><li>A</li><li>B</li><li>C</li></ul> 
<ul type="circle"><li>A</li><li>B</li><li>C</li></ul> 
<ul type="square"><li>A</li><li>B</li><li>C</li></ul> 
<hr/> 
Definitions:<br/> 
<dl> 
<dt>Google:</dt><dd>The best thing since sliced bread</dd> 
</dl> 
<hr/> 
Centered:<br/><center> 
Time present and time past<br/> 
Are both perhaps present in time future,<br/> 
And time future contained in time past.<br/> 
If all time is eternally present<br/> 
All time is unredeemable.<br/> 
</center> 
<hr/> 
Block Quote: 
<br/> 
<blockquote> 
We shall not cease from exploration<br/> 
And the end of all our exploring<br/> 
Will be to arrive where we started<br/> 
And know the place for the first time.<br/> 
<i>-- T.S. Eliot</i> 
</blockquote> 
<br/> 
<hr/> 
Headings:<br/> 
<h1>Header 1</h1> 
<h2>Header 2</h2> 
<h3>Header 3</h3> 
<h3>Header 4</h4> 
<h3>Header 5</h5> 
<hr/> 
Images:<br/> 
<i>Remote image</i><br/> 
<img src="http://code.google.com/apis/kml/documentation/googleSample.png"><br/> 
<i>Scaled image</i><br/> 
<img src="http://code.google.com/apis/kml/documentation/googleSample.png" width=100><br/> 
<hr/> 
Simple Tables:<br/> 
<table border="1" padding="1"> 
<tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr> 
<tr><td>a</td><td>b</td><td>c</td><td>d</td><td>e</td></tr> 
</table> 
<br/>]]></description> 
     <Point> 
      <coordinates>-122,37,0</coordinates> 
     </Point> 
     </Placemark> 
    </Folder> 
    <Folder> 
     <name>Google Campus - Polygons</name> 
     <open>0</open> 
     <description>A collection showing how easy it is to create 3-dimensional buildings</description> 
     <Placemark> 
     <name>Building 40</name> 
     <styleUrl>#transRedPoly</styleUrl> 
     <Polygon> 
      <extrude>1</extrude> 
      <altitudeMode>relativeToGround</altitudeMode> 
      <outerBoundaryIs> 
      <LinearRing> 
       <coordinates> -122.0848938459612,37.42257124044786,17 
       -122.0849580979198,37.42211922626856,17 -122.0847469573047,37.42207183952619,17 
       -122.0845725380962,37.42209006729676,17 -122.0845954886723,37.42215932700895,17 
       -122.0838521118269,37.42227278564371,17 -122.083792243335,37.42203539112084,17 
       -122.0835076656616,37.42209006957106,17 -122.0834709464152,37.42200987395161,17 
       -122.0831221085748,37.4221046494946,17 -122.0829247374572,37.42226503990386,17 
       -122.0829339169385,37.42231242843094,17 -122.0833837359737,37.42225046087618,17 
       -122.0833607854248,37.42234159228745,17 -122.0834204551642,37.42237075460644,17 
       -122.083659133885,37.42251292011001,17 -122.0839758438952,37.42265873093781,17 
       -122.0842374743331,37.42265143972521,17 -122.0845036949503,37.4226514386435,17 
       -122.0848020460801,37.42261133916315,17 -122.0847882750515,37.42256395055121,17 
       -122.0848938459612,37.42257124044786,17 </coordinates> 
      </LinearRing> 
      </outerBoundaryIs> 
     </Polygon> 
     </Placemark> 
     <Placemark> 
     <name>Building 41</name> 
     <styleUrl>#transBluePoly</styleUrl> 
     <Polygon> 
      <extrude>1</extrude> 
      <altitudeMode>relativeToGround</altitudeMode> 
      <outerBoundaryIs> 
      <LinearRing> 
       <coordinates> -122.0857412771483,37.42227033155257,17 
       -122.0858169768481,37.42231408832346,17 -122.085852582875,37.42230337469744,17 
       -122.0858799945639,37.42225686138789,17 -122.0858860101409,37.4222311076138,17 
       -122.0858069157288,37.42220250173855,17 -122.0858379542653,37.42214027058678,17 
       -122.0856732640519,37.42208690214408,17 -122.0856022926407,37.42214885429042,17 
       -122.0855902778436,37.422128290487,17 -122.0855841672237,37.42208171967246,17 
       -122.0854852065741,37.42210455874995,17 -122.0855067264352,37.42214267949824,17 
       -122.0854430712915,37.42212783846172,17 -122.0850990714904,37.42251282407603,17 
       -122.0856769818632,37.42281815323651,17 -122.0860162273783,37.42244918858723,17 
       -122.0857260327004,37.42229239604253,17 -122.0857412771483,37.42227033155257,17 
       </coordinates> 
      </LinearRing> 
      </outerBoundaryIs> 
     </Polygon> 
     </Placemark> 
     <Placemark> 
     <name>Building 42</name> 
     <styleUrl>#transGreenPoly</styleUrl> 
     <Polygon> 
      <extrude>1</extrude> 
      <altitudeMode>relativeToGround</altitudeMode> 
      <outerBoundaryIs> 
      <LinearRing> 
       <coordinates> -122.0857862287242,37.42136208886969,25 
       -122.0857312990603,37.42136935989481,25 -122.0857312992918,37.42140934910903,25 
       -122.0856077073679,37.42138390166565,25 -122.0855802426516,37.42137299550869,25 
       -122.0852186221971,37.42137299504316,25 -122.0852277765639,37.42161656508265,25 
       -122.0852598189347,37.42160565894403,25 -122.0852598185499,37.42168200156,25 
       -122.0852369311478,37.42170017860346,25 -122.0852643957828,37.42176197982575,25 
       -122.0853239032746,37.42176198013907,25 -122.0853559454324,37.421852864452,25 
       -122.0854108752463,37.42188921823734,25 -122.0854795379357,37.42189285337048,25 
       -122.0855436229819,37.42188921797546,25 -122.0856260178042,37.42186013499926,25 
       -122.085937287963,37.42186013453605,25 -122.0859428718666,37.42160898590042,25 
       -122.0859655469861,37.42157992759144,25 -122.0858640462341,37.42147115002957,25 
       -122.0858548911215,37.42140571326184,25 -122.0858091162768,37.4214057134039,25 
       -122.0857862287242,37.42136208886969,25 </coordinates> 
      </LinearRing> 
      </outerBoundaryIs> 
     </Polygon> 
     </Placemark> 
     <Placemark> 
     <name>Building 43</name> 
     <styleUrl>#transYellowPoly</styleUrl> 
     <Polygon> 
      <extrude>1</extrude> 
      <altitudeMode>relativeToGround</altitudeMode> 
      <outerBoundaryIs> 
      <LinearRing> 
       <coordinates> -122.0844371128284,37.42177253003091,19 
       -122.0845118855746,37.42191111542896,19 -122.0850470999805,37.42178755121535,19 
       -122.0850719913391,37.42143663023161,19 -122.084916406232,37.42137237822116,19 
       -122.0842193868167,37.42137237801626,19 -122.08421938659,37.42147617161496,19 
       -122.0838086419991,37.4214613409357,19 -122.0837899728564,37.42131306410796,19 
       -122.0832796534698,37.42129328840593,19 -122.0832609819207,37.42139213944298,19 
       -122.0829373621737,37.42137236399876,19 -122.0829062425667,37.42151569778871,19 
       -122.0828502269665,37.42176282576465,19 -122.0829435788635,37.42176776969635,19 
       -122.083217411188,37.42179248552686,19 -122.0835970430103,37.4217480074456,19 
       -122.0839455556771,37.42169364237603,19 -122.0840077894637,37.42176283815853,19 
       -122.084113587521,37.42174801104392,19 -122.0840762473784,37.42171341292375,19 
       -122.0841447047739,37.42167881534569,19 -122.084144704223,37.42181720660197,19 
       -122.0842503333074,37.4218170700446,19 -122.0844371128284,37.42177253003091,19 
       </coordinates> 
      </LinearRing> 
      </outerBoundaryIs> 
     </Polygon> 
     </Placemark> 
    </Folder> 
    <Folder> 
     <name>LineString</name> 
     <open>0</open> 
     <Placemark> 
     <LineString> 
      <tessellate>1</tessellate> 
      <coordinates> -112.0814237830345,36.10677870477137,0 -112.0870267752693,36.0905099328766,0 
      </coordinates> 
     </LineString> 
     </Placemark> 
    </Folder> 
    <Folder> 
     <name>GroundOverlay</name> 
     <open>0</open> 
     <GroundOverlay> 
     <name>Large-scale overlay on terrain</name> 
     <description>Overlay shows Mount Etna erupting on July 13th, 2001.</description> 
     <Icon> 
      <href>http://code.google.com/apis/kml/documentation/etna.jpg</href> 
     </Icon> 
     <LatLonBox> 
      <north>37.91904192681665</north> 
      <south>37.46543388598137</south> 
      <east>15.35832653742206</east> 
      <west>14.60128369746704</west> 
     </LatLonBox> 
     </GroundOverlay> 
    </Folder> 
    <Folder> 
     <name>ScreenOverlays</name> 
     <open>0</open> 
     <ScreenOverlay> 
     <name>screenoverlay_dynamic_top</name> 
     <visibility>0</visibility> 
     <Icon> 
      <href>http://code.google.com/apis/kml/documentation/dynamic_screenoverlay.jpg</href> 
     </Icon> 
     <overlayXY x="0" y="1" xunits="fraction" yunits="fraction"/> 
     <screenXY x="0" y="1" xunits="fraction" yunits="fraction"/> 
     <rotationXY x="0" y="0" xunits="fraction" yunits="fraction"/> 
     <size x="1" y="0.2" xunits="fraction" yunits="fraction"/> 
     </ScreenOverlay> 
     <ScreenOverlay> 
     <name>screenoverlay_dynamic_right</name> 
     <visibility>0</visibility> 
     <Icon> 
      <href>http://code.google.com/apis/kml/documentation/dynamic_right.jpg</href> 
     </Icon> 
     <overlayXY x="1" y="1" xunits="fraction" yunits="fraction"/> 
     <screenXY x="1" y="1" xunits="fraction" yunits="fraction"/> 
     <rotationXY x="0" y="0" xunits="fraction" yunits="fraction"/> 
     <size x="0" y="1" xunits="fraction" yunits="fraction"/> 
     </ScreenOverlay> 
     <ScreenOverlay> 
     <name>Simple crosshairs</name> 
     <visibility>0</visibility> 
     <description>This screen overlay uses fractional positioning to put the image in the exact 
      center of the screen</description> 
     <Icon> 
      <href>http://code.google.com/apis/kml/documentation/crosshairs.png</href> 
     </Icon> 
     <overlayXY x="0.5" y="0.5" xunits="fraction" yunits="fraction"/> 
     <screenXY x="0.5" y="0.5" xunits="fraction" yunits="fraction"/> 
     <rotationXY x="0.5" y="0.5" xunits="fraction" yunits="fraction"/> 
     <size x="0" y="0" xunits="pixels" yunits="pixels"/> 
     </ScreenOverlay> 
     <ScreenOverlay> 
     <name>screenoverlay_absolute_topright</name> 
     <visibility>0</visibility> 
     <Icon> 
      <href>http://code.google.com/apis/kml/documentation/top_right.jpg</href> 
     </Icon> 
     <overlayXY x="1" y="1" xunits="fraction" yunits="fraction"/> 
     <screenXY x="1" y="1" xunits="fraction" yunits="fraction"/> 
     <rotationXY x="0" y="0" xunits="fraction" yunits="fraction"/> 
     <size x="0" y="0" xunits="fraction" yunits="fraction"/> 
     </ScreenOverlay> 
     <ScreenOverlay> 
     <name>screenoverlay_absolute_topleft</name> 
     <visibility>0</visibility> 
     <Icon> 
      <href>http://code.google.com/apis/kml/documentation/top_left.jpg</href> 
     </Icon> 
     <overlayXY x="0" y="1" xunits="fraction" yunits="fraction"/> 
     <screenXY x="0" y="1" xunits="fraction" yunits="fraction"/> 
     <rotationXY x="0" y="0" xunits="fraction" yunits="fraction"/> 
     <size x="0" y="0" xunits="fraction" yunits="fraction"/> 
     </ScreenOverlay> 
     <ScreenOverlay> 
     <name>screenoverlay_absolute_bottomright</name> 
     <visibility>0</visibility> 
     <Icon> 
      <href>http://code.google.com/apis/kml/documentation/bottom_right.jpg</href> 
     </Icon> 
     <overlayXY x="1" y="-1" xunits="fraction" yunits="fraction"/> 
     <screenXY x="1" y="0" xunits="fraction" yunits="fraction"/> 
     <rotationXY x="0" y="0" xunits="fraction" yunits="fraction"/> 
     <size x="0" y="0" xunits="fraction" yunits="fraction"/> 
     </ScreenOverlay> 
     <ScreenOverlay> 
     <name>screenoverlay_absolute_bottomleft</name> 
     <visibility>0</visibility> 
     <Icon> 
      <href>http://code.google.com/apis/kml/documentation/bottom_left.jpg</href> 
     </Icon> 
     <overlayXY x="0" y="-1" xunits="fraction" yunits="fraction"/> 
     <screenXY x="0" y="0" xunits="fraction" yunits="fraction"/> 
     <rotationXY x="0" y="0" xunits="fraction" yunits="fraction"/> 
     <size x="0" y="0" xunits="fraction" yunits="fraction"/> 
     </ScreenOverlay> 
    </Folder> 
    </Document> 
</kml>

et mon code est:

function initialize() { 
     if (GBrowserIsCompatible()) { 
     var map = new GMap2(document.getElementById("map_canvas")); 
     var center=new GLatLng(39.9493, 116.3975); 
     map.setCenter(center, 13); 
     var geoXml = new GGeoXml("SamplesInMaps.kml"); 
      <!--Place KML on Map --> 
      map.addOverlay(geoXml); 
    } 
}

mais, je ne réussi ,,

faire vous savez comment faire cela ..

merci

c'est le fichier html:

<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" > 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
     <meta name="viewport" content="width=device-width,minimum-scale=0.3,maximum-scale=5.0,user-scalable=yes"> 

    </head> 
<body onload="initialize()" onunload="GUnload()"> 

<style type="text/css"> 
*{ 
    margin:0; 
    padding:0; 
    } 
.b{ 
    background:url(img/xr.png) right no-repeat; 
    } 
.b > div{ 
    width:30px; 
    height:31px; 
    background:url(img/xpinIcon.png) 0 0 no-repeat; 
    } 
</style> 
<!--<div style="width:100px;height:100px;background:blue;"> </div>--> 
<div id="map_canvas" style="width: 500px; height: 300px;"></div> 


<div class=b style="position:absolute;left:700px;top:200px;"> 
    <div></div> 
</div> 
<div class=b style="position:absolute;left:700px;top:200px;"> 
    <div></div> 
</div> 

<script src="jquery-1.4.2.js" type="text/javascript"></script> 
<script src="jquery-ui-1.8rc3.custom.min.js" type="text/javascript"></script> 
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAA-7cuV3vqp7w6zUNiN_F4uBRi_j0U6kJrkFvY4-OX2XYmEAa76BSNz0ifabgugotzJgrxyodPDmheRA&sensor=false"type="text/javascript"></script> 

<script type="text/javascript"> 
var aFn; 
//********** 
function initialize() { 
     if (GBrowserIsCompatible()) { 
     var map = new GMap2(document.getElementById("map_canvas")); 
     var geoXml = new GGeoXml("SamplesInMaps.kml"); 
      map.addOverlay(geoXml); 
     var center=new GLatLng(-122.0822035425683,37.42228990140251); 
     map.setCenter(center, 0); 


aFn=function(x,y){ 

      var point =new GPoint(x,y) 
      point = map.fromContainerPixelToLatLng(point); 
      //console.log(point.x+" "+point.y) 
      map.addOverlay(new GMarker(point)); 


/********** 

     var marker = new GMarker(point, {draggable: true}); 

     GEvent.addListener(marker, "dragstart", function() { 
     map.closeInfoWindow(); 
     }); 

     GEvent.addListener(marker, "dragend", function() { 
     marker.openInfoWindowHtml("正在反弹..."); 
     }); 
     map.addOverlay(marker); 
     */ 
    } 
$(".b").draggable({ 
    revert: true, 
    revertDuration: 0 
    }); 
$("#map_canvas").droppable({ 
drop: function(event,ui) { 
    //console.log(ui.offset.left+' '+ui.offset.top) 
    aFn(event.pageX-$("#map_canvas").offset().left,event.pageY-$("#map_canvas").offset().top); 
    } 
}); 
} 
} 
//************* 



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

mis à jour

i faire un simple fichier kml "de b.kml":

<?xml version="1.0" encoding="UTF-8"?> 
<kml xmlns="http://www.opengis.net/kml/2.2"> 
    <Placemark> 
    <name>Simple placemark</name> 
    <description>Attached to the ground. Intelligently places itself 
     at the height of the underlying terrain.</description> 
    <Point> 
     <coordinates>-122.0822035425683,37.42228990140251,0</coordinates> 
    </Point> 
    </Placemark> 
</kml>

et le code de la carte est:

var map = new GMap2(document.getElementById("map_canvas")); 
var g = new GGeoXml("b.kml"); 
      map.addOverlay(g); 
      var center=new GLatLng(37.42228990140251,-122.0822035425683); 
map.setCenter(center, 0);

mais, il ne montre rien (la carte est ok)

pourquoi?

merci

Source

2010-03-20 zjm1126

+0

Quel (s) message (s) d'erreur obtenez-vous? –

+0

aucune erreur, peut voir la carte, mais ne peut pas voir le marqueur dans les fichiers kml – zjm1126

Répondre

0

Votre code API Google Maps est correct. Malheureusement Google Maps ne prend en charge qu'un ensemble limité de KML. Toutes les fonctionnalités ne sont donc pas prises en charge et Google Earth est plus flexible. Il peut donc prendre en charge le code KML que Google Maps ne comprendra pas.

Vous pouvez essayer ce qui suit pour vérifier que votre code API Maps est correcte: En outre,

var g = new GGeoXml("http://tagzania.com/rss/user/blogwatcher/7wonders%2Bnew/"); 
map.addOverlay(g);

noter que le setCenter() dans votre fichier HTML semble utiliser une latitude et la longitude inversée. Cela devrait probablement être:

var center = new GLatLng(37.42228990140251, -122.0822035425683);

Source

2010-03-20 11:03:24

+0

salut Daniel, saviez-vous comment créer un kml (la manière simple), en utilisant js ou python, merci, – zjm1126

+0

et "http: // tagzania .com/rss/user/blogwatcher/7wonders% 2Bnew/"est un fichier xml ou un fichier kml ?? – zjm1126

+0

C'était en fait un flux d'atomes. Vous pouvez consulter le sujet suivant: http://groups.google.com/group/kml-support-getting-started/browse_thread/thread/c14d1f377838c2d8 pour des exemples de KML qui fonctionnent dans Google Maps. –

 Questions connexes

  • Aucun problème connexe^_^