Question

这是我原来的工作代码，只使用了1个VectorLayer。

$filename = "files/armaupdates";
$text = $_POST['update'];

$updatesep = "<hr><br><hr><br>";

$fp = fopen($filename, "a+");

if($fp){
	fwrite($fp, $text);
	fwrite($fp, $updatesep);
	fclose($fp);
	echo "Updates has been written!";
}
else {
	echo "Error!";
}

as seen here

我尝试通过添加新图层和标记来更改其中一个标记的弹出内容。新代码如下所示：

    <html>
  <head>
        <link rel="stylesheet" type="text/css" href="slova.css">
        <link rel="stylesheet" type="text/css" href="blink.css"></head>
   <body>
   <div id="mapdiv"></div>
  <script src="http://www.openlayers.org/api/OpenLayers.js"></script>
  <script>
     map = new OpenLayers.Map("mapdiv");
     map.addLayer(new OpenLayers.Layer.OSM());

    epsg4326 =  new OpenLayers.Projection("EPSG:4326"); 
    projectTo = map.getProjectionObject(); 

    var lonLat = new OpenLayers.LonLat( 16.49679 ,43.52764 ).transform(epsg4326, projectTo);


    var zoom=12;
    map.setCenter (lonLat, zoom);

    var vectorLayer = new OpenLayers.Layer.Vector("Overlay");

    var feature = new OpenLayers.Feature.Vector(
            new OpenLayers.Geometry.Point( 16.42253, 43.50928 ).transform(epsg4326, projectTo),
            {description:'Marjan'} ,
            {externalGraphic: 'img/marker.png', graphicHeight: 25, graphicWidth: 21, graphicXOffset:-12, graphicYOffset:-25  }
        );    
    vectorLayer.addFeatures(feature);

    var feature = new OpenLayers.Feature.Vector(
            new OpenLayers.Geometry.Point( 16.56580, 43.50722 ).transform(epsg4326, projectTo),
            {description:'Perun'} ,
            {externalGraphic: 'img/marker.png', graphicHeight: 25, graphicWidth: 21, graphicXOffset:-12, graphicYOffset:-25  }
        );    
    vectorLayer.addFeatures(feature);

    var feature = new OpenLayers.Feature.Vector(
            new OpenLayers.Geometry.Point( 16.40478, 43.57865  ).transform(epsg4326, projectTo),
            {description:'Kozjak'},
            {externalGraphic: 'img/marker.png', graphicHeight: 25, graphicWidth: 21, graphicXOffset:-12, graphicYOffset:-25  }
        );    
    vectorLayer.addFeatures(feature);


    map.addLayer(vectorLayer);


    //Add a selector control to the vectorLayer with popup functions
    var controls = {
      selector: new OpenLayers.Control.SelectFeature(vectorLayer, { onSelect: createPopup, onUnselect: destroyPopup })
    };

    function createPopup(feature) {
      feature.popup = new OpenLayers.Popup.FramedCloud("pop",
          feature.geometry.getBounds().getCenterLonLat(),
          null,
          '<div class="slika"><h6>INDEKS RIZIKA POŽARA RASLINJA</h6><div class="container"><div class="panel rizik1 "><h1>VRLO MALA</h1></div><div class="panel rizik2"><h2>MALA</h2></div><div class="panel rizik3"><h3>UMJERENA</h3></div><div class="panel rizik4 blink_me"><h4>VELIKA</h4></div><div class="panel rizik5"><h5>VRLO VELIKA</h5></div></div></div>',
          null,
          true,
          function() { controls['selector'].unselectAll(); }
      );
      //feature.popup.closeOnMove = true;
      map.addPopup(feature.popup);
    }

    function destroyPopup(feature) {
      feature.popup.destroy();
      feature.popup = null;
    }

    map.addControl(controls['selector']);
    controls['selector'].activate();

  </script>

</body></html>

但as you can see here它无法正常工作。它只显示带有＃1索引的元素。我可以为要显示的功能和要素1做什么？

Answer 1

首先，如果您定义两次具有相同名称的函数，则只需覆盖第一个声明。这是createPopup和detroyPopup的情况。

无论如何，OpenLayers.Control.SelectFeature控件接受一个或多个矢量图层作为第一个参数。因此，您可以对两个图层使用单个控件，如下所示： new OpenLayers.Control.SelectFeature([vectorLayer, vectorLayer1], { onSelect: createPopup, onUnselect: destroyPopup })

但是，我不认为使用多个图层是满足您需求的正确解决方案（如果我理解正确的话！）。

我认为你应该将所有功能添加到单个图层，使用属性来识别它们（“描述”没问题。）

您可以为每个功能创建不同html的弹出窗口，如下所示：

<code><pre>

function createPopup(feature) {
  var html;
  if(feature.attributes.description == 'Marjan') {
      html = '<div class="slika"><h6>....</div>';
  } else if(feature.attributes.description == 'Kozjak') {
      html = '<div class="slika"><h6>....</div>';
  }
  feature.popup = new OpenLayers.Popup.FramedCloud("pop",
      feature.geometry.getBounds().getCenterLonLat(),
      null,
      html,
      null,
      true,
      function() { controls['selector'].unselectAll(); }
  );
  map.addPopup(feature.popup);
}

</pre></code>

如何使不同的vectorlayers可访问？

1 个答案: