WedX - журнал о программировании и компьютерных науках

Установить стиль для геометрии в типе GeometryCollection с помощью Leaflet

Я работаю в веб-системе ГИС, где у клиентов есть много слоев (иногда перекрывающих друг друга), они могут добавлять / редактировать / удалять геометрию элементов или свойства из какого-либо слоя. В back-end система на 100% основана на restful api и имеет сложную структуру администрирования. Каждый слой имеет 4 таблицы (1 для свойств, 1 для геометрии, 1 для динамических данных и 1 таблица отношений с другими атрибутами службы, такими как настраиваемый тип, дата создания, изменение даты, активность и т. Д.). Слои сохраняются на разных серверах. БД - это MySQL и PostgreSQL (PostGIS) и MySQL. Когда мы начинаем этот проект, мы соглашаемся разрешить только геометрию одного типа в слое, например точку, многоугольник и т. Д., Но теперь я должен создать функциональность, в которой клиенты могут работать со многими типами в 1 слое, но это не проблема. Настоящая проблема заключается в том, что система должна поддерживать тип GeometryCollection и должна стилизовать каждую геометрию в GeometryCollection.

Когда я использую такую ​​функцию:

layer.setStyle(some_style_object);

Это работает для полигонов и мультиполигонов, но затем я пытаюсь использовать функцию для стилизации значка следующим образом:

layer.setIcon(some_style_object);

Это дает мне такую ​​ошибку:

Uncaught TypeError: layer.setIcon is not a function at Object.onEachFeature

GeometryCollection выглядит так:

{
"type":"Feature","properties":{
"id":"143","DistrictID":"12145","DistrictName":"ЗОНА Б-5","DistrictTypeID":"2","SubcontractorDescription":null,"DispEmpID":"23974","SubstDispEmpID":"21976","CompanyRepEmpID":"22487","TitulCourierEmpID":"20750","TitulCourierEmpName":null,"NearByOfficeID":null,"AreaOfficeID":"110","OfficeID":"142","OfficeName":"BOZHURISHTE","DispEmpName":null,"label":null,"notes":null,"style":"#FFFF00","worker_elements":"a:2:{i:36;a:3:{i:0;i:100036000004686;i:1;i:100036000004688;i:2;i:100036000004689;}i:43;a:3:{i:3;i:100043000000154;i:4;i:100043000000160;i:5;i:100043000000187;}}","attributes_id":"143","geometry_id":"143","type_id":"64","active":"1","createdID":"2","editedID":null,"DateFrom":"2020-09-18 18:08:17","DateTo":null,"BrickID":"100042000000143","dinamic_attributes":{"id":null,"PICKUP_WAYBILLS_COUNT":null,"PICKUP_VISITS_COUNT":null,"PICKUP_COURIERPAYMENT":null,"PICKUP_TOTALINCOME":null,"PICKUP_CALCULATIONWEIGHT":null,"DELIVERY_WAYBILLS_COUNT":null,"DELIVERY_VISITS_COUNT":null,"DELIVERY_COURIERPAYMENT":null,"DELIVERY_TOTALINCOME":null,"DELIVERY_CALCULATIONWEIGHT":null},"layer_id":"42","custom_label":null},
"geometry":{
"type":"GeometryCollection",
"geometries":[
{"type":"Point","coordinates":[23.30802,42.699269]},
{"type":"Point","coordinates":[23.308673,42.698213]},
{"type":"Polygon","coordinates":[[[23.306886,42.698974],[23.307783,42.698843],[23.307511,42.697892],[23.30942,42.697617],[23.309143,42.696712],[23.308979,42.696177],[23.30757,42.696396],[23.307074,42.696472],[23.306153,42.696618],[23.305797,42.69667],[23.305268,42.696749],[23.305194,42.69648],[23.305081,42.696072],[23.304812,42.695107],[23.304593,42.694318],[23.304384,42.693726],[23.304224,42.693922],[23.303618,42.694326],[23.303328,42.694507],[23.302789,42.69485],[23.302718,42.694937],[23.302629,42.695249],[23.302477,42.695856],[23.302316,42.696499],[23.302418,42.696873],[23.302644,42.697745],[23.302289,42.697802],[23.302103,42.697833],[23.302199,42.697907],[23.302425,42.698126],[23.302548,42.69828],[23.302655,42.698464],[23.302723,42.698636],[23.30285,42.699098],[23.302997,42.699581],[23.303157,42.699555],[23.304115,42.699405],[23.305478,42.699199],[23.305966,42.699125],[23.306886,42.698974]]]},
{"type":"Point","coordinates":[23.304481,42.700175]}
]
}
}

Решение, в котором я конвертирую GeometryCollection в точки, многоугольники и т. Д., Не работает, потому что у них есть одно свойство. Есть ли у него простой и понятный способ стилизации геометрии GeometryCollection без сложной работы по разделению геометрии для визуализации, а затем соединению их вместе.


