फ़ंक्शन से खींचे गए मार्कर दिखाएं / छुपाएं - जावास्क्रिप्ट, jquery, css, पुस्तिका

मैं पुस्तिका का उपयोग कर रहा हूं और इस फ़ंक्शन से खींचे गए मार्कर को दिखाना / छिपाना चाहता हूं:

function showResourcesByName(name) {
for (var i = 0; i < markers.resources.length; i++) {
var resName = markers.resources[i].name;

if (resName == name) {
var resIcon = icons.resources[i].icon;
var resSize = icons.resources[i].size;
var resPname = icons.resources[i].pname;

var customIcon = L.icon({
iconUrl: resIcon,
iconSize: resSize, // size of the icon
iconAnchor:   [resSize[0]/2, resSize[1]/2], // point of the icon which will correspond to marker"s location
popupAnchor:  [2, -resSize[1]/2] // point from which the popup should open relative to the iconAnchor
});

for (var j = 0; j < markers.resources[i].coords.length; j++) {
var x = markers.resources[i].coords[j].x;
var y = markers.resources[i].coords[j].y;

L.marker([y, x], {icon: customIcon}).addTo(map).bindPopup(resPname);
}
}
}
}

यह एक जेसन फ़ाइल से मार्कर आउटपुट करता है। मैं उपयोग करने वाले मार्कर दिखाने के लिए: showResourcesByName("NameOfTheMarkersHere")

मेरे पास कुछ विचार हैं कि यह कैसे किया जा सकता है, लेकिन मुझे नहीं पता कि इसे कैसे काम करना है।

आइडिया # 1: फ़ंक्शन परिणाम में एक सीएसएस क्लास जोड़ें, इसलिए उस फ़ंक्शन से खींचे गए सभी मार्करों में उस सीएसएस क्लास होगा, इसलिए मैं उन्हें जावास्क्रिप्ट / सीएसएस का उपयोग करके चालू / बंद कर सकता हूं।

आइडिया # 2: बटन में फ़ंक्शन परिणाम "चालू / बंद" टॉगल करने का एक तरीका जोड़ें।

आइडिया # 3: फ़ंक्शन परिणाम को एक लीफलेट परत के अंदर रखें और उस परत को उस बटन को चालू / बंद करें।

आइडिया # 4: मार्कर गुणों में एक संपत्ति जोड़ें जिसे फ़ंक्शन का उपयोग करते समय बटन के साथ फ़िल्टर किया जा सकता है।

कृपया, उत्तर से पहले मेरे कोड पर एक नज़र डालें:

http://plnkr.co/edit/dVgHt4VK0DnA30M3a8vq?p=preview

उत्तर:

उत्तर № 1 के लिए 1

तो इस तरह मैंने मार्करों को कक्षा भी जोड़ा।

marker = L.marker([y, x], {icon:customIcon}).addTo(map).bindPopup(resPname);

$(marker._icon).addClass("randomClass");

काम करने के लिए अपने कोड में jquery शामिल करना न भूलें

यहाँ मेरा कामकाजी plunger है http://plnkr.co/edit/jVyvnNNvIzJqEn7Hm7S6?p=preview


संबंधित सवाल
सबसे लोकप्रिय