zooming - Openlayers 放大集群

标签 zooming cluster-computing openlayers

是否可以通过点击放大集群?我也不知道如何禁用集群弹出窗口。我读过this question ,但仍然不知道该怎么做。 这是代码:

<html>

<script src="../ol/OpenLayers.js"></script>

<script>
var map, select;
var lat = 53.507;
var lon = 28.145;
var zoom = 7;


function init() {
map = new OpenLayers.Map("map",
        { maxExtent: new OpenLayers.Bounds(-20037508.34,-20037508.34,20037508.34,20037508.34),
                  numZoomLevels: 19,
                  maxResolution: 156543.0399,
                  units: 'm',
                  projection: new OpenLayers.Projection("EPSG:900913"),
                  displayProjection: new OpenLayers.Projection("EPSG:4326"),
                controls: [
                    new OpenLayers.Control.Navigation(),
                    new OpenLayers.Control.PanZoomBar(),
                    new OpenLayers.Control.ScaleLine(),
                    new OpenLayers.Control.Permalink('permalink'),
                    new OpenLayers.Control.Attribution(),
                    new OpenLayers.Control.MousePosition()
                ] });

var osm = new OpenLayers.Layer.OSM("OpenStreetMap");
 map.addLayer(osm);


 var lonLat = new OpenLayers.LonLat(lon, lat).transform(map.displayProjection,  map.projection);
        if (!map.getCenter()) map.setCenter (lonLat, zoom);


         var MyStyle = new OpenLayers.Style({
      //  'cursor' : 'pointer',
        fillColor : "#336699",
        fillOpacity : 0.9,
        fontColor: "#000080",
        fontFamily: "sans-serif, Arial",
    //  fontWeight: "bold",
        externalGraphic: "atm.png",
        graphicWidth: 32,
        graphicHeight: 37,
        label: "${count}",
        labelAlign: "ct",
        fontSize: "15px",

        });



        var layer =   new OpenLayers.Layer.Vector("Atm", {
                          protocol: new OpenLayers.Protocol.HTTP({
                          url: "atm.txt",
                          format: new OpenLayers.Format.Text({extractStyles: true}),
                          params: {
                               extractAttributes:     false,

              }
                }),
               styleMap: MyStyle, <!-- --------------------- style -->                                                                  
                projection:       map.displayProjection,
        strategies:       [
        new OpenLayers.Strategy.BBOX({ratio: 1, resFactor: 1.1}),
        new OpenLayers.Strategy.Cluster({distance: 50, threshold: 3})
                                  ]
            });
              map.addLayer(layer);

                              // Interaction; not needed for initial display.
            selectControl = new OpenLayers.Control.SelectFeature(layer);
            map.addControl(selectControl);
            selectControl.activate();
            layer.events.on({
                'featureselected': onFeatureSelect,
                'featureunselected': onFeatureUnselect
           });
       }


        // Needed only for interaction, not for the display.
       function onPopupClose(evt) {
           // 'this' is the popup.
          var feature = this.feature;
            if (feature.layer) { // The feature is not destroyed
                selectControl.unselect(feature);
            } else { // After "moveend" or "refresh" events on POIs layer all 
                     //     features have been destroyed by the Strategy.BBOX
                this.destroy();
            }
        }
        function onFeatureSelect(evt) {
           feature = evt.feature;
            popup = new OpenLayers.Popup.FramedCloud("featurePopup",
                                     feature.geometry.getBounds().getCenterLonLat(),
                                     new OpenLayers.Size(100,100),
                                    "<h2>"+feature.attributes.title + "</h2>" +
                                     feature.attributes.description,
                                    null, true, onPopupClose);
            feature.popup = popup;
            popup.feature = feature;
            map.addPopup(popup, true);
        }
        function onFeatureUnselect(evt) {
            feature = evt.feature;
            if (feature.popup) {
               popup.feature = null;
                map.removePopup(feature.popup);
               feature.popup.destroy();
                feature.popup = null;
           }

 }


</script>
</head>
<body onload="init()">
<div id="map"></div>
</body>
</html>

谢谢。您的帖子没有太多上下文来解释代码部分;请更清楚地解释您的情况。

最佳答案

function onFeatureSelect(event) {
    if(!event.feature.cluster) // if not cluster
    {
      // handle your popup code for the individual feature 
    } 
    else
    {
       // fetch the cluster's latlon and set the map center to it and call zoomin function
       // which takes you to a one level zoom in and I hope this solves your purpose :)    
       map.setCenter(event.feature.geometry.getBounds().getCenterLonLat());
       map.zoomIn();
    }
}

关于zooming - Openlayers 放大集群,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8257585/

相关文章:

vector - OpenLayers:解析的 GeoJSON 点始终显示在 coords(0 , 0)

javascript - D3.js - 如何将时域乘以标量?

android - WebView 禁用双击

mysql - MySQL NDB 引擎上的 Blob 存储

javascript - 静态图像层性能问题 - Open Layers 3

javascript - 自定义 OpenLayers 控件

android - 摄像机变焦

javascript - 如何在 Macbook 的网页上测试捏合事件

node.js - NodeJS|Socket.IO 如何将服务器处理程序发送给工作人员?

hadoop - 为什么增加集群数量可以加快 Hadoop MapReduce 中的查询速度?