2012-05-08 4 views
1

다각형이 포함 된 KML 파일을 읽으려면 KML Example을 가이드로 사용하고 있습니다. KML 파일은Google Maps API V3 KML 파일 읽기

<?xml version="1.0" encoding="UTF-8"?> 
<kml xmlns="http://earth.google.com/kml/2.2"> 
<Document> 
    <name>Neighborhood Groups</name> 
    <description><![CDATA[Content]]></description> 
    <Style id="style3"> 
    </Style> 
    <Style id="style9"> 
    </Style> 
    <Style id="style8"> 
    </Style> 
    <Style id="style2"> 
    </Style> 
    <Style id="style4"> 
    </Style> 
    <Style id="style7"> 
    </Style> 
    <Style id="style1"> 
    </Style> 
    <Style id="style5"> 
    </Style> 
    <Style id="style6"> 
    </Style> 
    <Style id="style10"> 
    </Style> 
    <Placemark> 
    <name>Neighborhood Group 1</name> 
    <styleUrl>#style3</styleUrl> 
    <Polygon> 
     <outerBoundaryIs> 
     <LinearRing> 
      <tessellate>1</tessellate> 
      <coordinates> 
      -84.087296,35.911472,0.000000 
      -84.089699,35.909248,0.000000 
      -84.089439,35.903618,0.000000 
      -84.085625,35.898994,0.000000 
      -84.075836,35.903721,0.000000 
      -84.081757,35.912968,0.000000 
      -84.083565,35.919537,0.000000 
      -84.090385,35.918110,0.000000 
      -84.087250,35.911507,0.000000 
      -84.090385,35.918110,0.000000 
      -84.083473,35.919640,0.000000 
      -84.087296,35.911472,0.000000 
      </coordinates> 
     </LinearRing> 
     </outerBoundaryIs> 
    </Polygon> 
    </Placemark> 
    <Placemark> 
    <name>Neighborhood Group 2</name> 
    <styleUrl>#style9</styleUrl> 
    <Polygon> 
     <outerBoundaryIs> 
     <LinearRing> 
      <tessellate>1</tessellate> 
      <coordinates> 
      -84.089439,35.902992,0.000000 
      -84.089569,35.902992,0.000000 
      -84.089615,35.902954,0.000000 
      -84.093178,35.901428,0.000000 
      -84.096741,35.900002,0.000000 
      -84.097122,35.898819,0.000000 
      -84.098969,35.897324,0.000000 
      -84.112183,35.891346,0.000000 
      -84.102013,35.885120,0.000000 
      -84.089699,35.888771,0.000000 
      -84.086739,35.892563,0.000000 
      -84.082275,35.894367,0.000000 
      -84.080429,35.894543,0.000000 
      -84.087059,35.899845,0.000000 
      -84.089401,35.903061,0.000000 
      -84.089439,35.902992,0.000000 
      </coordinates> 
     </LinearRing> 
     </outerBoundaryIs> 
    </Polygon> 
    </Placemark> 
    <Placemark> 
    <name>Neighborhood Group 3</name> 
    <styleUrl>#style8</styleUrl> 
    <Polygon> 
     <outerBoundaryIs> 
     <LinearRing> 
      <tessellate>1</tessellate> 
      <coordinates> 
      -84.094109,35.910252,0.000000 
      -84.094551,35.910252,0.000000 
      -84.101067,35.909031,0.000000 
      -84.096008,35.904068,0.000000 
      -84.105103,35.901699,0.000000 
      -84.104927,35.899651,0.000000 
      -84.102867,35.895691,0.000000 
      -84.097977,35.898022,0.000000 
      -84.096992,35.899681,0.000000 
      -84.095833,35.900730,0.000000 
      -84.093681,35.906811,0.000000 
      -84.094109,35.910252,0.000000 
      </coordinates> 
     </LinearRing> 
     </outerBoundaryIs> 
    </Polygon> 
    </Placemark> 
    <Placemark> 
    <name>Neighborhood Group 4</name> 
    <styleUrl>#style2</styleUrl> 
    <Polygon> 
     <outerBoundaryIs> 
     <LinearRing> 
      <tessellate>1</tessellate> 
      <coordinates> 
      -84.101196,35.908970,0.000000 
      -84.101418,35.908901,0.000000 
      -84.106911,35.907337,0.000000 
      -84.113258,35.904381,0.000000 
      -84.116608,35.903618,0.000000 
      -84.116348,35.901497,0.000000 
      -84.116905,35.899826,0.000000 
      -84.116394,35.897915,0.000000 
      -84.114418,35.893120,0.000000 
      -84.111504,35.890961,0.000000 
      -84.103905,35.896385,0.000000 
      -84.104889,35.899548,0.000000 
      -84.105324,35.900383,0.000000 
      -84.100731,35.903755,0.000000 
      -84.101196,35.908970,0.000000 
      </coordinates> 
     </LinearRing> 
     </outerBoundaryIs> 
    </Polygon> 
    </Placemark> 
    <Placemark> 
    <name>Neighborhood Group 5</name> 
    <Snippet>sdfgsdfg</Snippet> 
    <description><![CDATA[<div dir="ltr">sdfgsdfg</div>]]></description> 
    <styleUrl>#style4</styleUrl> 
    <Polygon> 
     <outerBoundaryIs> 
     <LinearRing> 
      <tessellate>1</tessellate> 
      <coordinates> 
      -84.094238,35.941559,0.000000 
      -84.096649,35.944000,0.000000 
      -84.100082,35.945660,0.000000 
      -84.105621,35.945702,0.000000 
      -84.111618,35.945660,0.000000 
      -84.113251,35.943161,0.000000 
      -84.113770,35.939030,0.000000 
      -84.109177,35.940590,0.000000 
      -84.110039,35.927589,0.000000 
      -84.105789,35.925468,0.000000 
      -84.094238,35.924358,0.000000 
      -84.095360,35.930439,0.000000 
      -84.094238,35.941559,0.000000 
      </coordinates> 
     </LinearRing> 
     </outerBoundaryIs> 
    </Polygon> 
    </Placemark> 
    <Placemark> 
    <name>Neighborhood Group 6</name> 
    <styleUrl>#style7</styleUrl> 
    <Polygon> 
     <outerBoundaryIs> 
     <LinearRing> 
      <tessellate>1</tessellate> 
      <coordinates> 
      -84.102272,35.946110,0.000000 
      -84.101959,35.946110,0.000000 
      -84.100342,35.945911,0.000000 
      -84.096512,35.943981,0.000000 
      -84.094070,35.941422,0.000000 
      -84.094582,35.938961,0.000000 
      -84.144463,35.913799,0.000000 
      -84.094490,35.927872,0.000000 
      -84.093773,35.924252,0.000000 
      -84.090210,35.918522,0.000000 
      -84.074852,35.921921,0.000000 
      -84.079170,35.936520,0.000000 
      -84.080971,35.941551,0.000000 
      -84.081749,35.943130,0.000000 
      -84.081413,35.945061,0.000000 
      -84.082520,35.947472,0.000000 
      -84.085609,35.949211,0.000000 
      -84.092651,35.953411,0.000000 
      -84.100029,35.949070,0.000000 
      -84.102272,35.946110,0.000000 
      </coordinates> 
     </LinearRing> 
     </outerBoundaryIs> 
    </Polygon> 
    </Placemark> 
    <Placemark> 
    <name>Neighborhood Group 7</name> 
    <styleUrl>#style1</styleUrl> 
    <Polygon> 
     <outerBoundaryIs> 
     <LinearRing> 
      <tessellate>1</tessellate> 
      <coordinates> 
      -84.082008,35.944618,0.000000 
      -84.081757,35.943512,0.000000 
      -84.079140,35.936489,0.000000 
      -84.079391,35.934158,0.000000 
      -84.076088,35.921650,0.000000 
      -84.059013,35.925400,0.000000 
      -84.059097,35.928532,0.000000 
      -84.062569,35.931278,0.000000 
      -84.062920,35.932812,0.000000 
      -84.060249,35.937119,0.000000 
      -84.059608,35.939690,0.000000 
      -84.060768,35.941841,0.000000 
      -84.064552,35.943130,0.000000 
      -84.074333,35.944691,0.000000 
      -84.078712,35.945660,0.000000 
      -84.082008,35.944618,0.000000 
      </coordinates> 
     </LinearRing> 
     </outerBoundaryIs> 
    </Polygon> 
    </Placemark> 
    <Placemark> 
    <name>Neighborhood Group 8</name> 
    <styleUrl>#style5</styleUrl> 
    <Polygon> 
     <outerBoundaryIs> 
     <LinearRing> 
      <tessellate>1</tessellate> 
      <coordinates> 
      -84.079613,35.913628,0.000000 
      -84.074722,35.906986,0.000000 
      -84.065323,35.911575,0.000000 
      -84.063797,35.911873,0.000000 
      -84.061096,35.912186,0.000000 
      -84.062019,35.922176,0.000000 
      -84.065582,35.923531,0.000000 
      -84.077080,35.920891,0.000000 
      -84.079315,35.914322,0.000000 
      -84.079613,35.913628,0.000000 
      </coordinates> 
     </LinearRing> 
     </outerBoundaryIs> 
    </Polygon> 
    </Placemark> 
    <Placemark> 
    <name>Neighborhood Group 9</name> 
    <styleUrl>#style6</styleUrl> 
    <Polygon> 
     <outerBoundaryIs> 
     <LinearRing> 
      <tessellate>1</tessellate> 
      <coordinates> 
      -84.074425,35.906693,0.000000 
      -84.074638,35.906605,0.000000 
      -84.077042,35.905910,0.000000 
      -84.072319,35.899166,0.000000 
      -84.068626,35.894058,0.000000 
      -84.067337,35.890911,0.000000 
      -84.060234,35.892754,0.000000 
      -84.056396,35.894283,0.000000 
      -84.052963,35.894909,0.000000 
      -84.055069,35.899513,0.000000 
      -84.058434,35.899132,0.000000 
      -84.060387,35.902954,0.000000 
      -84.061722,35.905807,0.000000 
      -84.064934,35.910309,0.000000 
      -84.065582,35.911331,0.000000 
      -84.074425,35.906693,0.000000 
      </coordinates> 
     </LinearRing> 
     </outerBoundaryIs> 
    </Polygon> 
    </Placemark> 
    <Placemark> 
    <name>Neighborhood Group 17</name> 
    <styleUrl>#style10</styleUrl> 
    <Polygon> 
     <outerBoundaryIs> 
     <LinearRing> 
      <tessellate>1</tessellate> 
      <coordinates> 
      -84.061737,35.913246,0.000000 
      -84.061844,35.913002,0.000000 
      -84.063606,35.911995,0.000000 
      -84.063690,35.910950,0.000000 
      -84.064682,35.910221,0.000000 
      -84.061028,35.902817,0.000000 
      -84.057938,35.898716,0.000000 
      -84.052574,35.900906,0.000000 
      -84.047256,35.904797,0.000000 
      -84.048134,35.905632,0.000000 
      -84.047424,35.906815,0.000000 
      -84.047966,35.911194,0.000000 
      -84.048264,35.912777,0.000000 
      -84.050819,35.913334,0.000000 
      -84.051201,35.914669,0.000000 
      -84.052490,35.918163,0.000000 
      -84.052490,35.921429,0.000000 
      -84.057083,35.920597,0.000000 
      -84.059204,35.918682,0.000000 
      -84.061737,35.913246,0.000000 
      </coordinates> 
     </LinearRing> 
     </outerBoundaryIs> 
    </Polygon> 
    </Placemark> 
