SuperMap.Layer.Elements

Elements图层用于添加任意dom对象，其自身是一个div，所以用户可以向该图层上添加任意dom对象，并且支持第三方扩展应用。在第三方扩展应用中，只需要将第三方应用的dom对象添加到Elements图层的div中，使用getDiv方法可以获得Elements图层的div。

Inherits from

SuperMap.Layer

Summary

SuperMap.Layer.Elements	Elements图层用于添加任意dom对象，其自身是一个div，所以用户可以向该图层上添加任意dom对象，并且支持第三方扩展应用。在第三方扩展应用中，只需要将第三方应用的dom对象添加到Elements图层的div中，使用getDiv方法可以获得Elements图层的div。
Properties
isFixed	{Boolean} 设置当前图层在鼠标拖动及放大缩小时位置是否固定，默认为 false。
Constructor
SuperMap.Layer.Elements	创建一个Elements layer
Functions
getDiv	获取该图层的div，用户往这个div里添加任意对象、
getLayerPxFromLonLat	把地理坐标转换为Elements图层的像素坐标。通常使用此函数将用户或第三方应用的Dom对象关联到地图中，使Dom能够随地图缩放和移动。实现Dom地图缩放和移动常需用到map的相关事件，如movestart,moveend等。例如： 1.将dom对象放置在地理要素“北京”所在位置。
getOffset	获取当前图层相对于左上角点的像素偏移量。

Properties

isFixed

{Boolean} 设置当前图层在鼠标拖动及放大缩小时位置是否固定，默认为 false。

Constructor

SuperMap.Layer.Elements

创建一个Elements layer

Parameters

name	{String} 图层的名称。

var elementsLayer = new SuperMap.Layer.Elements("elementsLayer");
map.addLayers([elementsLayer]);
var elementsDiv = elementsLayer.getDiv();

在获取Elements的div后，通常需要指定该div（图层）的大小，例如：设置该div（图层）的大小为地图大小。

var size = map.getSize();
elementsDiv.style.width = size.w;
elementsDiv.style.height = size.h;

向Elements的div中添加dom，最简单的方式是使用Dom函数appendChild，例如：elementsDiv.appendChild(TheDom);此处的TheDom可以是用户自己的Dom对象，也可以是第三方扩展中的Dom对象，下面是一个添加简单dom对象的示例，

var myDom = document.createElement("img");
myDom.src = "images/circle.png";
elementsDiv.appendChild(myDom);

Functions

getDiv

getDiv:function()

获取该图层的div，用户往这个div里添加任意对象、

Return

{<HTMLElement>}

getLayerPxFromLonLat

getLayerPxFromLonLat:function( lonlat )

把地理坐标转换为Elements图层的像素坐标。通常使用此函数将用户或第三方应用的Dom对象关联到地图中，使Dom能够随地图缩放和移动。实现Dom地图缩放和移动常需用到map的相关事件，如movestart,moveend等。例如： 1.将dom对象放置在地理要素“北京”所在位置。

//代码片段1：
var lonlatLT = elementsLayer.getLayerPxFromLonLat(new SuperMap.LonLat(115.38803641666053,40.90618904574261));//myDom 左上角位置
var lonlatRB = elementsLayer.getLayerPxFromLonLat(new SuperMap.LonLat(117.38803641666053,38.90618904574261));//myDom 右下角位置
//设置dom的大小
myDom.style.width = lonlatRB.x -  lonlatLT.x +"px";
myDom.style.height = lonlatRB.y -  lonlatLT.y + "px";
var lonlat =  elementsLayer.getLayerPxFromLonLat(new SuperMap.LonLat(116.38803641666053,39.90618904574261));//北京市坐标
//设置dom的位置
myDom.style.position = "absolute";
myDom.style.left = lonlat.x - (lonlatRB.x - lonlatLT.x)/2 + "px";
myDom.style.top = lonlat.y- (lonlatRB.y -  lonlatLT.y)/2 + "px";

2.通过监听map的moveend来实现Dom地图缩放和移动。

map.events.on({moveend: function (evt) {  //
           if(evt.zoomChanged){      //判断是否缩放
               var level = map.getZoom();    //通过map获得缩放的级数
               if(level > 2){
                   myDom.src = "images/marker.png";
                   myDom.style.opacity = "0.5";
               }
             else{
                   myDom.src = "images/circle.png";
                   myDom.style.opacity = "1";
               }
           }
     //在地图移动结束后，通常需要重置Dom的位置。复制上面示例中的“代码片段1”到此处即可。
}});

Parameters

lonlat

{SuperMap.LonLat}地理坐标

Return

{SuperMap.Pixel}

getOffset

getOffset:function()

获取当前图层相对于左上角点的像素偏移量。