{"action":"reopened","issue":{"url":"https://api.github.com/repos/tombatossals/angular-leaflet-directive/issues/788","labels_url":"https://api.github.com/repos/tombatossals/angular-leaflet-directive/issues/788/labels{/name}","comments_url":"https://api.github.com/repos/tombatossals/angular-leaflet-directive/issues/788/comments","events_url":"https://api.github.com/repos/tombatossals/angular-leaflet-directive/issues/788/events","html_url":"https://github.com/tombatossals/angular-leaflet-directive/issues/788","id":85285541,"number":788,"title":"Control draw order (z-index) of layers and features","user":{"login":"seadour","id":6138182,"avatar_url":"https://avatars.githubusercontent.com/u/6138182?v=3","gravatar_id":"","url":"https://api.github.com/users/seadour","html_url":"https://github.com/seadour","followers_url":"https://api.github.com/users/seadour/followers","following_url":"https://api.github.com/users/seadour/following{/other_user}","gists_url":"https://api.github.com/users/seadour/gists{/gist_id}","starred_url":"https://api.github.com/users/seadour/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/seadour/subscriptions","organizations_url":"https://api.github.com/users/seadour/orgs","repos_url":"https://api.github.com/users/seadour/repos","events_url":"https://api.github.com/users/seadour/events{/privacy}","received_events_url":"https://api.github.com/users/seadour/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":11,"created_at":"2015-06-04T21:28:45Z","updated_at":"2015-10-29T16:54:53Z","closed_at":null,"body":"I cannot find a way to control the draw order (z-index) of layers and features with this directive.\r\n\r\nI am trying to draw polygons from a geoJSON and a circle path. The geoJSON data is loaded via Angular `$http GET` method.\r\n\r\nNo matter what I do, the geoJSON polygons are always drawn on top of the circle path. I've tried changing the order of the path/geoJSON parameters in the `$scope` object, I've tried retrieving the geoJSON data first, I've tried changing the order of attributes in the map's HTML tag...nothing seems to affect it.\r\n\r\nSample code:\r\n\r\n    angular.extend($scope, {\r\n        center: {\r\n            lat: 38.5378,\r\n            lng: -121.752,\r\n            zoom: 17\r\n        },\r\n        layers: {\r\n            baselayers: {\r\n                mapbox: {\r\n                    name: 'Mapbox',\r\n                    url: 'http://api.tiles.mapbox.com/v4/[xxx]/{z}/{x}/{y}.png?access_token=[xxx]',\r\n                    type: 'xyz'\r\n                }\r\n            }\r\n        },\r\n        geojson: {},\r\n        paths: {\r\n            circle1: {\r\n                 latlngs: {\r\n                     lat: 38.536,\r\n                     lng: -121.753\r\n                 },\r\n                 radius: 100,\r\n                 type: 'circle'\r\n            }\r\n        }\r\n    });\r\n\r\n    $http({ method: 'GET',\r\n        url: '/path/to/multipolygon.geo.json',\r\n        cache: true\r\n    }).success(function(data) {\r\n        angular.extend($scope, {\r\n            geojson: {\r\n                data: data,\r\n                style: {\r\n                    fillColor: '#f9f9f9',\r\n                    weight: 0,\r\n                    fillOpacity: 1\r\n            }\r\n        });\r\n    });\r\n\r\nIf I were using 'vanilla' Leaflet.js without Angular, I could change the order simply by adding the geoJSON to the map object before I add the path, like so:\r\n\r\n    L.geoJson(data, {\r\n        style: {\r\n            fillColor: '#f9f9f9',\r\n            weight: 0,\r\n            fillOpacity: 1\r\n        }\r\n    }).addTo(map);\r\n\r\n    L.circle([38.536, -121.753], 100).addTo(map);\r\n\r\nIn this screenshot, the grey buildings/roads are the basemap, the white building polygons are from the GeoJSON, and the blue circle is the circle path. I want the blue circle to draw on top of the white polygons.\r\n\r\n![screen shot 2015-06-04 at 2 27 05 pm](https://cloud.githubusercontent.com/assets/6138182/7994873/e6acacfe-0ac5-11e5-8025-b246e37d26aa.png)\r\n"}}