How can I create layers depending on a property? Planned maintenance scheduled April 17/18,...
The logistics of corpse disposal
How does debian/ubuntu knows a package has a updated version
How to align text above triangle figure
Why do we bend a book to keep it straight?
If a contract sometimes uses the wrong name, is it still valid?
Storing hydrofluoric acid before the invention of plastics
Why did the rest of the Eastern Bloc not invade Yugoslavia?
What is the logic behind the Maharil's explanation of why we don't say שעשה ניסים on Pesach?
What is known about the Ubaid lizard-people figurines?
How to call a function with default parameter through a pointer to function that is the return of another function?
Check which numbers satisfy the condition [A*B*C = A! + B! + C!]
Is it true that "carbohydrates are of no use for the basal metabolic need"?
English words in a non-english sci-fi novel
Gordon Ramsay Pudding Recipe
Why do people hide their license plates in the EU?
Why did the Falcon Heavy center core fall off the ASDS OCISLY barge?
Should I discuss the type of campaign with my players?
Can I cast Passwall to drop an enemy into a 20-foot pit?
How to override model in magento2?
What causes the vertical darker bands in my photo?
At the end of Thor: Ragnarok why don't the Asgardians turn and head for the Bifrost as per their original plan?
When do you get frequent flier miles - when you buy, or when you fly?
How to answer "Have you ever been terminated?"
How can I make names more distinctive without making them longer?
How can I create layers depending on a property?
Planned maintenance scheduled April 17/18, 2019 at 00:00UTC (8:00pm US/Eastern)
Announcing the arrival of Valued Associate #679: Cesar Manara
Unicorn Meta Zoo #1: Why another podcast?Openlayers: select a feature programmatically from GeoJsonLoading GEOJSON in Leaflet and separating attributesHow to update position of markers with “real time gps coordinants”?MarkerCluster don't work with geojson layer in leafletParse .geojson file in RError loading geoJSON into map using OpenLayers v4.2.0Why can't I load my basemap from the arcgis rest services using leaflet?Adding PieChart Layer through DVF in a Leaflet mapWorking with GeometryCollection in Leaflet layerLeaflet L.geoJSON from a js variable geojson object not showing on map
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ margin-bottom:0;
}
0
I have a .js file with coordinates for internships:
var internships = [{
"features": [
{"type":"Feature","properties":{"category":"entretient","Name":"green"},"geometry":{"type":"Point","coordinates":[50.807149, 3.162994]}},
{"type":"Feature","properties":{"category":"securité","Name":"blue"},"geometry":{"type":"Point","coordinates":[50.334421, 3.290146]}},
{"type":"Feature","properties":{"category":"secretaria","Name":"red"},"geometry":{"type":"Point","coordinates":[50.744787, 2.256216]}}
]
}];
I've found this bit of code allowing me to create layers depending on a property and here what my JS looks like:
$.getScript("CoordinatesPdC.js");
function mapLoad() {
var sécuritéLayer = new L.LayerGroup();
var secrétariatLayer = new L.LayerGroup();
var entretientLayer = new L.LayerGroup();
var map = L.map('map').setView([50.2910, 2.7775], 8);
L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 18,
attribution: 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' +
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, '
}).addTo(map);
var marker = L.marker([50.2910, 2.7775]).addTo(map);
var entretientLayer = L.geoJson(internships, {
filter: function (feature, layer) {
return (feature.properties.category === "entretient");
}
}).addTo(map);
var sécuritéLayer = L.geoJson(internships, {
filter: function (feature, layer) {
return (feature.properties.category === "sécurité");
}
}).addTo(map);
var secrétariatLayer = L.geoJson(internships, {
filter: function (feature, layer) {
return (feature.properties.category === "secrétariat");
}
}).addTo(map);
}
window.onload = mapLoad;
But now I have to create the markes assigned to these layers, how can I achieve that?
leaflet geojson layers markers
asked Aug 10 '18 at 9:07
Victor LernoutVictor Lernout
12
bumped to the homepage by Community♦ 2 mins ago
This question has answers that may be good or bad; the system has marked it active so that they can be reviewed.
add a comment |
0
I have a .js file with coordinates for internships:
var internships = [{
"features": [
{"type":"Feature","properties":{"category":"entretient","Name":"green"},"geometry":{"type":"Point","coordinates":[50.807149, 3.162994]}},
{"type":"Feature","properties":{"category":"securité","Name":"blue"},"geometry":{"type":"Point","coordinates":[50.334421, 3.290146]}},
{"type":"Feature","properties":{"category":"secretaria","Name":"red"},"geometry":{"type":"Point","coordinates":[50.744787, 2.256216]}}
]
}];
I've found this bit of code allowing me to create layers depending on a property and here what my JS looks like:
$.getScript("CoordinatesPdC.js");
function mapLoad() {
var sécuritéLayer = new L.LayerGroup();
var secrétariatLayer = new L.LayerGroup();
var entretientLayer = new L.LayerGroup();
var map = L.map('map').setView([50.2910, 2.7775], 8);
L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 18,
attribution: 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' +
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, '
}).addTo(map);
var marker = L.marker([50.2910, 2.7775]).addTo(map);
var entretientLayer = L.geoJson(internships, {
filter: function (feature, layer) {
return (feature.properties.category === "entretient");
}
}).addTo(map);
var sécuritéLayer = L.geoJson(internships, {
filter: function (feature, layer) {
return (feature.properties.category === "sécurité");
}
}).addTo(map);
var secrétariatLayer = L.geoJson(internships, {
filter: function (feature, layer) {
return (feature.properties.category === "secrétariat");
}
}).addTo(map);
}
window.onload = mapLoad;
But now I have to create the markes assigned to these layers, how can I achieve that?
leaflet geojson layers markers
asked Aug 10 '18 at 9:07
Victor LernoutVictor Lernout
12
bumped to the homepage by Community♦ 2 mins ago
This question has answers that may be good or bad; the system has marked it active so that they can be reviewed.
add a comment |
0
0
0
1
I have a .js file with coordinates for internships:
var internships = [{
"features": [
{"type":"Feature","properties":{"category":"entretient","Name":"green"},"geometry":{"type":"Point","coordinates":[50.807149, 3.162994]}},
{"type":"Feature","properties":{"category":"securité","Name":"blue"},"geometry":{"type":"Point","coordinates":[50.334421, 3.290146]}},
{"type":"Feature","properties":{"category":"secretaria","Name":"red"},"geometry":{"type":"Point","coordinates":[50.744787, 2.256216]}}
]
}];
I've found this bit of code allowing me to create layers depending on a property and here what my JS looks like:
$.getScript("CoordinatesPdC.js");
function mapLoad() {
var sécuritéLayer = new L.LayerGroup();
var secrétariatLayer = new L.LayerGroup();
var entretientLayer = new L.LayerGroup();
var map = L.map('map').setView([50.2910, 2.7775], 8);
L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 18,
attribution: 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' +
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, '
}).addTo(map);
var marker = L.marker([50.2910, 2.7775]).addTo(map);
var entretientLayer = L.geoJson(internships, {
filter: function (feature, layer) {
return (feature.properties.category === "entretient");
}
}).addTo(map);
var sécuritéLayer = L.geoJson(internships, {
filter: function (feature, layer) {
return (feature.properties.category === "sécurité");
}
}).addTo(map);
var secrétariatLayer = L.geoJson(internships, {
filter: function (feature, layer) {
return (feature.properties.category === "secrétariat");
}
}).addTo(map);
}
window.onload = mapLoad;
But now I have to create the markes assigned to these layers, how can I achieve that?
leaflet geojson layers markers
asked Aug 10 '18 at 9:07
Victor LernoutVictor Lernout
12
I have a .js file with coordinates for internships:
var internships = [{
"features": [
{"type":"Feature","properties":{"category":"entretient","Name":"green"},"geometry":{"type":"Point","coordinates":[50.807149, 3.162994]}},
{"type":"Feature","properties":{"category":"securité","Name":"blue"},"geometry":{"type":"Point","coordinates":[50.334421, 3.290146]}},
{"type":"Feature","properties":{"category":"secretaria","Name":"red"},"geometry":{"type":"Point","coordinates":[50.744787, 2.256216]}}
]
}];
I've found this bit of code allowing me to create layers depending on a property and here what my JS looks like:
$.getScript("CoordinatesPdC.js");
function mapLoad() {
var sécuritéLayer = new L.LayerGroup();
var secrétariatLayer = new L.LayerGroup();
var entretientLayer = new L.LayerGroup();
var map = L.map('map').setView([50.2910, 2.7775], 8);
L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 18,
attribution: 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' +
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, '
}).addTo(map);
var marker = L.marker([50.2910, 2.7775]).addTo(map);
var entretientLayer = L.geoJson(internships, {
filter: function (feature, layer) {
return (feature.properties.category === "entretient");
}
}).addTo(map);
var sécuritéLayer = L.geoJson(internships, {
filter: function (feature, layer) {
return (feature.properties.category === "sécurité");
}
}).addTo(map);
var secrétariatLayer = L.geoJson(internships, {
filter: function (feature, layer) {
return (feature.properties.category === "secrétariat");
}
}).addTo(map);
}
window.onload = mapLoad;
But now I have to create the markes assigned to these layers, how can I achieve that?
leaflet geojson layers markers
leaflet geojson layers markers
asked Aug 10 '18 at 9:07
Victor LernoutVictor Lernout
12
asked Aug 10 '18 at 9:07
Victor LernoutVictor Lernout
12
edited Aug 10 '18 at 12:14
Victor Lernout
asked Aug 10 '18 at 9:07
Victor LernoutVictor Lernout
12
asked Aug 10 '18 at 9:07
Victor LernoutVictor Lernout
12
asked Aug 10 '18 at 9:07
Victor LernoutVictor Lernout
12
12
bumped to the homepage by Community♦ 2 mins ago
This question has answers that may be good or bad; the system has marked it active so that they can be reviewed.
bumped to the homepage by Community♦ 2 mins ago
This question has answers that may be good or bad; the system has marked it active so that they can be reviewed.
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
0
You're missing the pointToLayer function. Also I checked your GeoJSON and it didn't meet the GeoJSON specs. Look at geojsonlint.com and geojson.io part of it was a data issue
<!DOCTYPE html>
<html>
<head>
<title>Example</title>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.0.3/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.0.3/dist/leaflet.js"></script>
</head>
<body>
<div id="map" style="width: 600px; height: 400px;"></div>
</div>
<script>
var internships = {
"type": "FeatureCollection",
"features": [{
"type": "Feature",
"properties": {
"category": "entretient",
"Name": "green"
},
"geometry": {
"type": "Point",
"coordinates": [
50.807149,
3.162994
]
}
},
{
"type": "Feature",
"properties": {
"category": "securité",
"Name": "blue"
},
"geometry": {
"type": "Point",
"coordinates": [
50.334421, 3.290146
]
}
}, {
"type": "Feature",
"properties": {
"category": "secretaria",
"Name": "red"
},
"geometry": {
"type": "Point",
"coordinates": [50.744787, 2.256216]
}
}
]
}
var map = L.map('map').setView([-3.337953961416472, 38.320], 4);
var osm=new L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png',{
attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'});
osm.addTo(map);
//Layer
var myLayer = L.geoJSON(internships, {
pointToLayer: function (feature, latlng) {
return L.marker(latlng, );
},
onEachFeature: function (feature, layer) {
layer.bindPopup(feature.properties.Name);
},
filter: function(feature, layer) {
return (feature.properties.category === "secretaria");
}
}).addTo(map);
//END Layer
</script>
</body>
</html>
answered Aug 10 '18 at 12:47
Bill ChappellBill Chappell
2,8261816
I don't need to make a specific marker for each category because I'm going to make them toggeable however I changed my 'var secrétariatLayer' to yours but but the marker doesn't show up
– Victor Lernout
Aug 10 '18 at 13:02
You also had grouplayers but never put the data into the grouplayer. You declared the variables as group layer then re-declared them as layers. You would do something like myGroupLayer.addLayer(myLayer); myGroupLayer.addTo(map);
– Bill Chappell
Aug 10 '18 at 13:55
thank for your help, however how do I apply it for the other coordinates? Do I duplicate the filter for each category possible?
– Victor Lernout
Aug 10 '18 at 18:15
I edited the code to show my layer block, for three layers you should have three copies. You only need to change the layer name for all three layers and the filter condition. If it was 10 layers I might make a function but for three it's easier to duplicate the code.
– Bill Chappell
Aug 10 '18 at 18:29
Sorry to disturb you but your help is really helpful, in case I'll have more categories, and since you're talking about it, how should I make the function?
– Victor Lernout
Aug 10 '18 at 18:45
add a comment |
Your Answer
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "79"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: false,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: null,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fgis.stackexchange.com%2fquestions%2f292391%2fhow-can-i-create-layers-depending-on-a-property%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
0
You're missing the pointToLayer function. Also I checked your GeoJSON and it didn't meet the GeoJSON specs. Look at geojsonlint.com and geojson.io part of it was a data issue
<!DOCTYPE html>
<html>
<head>
<title>Example</title>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.0.3/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.0.3/dist/leaflet.js"></script>
</head>
<body>
<div id="map" style="width: 600px; height: 400px;"></div>
</div>
<script>
var internships = {
"type": "FeatureCollection",
"features": [{
"type": "Feature",
"properties": {
"category": "entretient",
"Name": "green"
},
"geometry": {
"type": "Point",
"coordinates": [
50.807149,
3.162994
]
}
},
{
"type": "Feature",
"properties": {
"category": "securité",
"Name": "blue"
},
"geometry": {
"type": "Point",
"coordinates": [
50.334421, 3.290146
]
}
}, {
"type": "Feature",
"properties": {
"category": "secretaria",
"Name": "red"
},
"geometry": {
"type": "Point",
"coordinates": [50.744787, 2.256216]
}
}
]
}
var map = L.map('map').setView([-3.337953961416472, 38.320], 4);
var osm=new L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png',{
attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'});
osm.addTo(map);
//Layer
var myLayer = L.geoJSON(internships, {
pointToLayer: function (feature, latlng) {
return L.marker(latlng, );
},
onEachFeature: function (feature, layer) {
layer.bindPopup(feature.properties.Name);
},
filter: function(feature, layer) {
return (feature.properties.category === "secretaria");
}
}).addTo(map);
//END Layer
</script>
</body>
</html>
answered Aug 10 '18 at 12:47
Bill ChappellBill Chappell
2,8261816
I don't need to make a specific marker for each category because I'm going to make them toggeable however I changed my 'var secrétariatLayer' to yours but but the marker doesn't show up
– Victor Lernout
Aug 10 '18 at 13:02
You also had grouplayers but never put the data into the grouplayer. You declared the variables as group layer then re-declared them as layers. You would do something like myGroupLayer.addLayer(myLayer); myGroupLayer.addTo(map);
– Bill Chappell
Aug 10 '18 at 13:55
thank for your help, however how do I apply it for the other coordinates? Do I duplicate the filter for each category possible?
– Victor Lernout
Aug 10 '18 at 18:15
I edited the code to show my layer block, for three layers you should have three copies. You only need to change the layer name for all three layers and the filter condition. If it was 10 layers I might make a function but for three it's easier to duplicate the code.
– Bill Chappell
Aug 10 '18 at 18:29
Sorry to disturb you but your help is really helpful, in case I'll have more categories, and since you're talking about it, how should I make the function?
– Victor Lernout
Aug 10 '18 at 18:45
add a comment |
0
You're missing the pointToLayer function. Also I checked your GeoJSON and it didn't meet the GeoJSON specs. Look at geojsonlint.com and geojson.io part of it was a data issue
<!DOCTYPE html>
<html>
<head>
<title>Example</title>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.0.3/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.0.3/dist/leaflet.js"></script>
</head>
<body>
<div id="map" style="width: 600px; height: 400px;"></div>
</div>
<script>
var internships = {
"type": "FeatureCollection",
"features": [{
"type": "Feature",
"properties": {
"category": "entretient",
"Name": "green"
},
"geometry": {
"type": "Point",
"coordinates": [
50.807149,
3.162994
]
}
},
{
"type": "Feature",
"properties": {
"category": "securité",
"Name": "blue"
},
"geometry": {
"type": "Point",
"coordinates": [
50.334421, 3.290146
]
}
}, {
"type": "Feature",
"properties": {
"category": "secretaria",
"Name": "red"
},
"geometry": {
"type": "Point",
"coordinates": [50.744787, 2.256216]
}
}
]
}
var map = L.map('map').setView([-3.337953961416472, 38.320], 4);
var osm=new L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png',{
attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'});
osm.addTo(map);
//Layer
var myLayer = L.geoJSON(internships, {
pointToLayer: function (feature, latlng) {
return L.marker(latlng, );
},
onEachFeature: function (feature, layer) {
layer.bindPopup(feature.properties.Name);
},
filter: function(feature, layer) {
return (feature.properties.category === "secretaria");
}
}).addTo(map);
//END Layer
</script>
</body>
</html>
answered Aug 10 '18 at 12:47
Bill ChappellBill Chappell
2,8261816
I don't need to make a specific marker for each category because I'm going to make them toggeable however I changed my 'var secrétariatLayer' to yours but but the marker doesn't show up
– Victor Lernout
Aug 10 '18 at 13:02
You also had grouplayers but never put the data into the grouplayer. You declared the variables as group layer then re-declared them as layers. You would do something like myGroupLayer.addLayer(myLayer); myGroupLayer.addTo(map);
– Bill Chappell
Aug 10 '18 at 13:55
thank for your help, however how do I apply it for the other coordinates? Do I duplicate the filter for each category possible?
– Victor Lernout
Aug 10 '18 at 18:15
I edited the code to show my layer block, for three layers you should have three copies. You only need to change the layer name for all three layers and the filter condition. If it was 10 layers I might make a function but for three it's easier to duplicate the code.
– Bill Chappell
Aug 10 '18 at 18:29
Sorry to disturb you but your help is really helpful, in case I'll have more categories, and since you're talking about it, how should I make the function?
– Victor Lernout
Aug 10 '18 at 18:45
add a comment |
0
0
0
You're missing the pointToLayer function. Also I checked your GeoJSON and it didn't meet the GeoJSON specs. Look at geojsonlint.com and geojson.io part of it was a data issue
<!DOCTYPE html>
<html>
<head>
<title>Example</title>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.0.3/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.0.3/dist/leaflet.js"></script>
</head>
<body>
<div id="map" style="width: 600px; height: 400px;"></div>
</div>
<script>
var internships = {
"type": "FeatureCollection",
"features": [{
"type": "Feature",
"properties": {
"category": "entretient",
"Name": "green"
},
"geometry": {
"type": "Point",
"coordinates": [
50.807149,
3.162994
]
}
},
{
"type": "Feature",
"properties": {
"category": "securité",
"Name": "blue"
},
"geometry": {
"type": "Point",
"coordinates": [
50.334421, 3.290146
]
}
}, {
"type": "Feature",
"properties": {
"category": "secretaria",
"Name": "red"
},
"geometry": {
"type": "Point",
"coordinates": [50.744787, 2.256216]
}
}
]
}
var map = L.map('map').setView([-3.337953961416472, 38.320], 4);
var osm=new L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png',{
attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'});
osm.addTo(map);
//Layer
var myLayer = L.geoJSON(internships, {
pointToLayer: function (feature, latlng) {
return L.marker(latlng, );
},
onEachFeature: function (feature, layer) {
layer.bindPopup(feature.properties.Name);
},
filter: function(feature, layer) {
return (feature.properties.category === "secretaria");
}
}).addTo(map);
//END Layer
</script>
</body>
</html>
answered Aug 10 '18 at 12:47
Bill ChappellBill Chappell
2,8261816
You're missing the pointToLayer function. Also I checked your GeoJSON and it didn't meet the GeoJSON specs. Look at geojsonlint.com and geojson.io part of it was a data issue
<!DOCTYPE html>
<html>
<head>
<title>Example</title>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.0.3/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.0.3/dist/leaflet.js"></script>
</head>
<body>
<div id="map" style="width: 600px; height: 400px;"></div>
</div>
<script>
var internships = {
"type": "FeatureCollection",
"features": [{
"type": "Feature",
"properties": {
"category": "entretient",
"Name": "green"
},
"geometry": {
"type": "Point",
"coordinates": [
50.807149,
3.162994
]
}
},
{
"type": "Feature",
"properties": {
"category": "securité",
"Name": "blue"
},
"geometry": {
"type": "Point",
"coordinates": [
50.334421, 3.290146
]
}
}, {
"type": "Feature",
"properties": {
"category": "secretaria",
"Name": "red"
},
"geometry": {
"type": "Point",
"coordinates": [50.744787, 2.256216]
}
}
]
}
var map = L.map('map').setView([-3.337953961416472, 38.320], 4);
var osm=new L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png',{
attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'});
osm.addTo(map);
//Layer
var myLayer = L.geoJSON(internships, {
pointToLayer: function (feature, latlng) {
return L.marker(latlng, );
},
onEachFeature: function (feature, layer) {
layer.bindPopup(feature.properties.Name);
},
filter: function(feature, layer) {
return (feature.properties.category === "secretaria");
}
}).addTo(map);
//END Layer
</script>
</body>
</html>
answered Aug 10 '18 at 12:47
Bill ChappellBill Chappell
2,8261816
edited Aug 10 '18 at 18:24
answered Aug 10 '18 at 12:47
Bill ChappellBill Chappell
2,8261816
answered Aug 10 '18 at 12:47
Bill ChappellBill Chappell
2,8261816
answered Aug 10 '18 at 12:47
Bill ChappellBill Chappell
2,8261816
2,8261816
I don't need to make a specific marker for each category because I'm going to make them toggeable however I changed my 'var secrétariatLayer' to yours but but the marker doesn't show up
– Victor Lernout
Aug 10 '18 at 13:02
You also had grouplayers but never put the data into the grouplayer. You declared the variables as group layer then re-declared them as layers. You would do something like myGroupLayer.addLayer(myLayer); myGroupLayer.addTo(map);
– Bill Chappell
Aug 10 '18 at 13:55
thank for your help, however how do I apply it for the other coordinates? Do I duplicate the filter for each category possible?
– Victor Lernout
Aug 10 '18 at 18:15
I edited the code to show my layer block, for three layers you should have three copies. You only need to change the layer name for all three layers and the filter condition. If it was 10 layers I might make a function but for three it's easier to duplicate the code.
– Bill Chappell
Aug 10 '18 at 18:29
Sorry to disturb you but your help is really helpful, in case I'll have more categories, and since you're talking about it, how should I make the function?
– Victor Lernout
Aug 10 '18 at 18:45
add a comment |
I don't need to make a specific marker for each category because I'm going to make them toggeable however I changed my 'var secrétariatLayer' to yours but but the marker doesn't show up
– Victor Lernout
Aug 10 '18 at 13:02
You also had grouplayers but never put the data into the grouplayer. You declared the variables as group layer then re-declared them as layers. You would do something like myGroupLayer.addLayer(myLayer); myGroupLayer.addTo(map);
– Bill Chappell
Aug 10 '18 at 13:55
thank for your help, however how do I apply it for the other coordinates? Do I duplicate the filter for each category possible?
– Victor Lernout
Aug 10 '18 at 18:15
I edited the code to show my layer block, for three layers you should have three copies. You only need to change the layer name for all three layers and the filter condition. If it was 10 layers I might make a function but for three it's easier to duplicate the code.
– Bill Chappell
Aug 10 '18 at 18:29
Sorry to disturb you but your help is really helpful, in case I'll have more categories, and since you're talking about it, how should I make the function?
– Victor Lernout
Aug 10 '18 at 18:45
I don't need to make a specific marker for each category because I'm going to make them toggeable however I changed my 'var secrétariatLayer' to yours but but the marker doesn't show up
– Victor Lernout
Aug 10 '18 at 13:02
I don't need to make a specific marker for each category because I'm going to make them toggeable however I changed my 'var secrétariatLayer' to yours but but the marker doesn't show up
– Victor Lernout
Aug 10 '18 at 13:02
You also had grouplayers but never put the data into the grouplayer. You declared the variables as group layer then re-declared them as layers. You would do something like myGroupLayer.addLayer(myLayer); myGroupLayer.addTo(map);
– Bill Chappell
Aug 10 '18 at 13:55
You also had grouplayers but never put the data into the grouplayer. You declared the variables as group layer then re-declared them as layers. You would do something like myGroupLayer.addLayer(myLayer); myGroupLayer.addTo(map);
– Bill Chappell
Aug 10 '18 at 13:55
thank for your help, however how do I apply it for the other coordinates? Do I duplicate the filter for each category possible?
– Victor Lernout
Aug 10 '18 at 18:15
thank for your help, however how do I apply it for the other coordinates? Do I duplicate the filter for each category possible?
– Victor Lernout
Aug 10 '18 at 18:15
I edited the code to show my layer block, for three layers you should have three copies. You only need to change the layer name for all three layers and the filter condition. If it was 10 layers I might make a function but for three it's easier to duplicate the code.
– Bill Chappell
Aug 10 '18 at 18:29
I edited the code to show my layer block, for three layers you should have three copies. You only need to change the layer name for all three layers and the filter condition. If it was 10 layers I might make a function but for three it's easier to duplicate the code.
– Bill Chappell
Aug 10 '18 at 18:29
Sorry to disturb you but your help is really helpful, in case I'll have more categories, and since you're talking about it, how should I make the function?
– Victor Lernout
Aug 10 '18 at 18:45
Sorry to disturb you but your help is really helpful, in case I'll have more categories, and since you're talking about it, how should I make the function?
– Victor Lernout
Aug 10 '18 at 18:45
add a comment |
draft saved
draft discarded
Thanks for contributing an answer to Geographic Information Systems Stack Exchange!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fgis.stackexchange.com%2fquestions%2f292391%2fhow-can-i-create-layers-depending-on-a-property%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
