0

所以，我试图从 mapbox GL 中加载的样式图中获取样式层，但它一直返回未定义的元素。我已经走投无路了。

我正在尝试将底层水层存储在 layers 变量中，以便我可以更改其属性。例如，它的可见性。

这是代码：

var layers=map.getLayer('water');
changeinnerHTML(featuresWindow, JSON.stringify(layers, null, 1));

PS - 多年后我将重返编码领域。我刚刚又刷了一遍我的js。

PPS：如果您关心，这是整个代码：

<script>
      //Mapbox Access Token
      mapboxgl.accessToken = 'pk.eyJ1IjoiYWtzaGF5a2h1cmFuYSIsImEiOiJjaWY3dXdkN3MxMzZ3czZsempwbWc0MnRoIn0.y7jHQWK5lONsJ_6u3EJSTg';
      // Select html objects that constantly change into javascript variables. Henceforth known as elementVar
      var featuresWindow = document.getElementById('features');
      // GLOBAL FUNCTIONS : Functions that are used repeatedly
      // Function to change inner HTML of div, span etc elements
      function changeinnerHTML(elementVar, newvalue) {
            elementVar.innerHTML = newvalue;
            return null;
         }
         // Function to change colours.
      function switchColor(myColor, layer) {
            map.setPaintProperty(layer, 'fill-color', myColor);
         }
         // Intialise map
      if (!mapboxgl.supported()) {
         alert('Your browser does not support Mapbox GL!');
      } else {
         var map = new mapboxgl.Map({
            container: 'map', // container id
            style: 'mapbox://styles/akshaykhurana/cihlwytjz001kb4kqu0b62xq7', //stylesheet location
            minZoom: 9, //minimum zoom value
            maxZoom: 16, //maximum zoom value
            interactive: true
         });
      }
      // Get some layers man.
      var layers=map.getLayer();
      changeinnerHTML(featuresWindow, JSON.stringify(layers, null, 1));
      // Push information to sidebar on mouse hover
      map.on('click', function(e) {
         map.featuresAt(e.point, {
            radius: 5
         }, function(err, features) {
            if (err) throw err;
            changeinnerHTML(featuresWindow1, JSON.stringify(features, null, 2));
         });
      });

   </script>
4

1 回答 1

1

不确定你是否已经弄清楚了，但基本上你只需要摆脱“map.getLayer('water')”部分。

var layers = 'water';
map.setLayoutProperty(layers, 'visibility', 'none');

我不确定您使用它的目的是什么，因为您可以在 Mapbox Studio 编辑器中将样式设置为不可见，但是当我更改布局属性时，我会使用 .click(function) 来执行此操作，如下所示：

$('.className').click(function(e) {
    e.preventDefault(); 
    var layers = 'water';
    map.setLayoutProperty(layers, 'visibility', 'none');
});

然后您所要做的就是在您的 HTML 中添加一个按钮或任何其他项目，使用“className”类，并且每当单击它时，水层将变得不可见。

于 2016-01-21T14:55:37.553 回答