Ответы:


1

используйте параметр pointToLayer для стилизации маркеров:

geoGroup = L.geoJson(json,{
    style: {
        "color": "#ff7800",
        "weight": 5,
        "opacity": 0.65
    },
    pointToLayer: function(geoJsonPoint, latlng) {
        return L.marker(latlng, {icon: L.icon({iconUrl: 'https://leafletjs.com/examples/custom-icons/leaf-orange.png'})});
    }
}).addTo(map)
24.09.2020
  • Спасибо, но в моем случае это не сработает, потому что у меня много разных типов геометрии в одном geojson. 02.10.2020

  • 2

    Наконец я нашел решение. Я определяю тип геометрии, и если тип геометрии - GeometryCollection, я использую функцию eachLayer для стилизации всех слоев. Затем, если у слоя есть _latlng, я устанавливаю значок, если не делаю другой. Надеюсь, это поможет кому-то вроде меня. Других решений в сети не нашел.

    var layers_tmp = new L.FeatureGroup();
    L.geoJson(data, {
        onEachFeature: function (features, layer){
            if(layer.feature.geometry.type == 'Polygon' || layer.feature.geometry.type == 'MultiPolygon'){                                            
                var t_style = {
                    "weight":'3',
                    "opacity":'1',
                    "color":"#fcba03",
                    "fillOpacity":'0.5',
                    "fillColor":"#fcba03"
                }   
                layer.setStyle(t_style);
            }
            else if(layer.feature.geometry.type == 'Point'){                                    
                var ico = L.icon({
                    iconUrl: 'https://api2.datamap.bg/images/blue_icon.png',
                    iconSize: [25, 25],
                    iconAnchor: [15, 15],
                    popupAnchor: [-10, -10]
                });                                       
                layer.setIcon(ico);                                      
            }  
            else if(layer.feature.geometry.type == 'GeometryCollection'){ 
                layer.eachLayer(function(layer_GeometryCollection){  
                    if(layer_GeometryCollection._latlng){
                        var ico = L.icon({
                            iconUrl: 'https://api2.datamap.bg/images/blue_icon.png',
                            iconSize: [25, 25],
                            iconAnchor: [15, 15],
                            popupAnchor: [-10, -10]
                        });                                          
                        layer_GeometryCollection.setIcon(ico);
                    }
                    else{                                          
                        var t_style = {
                            "weight":'3',
                            "opacity":'1',
                            "color":"#fcba03",
                            "fillOpacity":'0.5',
                            "fillColor":"#fcba03"
                        }   
                        layer.setStyle(t_style);
                    }
                });                                          
            }           
            layers_tmp.addLayer(layer);                                
        }
    });                     
    layers_tmp.addTo(mymap);
    
    02.10.2020
    Новые материалы

    Как проанализировать работу вашего классификатора?
    Не всегда просто знать, какие показатели использовать С развитием глубокого обучения все больше и больше людей учатся обучать свой первый классификатор. Но как только вы закончите..

    Работа с цепями Маркова, часть 4 (Машинное обучение)
    Нелинейные цепи Маркова с агрегатором и их приложения (arXiv) Автор : Бар Лайт Аннотация: Изучаются свойства подкласса случайных процессов, называемых дискретными нелинейными цепями Маркова..

    Crazy Laravel Livewire упростил мне создание электронной коммерции (панель администратора и API) [Часть 3]
    Как вы сегодня, ребята? В этой части мы создадим CRUD для данных о продукте. Думаю, в этой части я не буду слишком много делиться теорией, но чаще буду делиться своим кодом. Потому что..

    Использование машинного обучения и Python для классификации 1000 сезонов новичков MLB Hitter
    Чему может научиться машина, глядя на сезоны новичков 1000 игроков MLB? Это то, что исследует это приложение. В этом процессе мы будем использовать неконтролируемое обучение, чтобы..

    Учебные заметки: создание моего первого пакета Node.js
    Это мои обучающие заметки, когда я научился создавать свой самый первый пакет Node.js, распространяемый через npm. Оглавление Глоссарий I. Новый пакет 1.1 советы по инициализации..

    Забудьте о Matplotlib: улучшите визуализацию данных с помощью умопомрачительных функций Seaborn!
    Примечание. Эта запись в блоге предполагает базовое знакомство с Python и концепциями анализа данных. Привет, энтузиасты данных! Добро пожаловать в мой блог, где я расскажу о невероятных..

    ИИ в аэрокосмической отрасли
    Каждый полет – это шаг вперед к великой мечте. Чтобы это происходило в их собственном темпе, необходима команда астронавтов для погони за космосом и команда технического обслуживания..


    Для любых предложений по сайту: [email protected]