</Document> 
</kml> 

가 진행중인 전체 작업이 http://cspc.net/neighborhoods/map.html에있다

function initialize() { 
    var myLatlng = new google.maps.LatLng(35.910200,-84.085100); 
    var myOptions = { 
    zoom: 12, 
    center: myLatlng, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 

    var map = new google.maps.Map(
     document.getElementById("map_canvas"), 
     myOptions); 

    var nyLayer = new google.maps.KmlLayer(
     'map.kml', 
     { suppressInfoWindows: true, 
     map: map}); 


    google.maps.event.addListener(nyLayer, 'click', function(kmlEvent) { 
    var text = kmlEvent.featureData.description; 
    showInContentWindow(text); 
    }); 

    function showInContentWindow(text) { 
    var sidediv = document.getElementById('content_window'); 
    sidediv.innerHTML = text; 
    } 
} 

입니다 처리하는 자바 스크립트가 포함되어 있습니다. 보시다시피지도는로드가 완료되지 않습니다. maps.google.com에서 만든 맞춤지도에서 kml 파일을 내보내고 있습니다.

kml 파일을 수정해야합니까?

답변

2

문제는 KmlLayerdoc 생성자 호출에 있습니다. Google이 kml 파일을 검색 할 수있는 공개 URL을 제공해야합니다. Google은 kml을 처리하여 오버레이 타일로 변환 한 다음 new google.maps.KmlLayer(...)으로 생성 한 KmlLayer으로 반환합니다.