OpenLayers:两个GeoJSON图层,两个都是透明的

时间:2012-10-05 17:03:31

标签: javascript openlayers geojson gpx rectangles

我将GPX Track(Startpoint == Endpoint)转换为GeoJSON 我现在想要在地图上显示此轨道,其中仅显示trac封闭的地图。其余的应该是白色的。

到目前为止,我有以下内容:

<script type="text/javascript">
  function init() {
    map = new OpenLayers.Map("basicMap");
    var mapnik         = new OpenLayers.Layer.OSM();

    var fromProjection = new OpenLayers.Projection("EPSG:4326");
    var toProjection   = new OpenLayers.Projection("EPSG:900913");
    var position       = new OpenLayers.LonLat(13.41,52.52).transform( fromProjection, toProjection);
    var zoom           = 7; 

    map.addLayer(mapnik);
    map.setCenter(position, zoom );

    geojson_layer = new OpenLayers.Layer.Vector("GeoJSON", {
        strategies: [new OpenLayers.Strategy.Fixed()],
        protocol: new OpenLayers.Protocol.HTTP({
            url: "tracks.json",
            format: new OpenLayers.Format.GeoJSON()
        })
    });

    map.addLayer(geojson_layer);
  }
</script>

tracks.json是带有trac的GeoJSON文件。

基本上我现在想要一个围绕trac的矩形。 trac和矩形之间的空格应填充为白色。

感谢您的帮助!

1 个答案:

答案 0 :(得分:0)

实际上它就像用两个坐标对象声明一个Polygon一样简单。一个用于矩形,一个用于轨道:

var border = { 
"type": "Feature", 
"properties": { }, 
"geometry": { 
    "type": "Polygon", 
    "coordinates": [ 

        [
            [    
                Coordinates of Rectangle
            ]
        ],
        [
            [
                Coordinates of the track
            ]
        ]
    ]
  }
}

我在javascript中包含了这个:

 <script type="text/javascript" src="border.js"></script>
 .
 .
 var geojson_format  = new OpenLayers.Format.GeoJSON({
            'internalProjection': toProjection,
            'externalProjection': fromProjection
 });

 map.addLayer(vectorLayer);
 vectorLayer.addFeatures(geojson_format.read(border));