OSM中的白线(OpenLayers)

时间:2016-01-21 06:13:44

标签: html openlayers openstreetmap

我在JSP中使用这段代码来显示使用OSM的地图(OpenStreetMap,一个用于创建可自由编辑的世界地图的协作项目)但我在地图中看到了一些白线

<div class="windowContentMap" >
    <div id="Map" style="width: 97%; height: 94%"></div>
                        <script src="http://www.openlayers.org/api/OpenLayers.js"></script>
                        <script>
                            var lat            = '${lat}';
                            var lon            = '${lng}';
                            var zoom           =  9;

                            var fromProjection = new OpenLayers.Projection("EPSG:4326");   // Transform from WGS 1984
                            var toProjection   = new OpenLayers.Projection("EPSG:900913"); // to Spherical Mercator Projection
                            var position       = new OpenLayers.LonLat(lon, lat).transform( fromProjection, toProjection);

                            map = new OpenLayers.Map("Map");
                            var mapnik         = new OpenLayers.Layer.OSM();
                            map.addLayer(mapnik);

                            var markers = new OpenLayers.Layer.Markers( "Markers" );
                            map.addLayer(markers);
                            markers.addMarker(new OpenLayers.Marker(position));
                            map.setCenter(position, zoom);

                            var myLocation = new OpenLayers.Geometry.Point(lon, lat).transform('EPSG:4326', 'EPSG:3857');

                        </script>

                    </div>
</div>


.windowContentMap div{
    height: 334px;
    display: block;
    border-left: 1px solid #efefef;
    border-right: 1px solid #efefef;
}

enter image description here

1 个答案:

答案 0 :(得分:0)

我怀疑你的问题是CSS,而不是JS / OpenLayers。

试试这个

#Map {
    height: 334px;
    display: block;
    border-left: 1px solid #efefef;
    border-right: 1px solid #efefef;
}

你正在为div.windowContentMap的所有div子项提供边框,因此OpenLayers创建的div也会获得边框。