Leaflet: أضف القدرة على تعيين أنماط css على DivIcon

مرحبا،
ماذا يعني لون الايقونة؟ قمت بتعيين لون الخلفية في css وقام DivIcon بتغيير اللون

أليس هذا ما تحتاجه؟ هل يمكنك رجاء أن تكون أكثر تحديدا؟

مرحبا @ samik88 ،

كما حددت في حالة الاستخدام ، يتم استرداد اللون (رمز لون RGB) لرمز العلامة من قاعدة بيانات بإحداثيات العلامة ، لذلك لا يمكن تحديده في فئة css (للقيام بذلك ، سيتضمن إنشاء 16777215 فئات css (واحدة لكل رمز لوني rgb لا تشمل العتامة) ، وهو أمر غبي القيام به).

يمكنك تغيير المثال الخاص بك لرؤية حالة الاستخدام عن طريق إضافة حقل نص يمكنك إدخال لون rgb للعلامة وبعد ذلك ستجد أنه لا يمكنك تعيين ذلك على DivIcon وبالتالي لا يمكنك تغيير لون رمز العلامة.

قد يتطلب القيام بذلك أن تكون قادرًا على تعيين سمة نمط css على عنصر DIV الذي تم إنشاؤه

يمكن تغطية هذه الوظيفة بطريقة getElement() L.Marker ، على سبيل المثال:

var marker = new L.Marker(myCenter, {
  icon: L.divIcon()
});
map.addLayer(marker);

marker.getElement().style.border = '5px dotted lime';
marker.getElement().style.width = '50px';
marker.getElement().style.height = '50px';

انظر إلى مثال عملي .

هذه حالة مميزة نوعًا ما ، لذا أوصي بتمديد فئة L.DivIcon لإضافة بعض التصميم المخصص ، اقرأ البرامج التعليمية حول كتابة المكونات الإضافية. سيكون شيئا مثل

L.DivIcon.CustomColor = L.DivIcon.extend({
    createIcon: function(oldIcon) {
           var icon = L.DivIcon.prototype.createIcon.call(this, oldIcon);
           icon.style.backgroundColor = this.options.color;
           return icon;
    }
})

أنا شخصياً لا أعتقد أن هذه ستكون ميزة مستخدمة على نطاق واسع ، لذلك سأغلق هذا الآن.