2016-03-23 20 views
0

OpenLayers ile yeni edindim ve bir haritaya bir KML katmanı eklemeye çalışıyorum.OpenLayers 3, KML katmanını göstermiyor

var projection = ol.proj.get('EPSG:3857'); 

var mapa = new ol.layer.Tile({ 
    source: new ol.source.OSM() 
}); 

var map = new ol.Map({ 
    target: 'map', 
    controls: ol.control.defaults({ 
     attributionOptions: /** @type {olx.control.AttributionOptions} */ ({ 
      collapsible: false 
     }) 
    }), 
    view: new ol.View({ 
     center: [-5462834.47, -3058929.70], 
     projection: projection, 
     zoom: 10 
    }) 
}); 

map.addLayer(mapa); 

var alfalfa_zaragoza = new ol.layer.Vector({ 
    source: new ol.source.Vector({ 
     url: 'kml/ms_alfalfazaragoza_rgba_ndvi.kml', 
     format: new ol.format.KML() 
    }), 
    extractStyles: true, 
    extractAttributes: true, 
    maxDepth: 2, 
    setVisibility: true 
}); 



document.getElementById('addKML').onclick = function() { 
    map.addLayer(alfalfa_zaragoza); 
}; 

Ve html sayfası:

<html> 
<head> 
    <title>Title</title> 
    <link rel="stylesheet" href="http://openlayers.org/en/v3.2.0/css/ol.css" type="text/css"> 
    <script type="javascript" src="<%=request.getContextPath()%>/resources/OpenLayersv3.14.2/build/ol.js"></script> 
    <script src="http://maps.google.com/maps/api/js?v=3&amp;sensor=false"></script> 
    <link rel="stylesheet" href="<%=request.getContextPath()%>/resources/OpenLayersv3.14.2/css/ol.css" type="text/css" /> 
    <link rel="stylesheet" href="<%=request.getContextPath()%>/resources/ol3-google-maps-v0.4/ol3gm.css" type="text/css" /> 
    <link rel="stylesheet" href="<%=request.getContextPath()%>/resources/layout.css" type="text/css" /> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" /> 

</head> 
<body> 

<div class="container-fluid"> 
    <div class="row-fluid"> 
     <div class="span12"> 
      <div id="map" class="map"></div> 
     </div> 
    </div> 
    <div class="row-fluid"> 
     <div class="span12"> 
      <h4>Concept example</h4> 

      <div class="row"> 
       <div class="col-md-4 col-sm-4"> 
        <fieldset> 
         <input id="addKML" type="button" value="Add KML" 
           title="Add KML layer"/> 
        </fieldset> 
       </div> 
      </div> 

     </div> 
    </div> 
</div> 
<script src="<%=request.getContextPath()%>/resources/ol3-google-maps-v0.4/ol3gm.js"></script> 
<script src="<%=request.getContextPath()%>/resources/kml.js"></script> 

</body> 
</html> 

hatadır İşte

benim senaryom? Buradaki fikir "addKML" düğmesine basmaktır ve katman haritaya eklenir, ancak bastığımda hiçbir şey olmaz.

cevap

0

Bu benim için çalışkan bir garip. Bu biriyle

var projection = ol.proj.get('EPSG:3857'); 

:

bu satırı değiştirin: Sadece küçük bir şey unutmak

var projection = new ol.proj.get('EPSG:3857'); 

Sen 'yeni' unutmak!

KML dosyalarım ile test ediyorum ve çalışıyor. Muhtemelen KML dosyanız bozuk veya projeksiyon doğru değil. Ama benim için sadece KML url dosyasını değiştirerek çalışıyor.

İlgili konular