أكثر

ترقيم الكتلة في OpenLayers؟

ترقيم الكتلة في OpenLayers؟


أنا أستخدم OpenLayers 2 لتكوين مجموعات على بيانات نقطة المتجه التي أنا مبتدئ فيها. لقد قمت بتثبيت GeoServer محليًا عبر مجموعة opengeo واستخدام مجموعة بيانات "world_cities" كمثال. لقد تمكنت من تنفيذ استراتيجية كتلة بسيطة. الآن أريد عرض أرقام العد في كل مجموعة. على سبيل المثال ، عندما أبدأ في التكبير ، يجب أن تعرض المجموعة الكبيرة عدد نقاط العناصر الموجودة بداخلها. ثم عندما أقوم بالتكبير أكثر ، سوف تنهار الكتلة الكبيرة وتظهر في نفس الوقت أنها ستعرض العدد المخفض من النقاط بشكل كبير وحتى تصبح 1.

هذا هو الكود الخاص بي.

في أي موضع يجب أن أضع طريقة / قاعدة أخرى لإنجاز ترقيم الموظفين؟

var style = new OpenLayers.Style ({pointRadius: "$ {radius}"، fillColor: "# FF3300"، fillOpacity: 0.8، strokeColor: "# 66FF00"، strokeWidth: "$ {width}"، strokeOpacity: 0.8} ، {السياق: {width: function (feature) {return (feature.cluster)؟ 2: 1؛}، radius: function (feature) {var pix = 2؛ if (feature.cluster) {pix = Math.min (feature .attributes.count، 7) + 2؛} return pix؛}}}) ؛ var wfs_layer2 = new OpenLayers.Layer.Vector ("world_cities"، {Strategies: [new OpenLayers.Strategy.BBOX ()]، Protocol: new OpenLayers.Protocol.WFS ({version: "1.1.0"، url: "http : // localhost: 8081 / geoserver / wfs "، featureNS:" http://world.opengeo.org "، featureType:" Cities "،}) ، الاستراتيجيات: [new OpenLayers.Strategy.Fixed () ، OpenLayers جديد. Strategy.Cluster ({Distance: 30})]، styleMap: new OpenLayers.StyleMap ({"default": style، "select": {fillColor: "# 8aeeef"، strokeColor: "# 32a8a9"}})

});


لإضافة تسمية إلى النقاط المجمعة الخاصة بك عندما تحتوي على أكثر من ميزة واحدة ، يجب عليك تعديل النمط الخاص بك:

var style = new OpenLayers.Style ({pointRadius: "$ {radius}"، fillColor: "# FF3300"، fillOpacity: 0.8، strokeColor: "# 66FF00"، strokeWidth: "$ {width}"، strokeOpacity: 0.8، label : "$ {getLabel}"، fontSize: "12px"، fontFamily: "Courier New، monospace"، fontWeight: "bold"، labelOutlineColor: "white"، labelOutlineWidth: 2.5}، {Context: {width: function (feature) {return (feature.cluster)؟ 2: 1؛}، radius: function (feature) {var pix = 2؛ if (feature.cluster) {pix = Math.min (feature.attributes.count، 7) + 2؛ } return pix؛}، getLabel: function (feature) {if (feature.cluster) {if (feature.cluster.length> 1) {return feature.cluster.length؛}} return "؛}}})؛

إذا كنت تريد عرض الملصقات على مستويات تكبير معينة فقط ، فيمكنك إضافة بعض الشروط باستخدام map.getZoom () طريقة.


شاهد الفيديو: OpenLayers Introduction for Beginners