Daha çox

Leaflet + GeoJson = stil ilə problem


İlk broşuramı + geojson layihəmi qismən işləyirdim! (geojson faylından məzmunu olan popup belə!)

amma üslubla bağlı hələ bir problemim var

geojson (mapbox-dan ixrac) faylı kimi sahələr daxil olmaqla nöqtə, çoxbucaqlı və sdoldurun,doldurma = qeyri-şəffaflıqvə s

Layihəmdə bu üslubu standart üslubdan (mavi) başqa bir şəkildə istifadə etmək istərdim

Kimsə vərəqə xəritəmdəki geojson faylı içindəki stil sahələrini necə istifadə edəcəyimi mənə bir istiqamət verə bilərmi?

Geojson faylının bir hissəsi:

var items = {"type": "FeatureCollection", "features": [{"type": "Feature", "properties": {"id": "marker-icgis1jl1", "title": "De Bostoren", "description": "40 metr hoog, lees meer", "marker-size": "orta", "marker-color": "# 1087bf", "marker-symbol": "monument"}, "həndəsə": { "koordinatlar": [5.628132,52.249322], "type": "Point"}, "id": "2011ff2da55dd4d1f6d8b252674517a7"}, {"type": "Feature", "properties": {"title": "Josinapark", "description": "1929", "id": "marker-icgj3dk57", "stroke": "# a3e46b", "stroke-width": 4, "stroke-opacity": 1, "fill": "# a3e46b "," fill-opacity ": 0.6000000238418579}," həndəsə ": {" koordinatlar ": [[[5.625464,52.251564], [5.624924,52.251493], [5.625308,52.251068], [5.625099,52.25093], [5.6258) ], [5.625195,52.250559], [5.625455,52.25051], [5.626019,52.250646], [5.625826,52.251158], [5.625885,52.251405], [5.625464,52.251564]]], "type": "Polyg" id ":" 2e8117fd2199faacbc43bf022884507b "}, {" type ":" Feature "," properties ": {" id ":" marker-id21rbbg3 "," title ":" "," description ":" "," marker size ":" orta "," marker-color ":" # 10 87bf "," marker-symbol ":" 5 "}," həndəsə ": {" koordinatlar ": [5.627043,52.247792]," type ":" Point "}," id ":" 3cb601aa00b4514f831bddc5c66ef045 "}, {" type ":" Xüsusiyyət "," xassələr ": {" title ":" Bomenwandeling "," description ":" "," stroke ":" # 008000 "," stroke-width ": 5," stroke-opacity ": 1 }, "həndəsə": {"koordinatlar": [[5.626421,52.252968], [5.626582,52.253657], [5.62677,52.253717], [5.626882,52.253145], [5.627301,52.253007], [5.627751,52.252982] , 52.253188], [5.62781,52.253398], [5.627784,52.253526], [5.627607,52.253634], [5.627269,52.253713], [5.62707,52.253868], [5.626652,52.253956], 5.565, 5.260, 5.260 ], [5.625689,52.254086], [5.625683,52.253864], [5.625622,52.253744], [5.625726,52.253296], [5.626453,52.253157], [5.62641,52.252969], [5.625237.52, 5.625237,52.256.25 [5.623953,52.253004], [5.623291,52.252625], [5.624831,52.252027], [5.625067,52.252053], [5.625445,52.251933], [5.62516,52.251694], [5.625203,52.25655, 256, 5.56, 256, 156 , 52.25103], [5.625128,52.250951], [5.624989,52.250728], [5 .62519,52.250534], [5.625225,52.250286], [5.625311,52.250101], [5.626711,52.249477], [5.626861,52.249326], [5.626936,52.249073], [5.627526,52.249181], [5.363 , 52.249503], [5.62817,52.249861], [5.628175,52.250091], [5.628567,52.250961], [5.628787,52.250764], [5.630766,52.250242], [5.630841,52.250144], [5.22357, 5.2633,57, 5,263,35 ], [5.63222,52.251441], [5.632091,52.251529], [5.631689,52.251618], [5.630058,52.251966], [5.628932,52.252042], [5.628524,52.252029], [5.628261,52.251, 522, 522, 582 [5.628256,52.251378], [5.627467,52.251644], [5.627864,52.252081], [5.628004,52.25237], [5.62779,52.252516], [5.627586,52.252628], [5.627655,52.2526], 5.627655,52.252678, type ":" LineString "}," id ":" 3e98e30887b4b75f27f987d79303e0be "}, {" type ":" Feature "," properties ": {" id ":" marker-icgjnwtqb "," title ":" Museum (De Tien) Malen) "," description ":" Muzey De Tien Malen, əvvəlcədən tarixə qoyulmuş və ya əvvəlcədən tarixə qoyulmuşdur. "," Marker-size ":" orta "," marker-color ":" # 1087bf "," marker-symbol ":" m "}," həndəsə ": {" koordinatlar ": [5.626333,52.251787]," type ":" Point "}," id ":" 408bc766465244a510209d3af55f5712 "}, {" type ":" Feature "," properties ": {" id ":" marker-icgivrzl5 "," title ":" De Werkstee "," description ":" De Werkstee çox yaxşıdır Əlavə məlumat üçün açıq qapı ilə açıq qapı və ya açıq balansla tanış ola bilərsiniz. lees meer "," marker-size ":" orta "," marker-color ":" # 1087bf "," marker-symbol ":" w "}," həndəsə ": {" koordinatlar ": [5.627735,52.251369] , "type": "Point"}, "id": "4ddd0901102c2caba84235d739bb654c"}, {"type": "Feature", "properties": {"id": "marker-id22srxq0", "title": "Driecontinentenbos" , "description": "150 hektar ərazidə torpaq satıldı. Hec Driecontinentenbos ildə Azië, Amerika Birləşmiş Ştatları və Avropa üçün konifer. lees meer "," marker-size ":" orta "," marker-color ":" # 1087bf "," marker-symbol ":" b "}," həndəsə ": {" koordinatlar ": [5.633797,52.246288] , "type": "Point"}, "id": "54f2d0363c4fd899435bcaea03bd1322"}, {"type": "Feature", "properties": {"title": "Dendrarium", "description": "In de wat wat ruimer opgezette bomentuin loopt u zachte graspaden tussen groene 'continenten' qapısı. lees meer "," id ":" marker-icgj7gin8 "," stroke ":" # a3e46b "," stroke-width ": 4," stroke-opacity ": 1," fill ":" # a3e46b "," fill -opasite ": 0.6000000238418579}," həndəsə ": {" koordinatlar ": [[[5.63008,52.252002], [5.631984,52.251595], [5.632359,52.251464], [5.632327,52.250899], [5.632016,52.250318], , 52.250098], [5.630954,52.250052], [5.630922,52.25006], [5.630718,52.250114], [5.630085,52.250304], [5.629591,52.250452], [5.629012,52.250643], [5.2281, [5.6288], [5.6288] ], [5.628143,52.251391], [5.628046,52.251828], [5.628492,52.252114], [5.63008,52.252002]]], "type": "Polygon"}, "id": "6c5a2732dbb38f014f9e9b8 "ac, : "Xüsusiyyət", "xassələr": {"id": "marker-id21yy0p7", "başlıq": "Josina park", "təsvir": "Schovenhorst, torpaqdan kənarlaşmağı bacarmışlar. Josinapark. Het park 1929-cu ildə beplant edildi. lees meer "," marker-size ":" orta "," marker-color ":" # 1087bf "," marker-symbol ":" 3 "}," həndəsə ": {" koordinatlar ": [5.625579,52.250997] , "type": "Point"}, "id": "7b62c384a7ca41e99121ba6f06393f3f"}, {"type": "Feature", "properties": {"id": "marker-id21ym8j6", "title": "Kleine Pinetum "," description ":" Hier begon cənab. 1848-ci ildə Schober zijn proeftuin en boomkwekerij. Een aantal bomen dat toen aangeplantdır, 160 il ərzində 40 metr uzunluğundadır. lees meer "," marker-size ":" orta "," marker-color ":" # 1087bf "," marker-symbol ":" 1 "}," həndəsə ": {" koordinatlar ": [5.627639,52.252127] , "type": "Point"}, "id": "878b894c9c59cc670e329f1315ef17aa"}, {"type": "Feature", "properties": {"id": "marker-id21jly20", "title": "Het Speelbos "," description ":" Hutten bouwen, ravotten en klauteren: het kan allemaal in het Speelbos. lees meer "," marker-size ":" orta "," marker-color ":" # 1087bf "," marker-symbol ":" oyun meydançası "}," həndəsə ": {" koordinatlar ": [5.634098,52.250452] , "type": "Point"}, "id": "8937452b8f8f184031878dd2687e771f"}, {"type": "Feature", "properties": {"title": "", "description": "", "stroke" : "# 1087bf", "stroke-width": 4, "stroke-opacity": 1, "fill": "# 1087bf", "fill-opacity": 0.20000000298023224}, "həndəsə": {"koordinatlar": [ [[5.633025,52.248942], [5.634613,52.249717], [5.632166,52.250347], [5.631415,52.249533], [5.633025,52.248942]]], "type": "Polygon"}, "id": "8a18d375fe6eb6e17b12a , {"type": "Feature", "properties": {"title": "Grote Pinetum", "description": "Het Grote Pinetum werd ingericht omdat er geen plek meer was het Kleine Pinetum. 2004-cü ildə 'De Verborgen Tuin' filmində hər şeydən çox istifadə olunur. lees meer "," id ":" marker-icgipkwu0 "," stroke ":" # a3e46b "," stroke-width ": 4," stroke-opacity ": 1," fill ":" # a3e46b "," fill -opasite ": 0.4000000059604645}," həndəsə ": {" koordinatlar ": [[[5.625316,52.253812], [5.625091,52.254557], [5.628046,52.253703], [5.627982,52.252666], [5.625215, 5.525256,5 , 52.253812]]], "type": "Polygon"}, "id": "8b45212e414a007c3bef3e004b59cfb3"}, {"type": "Feature", "properties": {"title": "", "description": " "," stroke ":" # a3e46b "," stroke-width ": 4," stroke-opacity ": 1," fill ":" # 3ca0d3 "," fill-opacity ": 0.20000000298023224}," həndəsə ": { "koordinatlar": [[[5.634806,52.249756], [5.636951,52.250833], [5.632896,52.251595], [5.632209,52.250373], [5.634806,52.249756]]], "type": "Polygon"}, "id" : "8bd921c09ee661a40b0108a8e14f592a"}, {"type": "Feature", "properties": {"id": "marker-id21xscy5", "title": "Dendraria", "description": "In deze wat ruimer opgezette bomentuin loopt zachte graspaden tussen groene 'continenten' qapısı üzərində. lees meer "," marker-size ":" orta "," marker-color ":" # 1087bf "," marker-symbol ":" 4 "}," həndəsə ": {" koordinatlar ": [5.630214,52.251188] , "type": "Point"}, "id": "92a06a1a933498a6d0041d7f8f48ef68"}, {"type": "Feature", "properties": {"id": "marker-icgiv56c4", "title": "Het Koetshuis "," description ":" Het Koetshuis, Putten gemeente van trouwlocatie van trouwlocatie van ook yeen officiele trouwlocatie van de. lees meer "," marker-size ":" orta "," marker-color ":" # 1087bf "," marker-symbol ":" k "}," həndəsə ": {" koordinatlar ": [5.626459,52.252278] , "type": "Point"}, "id": "a20a8298e08b8523be7610313d1483ca"}, {"type": "Feature", "properties": {"id": "marker-id20tceq0", "title": "Gratis Parkeren "," description ":" Parkeren op Landgoed Schovenhorst lees meer "," marker-size ":" orta "," marker-color ":" # 1087bf "," marker-symbol ":" car "}," həndəsə " : {"koordinatlar": [5.632842,52.249572], "type": "Point"}, "id": "a5e67eb715cf7d4065322469cf67f3fe"}, {"type": "Feature", "properties": {"title": "Cultuurhistorische wandeling "," description ":" "," id ":" marker-ici2qx8t0 "," stroke ":" # f86767 "," stroke-width ": 5," stroke-opacity ": 1}," həndəsə ": {"koordinatlar": [[5.62765,52.252705], [5.627526,52.252575], [5.626909,52.251976], [5.626341,52.251375]

Geojsonunuzun necə qurulduğundan əmin deyiləm, ammastilL.geoJson-dakı arqument, hər bir xüsusiyyət üçün üslublar təyin etməyə imkan verir.

Bu nümunədən:

L.geoJson (dövlətlər, {stil: function (feature) {switch (feature.properties.party) {case 'Republic': return {color: "# ff0000"}; case 'Democracy': return {color: "# 0000ff "};}}}). addTo (xəritə);

Sizin halda belə bir şey:

L.geoJson (data, {style: function (feature) {return {fillColor: feature.properties ['fill'], fillOpacity: feature.properties ['fill-opacity'], color: feature.properties ['stroke'] , width: feature.properties ['stroke-width'], qeyri-şəffaflıq: feature.properties ['opacity']};}}). addTo (map);