Angular-Leaflet-Directive: Set opacity of a layer

Question

I am using the angular-leaflet-directive. Is there an option to change the opacity of a layer?

With 'regular' leaflet I can use layer.setOpacity(0.5). But there seems to be no option in the angular-leaflet-directive.

Edit: here is my leaflet configuration:

angular.module('epic-taxi')
  .controller('MainController', ['$scope', function($scope) {

    $scope.initMap = function() {
      angular.extend($scope, {
        newYork: {
          lat: 40.7304783951045,
          lng: -73.98880004882812,
          zoom: 12
        },
        layers: {
          baselayers: {
            mapbox_light: {
              name: 'Light',
              type: 'xyz',
              url: 'http://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png'
            }
          },
          overlays: {
            subway: {
              name: 'Subway',
              visible: true,
              type: 'group',
              opacity: 0.1    // not working
            }
          }
        }
      });
    };
  }]);

I want to change the opacity of the 'subway' overlay which contains multiple paths.

score 1 · Accepted Answer · answered Jun 14 '15 at 17:14

1

It looks like this is not implemented yet: https://github.com/tombatossals/angular-leaflet-directive/issues/251

Thanks to Jonatas Walker for pointing it out!

answered Jun 14 '15 at 17:14

fwind

1,274
4
15
32

score 0 · Answer 2 · answered Jun 06 '15 at 09:42

0

Did you read their docs?

app.controller("CenterController", [ '$scope', function($scope) {
    angular.extend($scope, {
        center: {
            lat: 40.095,
            lng: -3.823,
            zoom: 4,
            opacity: 0.5
        },
        defaults: {
            scrollWheelZoom: false
        }
    });
}]);

answered Jun 06 '15 at 09:42

Jonatas Walker

13,583
5
53
82

How does that solve my problem? I want to change the opacity of one particular layer. – fwind Jun 07 '15 at 13:27
When the creation of that particular layer ... use this property - `opacity`. If you want more help, post part of your code. – Jonatas Walker Jun 08 '15 at 09:25
The opacity property seems to do nothing. I added my map initialization. I want to change the opacity of the 'subway' overlay which contains multiple paths. – fwind Jun 08 '15 at 10:08
It looks like they're working on it ... https://github.com/tombatossals/angular-leaflet-directive/issues/251 – Jonatas Walker Jun 08 '15 at 10:56

score -1 · Answer 3 · edited Jun 19 '15 at 13:16

-1

Try using this:

overlays: {
            subway: {
              name: 'Subway',
              visible: true,
              type: 'group',
              layeroptions: {
                   opacity: 0.1   
              }
            },
          }

edited Jun 19 '15 at 13:16

ryanyuyu

6,366
10
48
53

answered Jun 19 '15 at 07:49

Alexus

1,282
1
12
20

Welcome to Stack Overflow! Additional explanation would improve your answer. – ryanyuyu Jun 19 '15 at 13:16

Angular-Leaflet-Directive: Set opacity of a layer

3 Answers3