javascript - 在 OpenLayers map 中查看矢量叠加

Question

我是使用 HTML 创建 map 的新手，我一直在尝试将两个矢量图层(地点、点)添加到 basemap (道路)中，但是我无法在 map 上看到矢量图层。这些图层应显示为 basemap 的矢量叠加层。这些层在层切换器中显示时就在那里，但没有显示在屏幕上。我认为问题在于矢量图层的调用方式。显示矢量图层的解决方案是什么？谢谢

var map = new OpenLayers.Map("map-id");

    var roads= new OpenLayers.Layer.WMS(
    "roads",
    "http://localhost:8080/geoserver/wms",
    {layers: "roads"});

var points= new OpenLayers.Layer.Vector(
    "points",
    "http://localhost:8080/geoserver/wms",
    {layers: "points"});

var places= new OpenLayers.Layer.Vector(
    "places",
    "http://localhost:8080/geoserver/wms",
    {layers: "places"});

map.addLayer(roads);
map.addLayer(points);
map.addLayer(places);
map.addControl(new OpenLayers.Control.LayerSwitcher());

Answer 1

您正在尝试通过 WMS 协议(protocol)显示矢量数据。为此，您应该使用 OpenLayers.Layer.WMS 实例而不是 OpenLayers.Layer.Vector。要将 WMS 图层显示为叠加层，请使用 isBaseLayer 选项:

map = new OpenLayers.Map('map'); 
var places = new OpenLayers.Layer.WMS('places',
  "http://localhost:8080/geoserver/wms",
  {layers: "places", transparent: true},
  {isBaseLayer: false, opacity: 1, singleTile: true, visibility: true}
);
map.addLayers([places]);