转：利用JavaScript实现图片标注——SearchMapIdentityTask

功能：功能实现了现在网络流行的定位后在地图上画一个图标，点击图标后弹出消息框。

思路：根据查询条件获得一个点的地图坐标，然后转换为屏幕坐标，利用ｊｓ脚本动态图片到相应位置。

效果图如下：

主要实现步骤：

1、SearchMapIdentity.cs,该类主要实现查询获取点的地图坐标，地图坐标转换为屏幕坐标的方法，点击小图标时的回发调用，代码如下

  1 using System;
  2 using System.Data;
  3 using System.Collections;
  4 using System.Collections.Specialized;
  5 using System.Configuration;
  6 using System.Web;
  7 using System.Web.Security;
  8 using System.Web.UI;
  9 using System.Web.UI.WebControls;
 10 using System.Web.UI.WebControls.WebParts;
 11 using System.Web.UI.HtmlControls;
 12 using ESRI.ArcGIS.ADF.Web;
 13 using ESRI.ArcGIS.ADF.Web.UI.WebControls;
 14 using ESRI.ArcGIS.ADF.Web.DataSources;
 15 using ESRI.ArcGIS.ADF.Web.Geometry;
 16 using ESRI.ArcGIS.ADF.Web.Display.Graphics;
 17 using System.Collections.Generic;
 18 
 19 namespace SearchMapIdentityTask{
 20 
 21    public class SearchMapIdentity
 22     {
 23         #region 私有字段
 24        private Page m_page;
 25        private Map m_map;
 26        private ArrayList mapPoints = null;
 27        private string content;
 28        
 29        private string m_callbackInvocation = "";
 30        private string m_filePath = "";
 31        private string queryText = "";
 32        private DataTable queryResult = null;
 33        private string queryField = "";
 34        private string readFields = "";
 35       #endregion
 36 
 37         #region 相关属性
 38         public Map Map
 39         {
 40             get { return m_map; }
 41             set { m_map = value; }
 42         }
 43 
 44         public Page Page
 45         {
 46             get { return m_page; }
 47             set { m_page = value; }
 48         }
 49 
 50 
 51         public string ClientCallbackInvocation
 52         {
 53             get { return m_callbackInvocation; }
 54             set { m_callbackInvocation = value; }
 55         }
 56 
 57         public string FilePath
 58         {
 59             get { return m_filePath; }
 60             set { m_filePath = value; }
 61         }
 62 
 63         public string QueryText
 64         {
 65             get { return queryText; }
 66             set { queryText = value; }
 67         }
 68 
 69         public ArrayList MapPoints
 70         {
 71             get { return mapPoints; }
 72             set { mapPoints = value; }
 73         }
 74         public string Content
 75         {
 76             get { return content; }
 77             set { content = value; }
 78         }
 79 
 80        public DataTable QueryResult
 81        {
 82            get { return queryResult; }
 83            set { queryResult = value; }
 84        }
 85        //需要用来作为Where条件的查询字段
 86        public string QueryField
 87        {
 88            get { return queryField; }
 89            set { queryField = value; }
 90        }
 91        //需要显示在详细信息里的字段
 92        public string ReadFields
 93        {
 94            get { return readFields; }
 95            set { readFields = value; }
 96        }
 97         #endregion
 98 
 99         #region 构造函数
100 
101         public SearchMapIdentity()
102         {
103         }
104 
105         public SearchMapIdentity(Map map)
106         {
107             if (map != null)
108             {
109                 m_map = map;
110             }
111         }
112 
113         public SearchMapIdentity(Map map, string filePath)
114         {
115             m_map = map;
116             m_filePath = filePath;
117 
118         }
119         #endregion
120 
121         #region 处理点击查询回调的函数
122 
123         public void Identify(bool isFirstIdentify,string layername)
124         {
125             int x = 0;
126             int y = 0;
127             ArrayList xy = null;
128             if (this.MapPoints == null || isFirstIdentify == true)
129             {
130                 xy = GetXY(this.Map,layername);
131             }
132             else
133             {
134                 xy = this.MapPoints as ArrayList;
135             }
136             foreach (object o in xy)
137             {
138                 object[] arrayPoints = o as object[];
139                 ESRI.ArcGIS.ADF.Web.Geometry.Point p = (ESRI.ArcGIS.ADF.Web.Geometry.Point)arrayPoints[0];
140                 System.Drawing.Point screenPoint = MapToScreenPoint(p.X, p.Y);
141                 x = screenPoint.X;
142                 y = screenPoint.Y;
143                 string content = arrayPoints[1] as string;
144                 string oa = string.Format("ReDrawZommToPoint({0},{1},{2},{3},\'{4}\');", x, y, p.X, p.Y, content);
145                 CallbackResult cr1 = new CallbackResult(null, null, "javascript", oa);
146                 this.Map.CallbackResults.Add(cr1);
147             }
148         }
149         #endregion
150 
151         #region 处理点击小图片时回调的函数
152         public void DrawInfoWin(double mapX, double mapY, string content)
153         {
154             System.Drawing.Point screen_point = MapToScreenPoint(mapX, mapY);
155             int[] rate = { screen_point.X, screen_point.Y - 38 };
156             object[] oa = new object[1];
157             string sa = "showInfoWindow(" + rate[0].ToString() + "," + rate[1].ToString() + ",'" + content + "');";
158             oa[0] = sa;
159             CallbackResult cr1 = new CallbackResult(null, null, "javascript", oa);
160             this.Map.CallbackResults.Add(cr1);
161         }
162         #endregion
163 
164         #region 获得查询点的结果集
165         public ArrayList GetXY(Map Map1,string layername)
166         {
167             ArrayList XY = new ArrayList();
168             IEnumerable func_enum = Map1.GetFunctionalities();
169             System.Data.DataTable datatable = null;
170 
171             foreach (ESRI.ArcGIS.ADF.Web.DataSources.IGISFunctionality gisfunctionality in func_enum)
172             {
173                 ESRI.ArcGIS.ADF.Web.DataSources.IGISResource gisresource = gisfunctionality.Resource;
174 
175                 if (gisfunctionality.Resource.DataSource.DataSourceDefinition == "In Memory")
176                 {
177                     continue;
178                 }
179 
180                 bool supported = gisresource.SupportsFunctionality(typeof(ESRI.ArcGIS.ADF.Web.DataSources.IQueryFunctionality));
181 
182                 if (supported)
183                 {
184                     ESRI.ArcGIS.ADF.Web.DataSources.IQueryFunctionality qfunc;
185 
186                     qfunc = (ESRI.ArcGIS.ADF.Web.DataSources.IQueryFunctionality)gisresource.CreateFunctionality(
187                        typeof(ESRI.ArcGIS.ADF.Web.DataSources.IQueryFunctionality), null);
188 
189                     string[] lids;
190                     string[] lnames;
191                     qfunc.GetQueryableLayers(null, out lids, out lnames);
192 
193                     int layer_index = -1;
194                     for (int i = 0; i < lnames.Length; i++)
195                     {
196                         if (lnames[i] == layername)
197                         {
198                             layer_index = i;
199                             break;
200                         }
201                     }
202 
203                     if (layer_index == -1)
204                     {
205                         continue;
206                     }
207 
208                     ESRI.ArcGIS.ADF.Web.SpatialFilter spatialfilter = new ESRI.ArcGIS.ADF.Web.SpatialFilter();
209                     spatialfilter.Geometry = Map1.GetFullExtent();
210                     spatialfilter.ReturnADFGeometries = true;
211                     spatialfilter.MaxRecords = 1000;
212                     spatialfilter.WhereClause = this.QueryField + " like '%" + this.QueryText + "%'";  //txtSearch.Text; 查询条件
213 
214                     datatable = qfunc.Query(null, lids[layer_index], spatialfilter);
215                     this.QueryResult = datatable;
216 
217                     if (datatable != null)
218                     {
219                         int intShape = -1;
220                         foreach (System.Data.DataColumn col in datatable.Columns)
221                         {
222                             if (col.DataType == typeof(Geometry))
223                             {
224                                 intShape = col.Ordinal;
225                                 break;
226                             }
227                         }
228 
229                         for (int i = 0; i < datatable.Rows.Count; i++)
230                         {
231                             ESRI.ArcGIS.ADF.Web.Geometry.Point point2 = (ESRI.ArcGIS.ADF.Web.Geometry.Point)datatable.Rows[i].ItemArray[intShape];
232                             //让地图以某个点居中
233                             this.Map.CenterAt(point2);
234                             Array readFieldPairs = this.ReadFields.Split(";".ToCharArray());
235                             string[] readFieldValue;
236                             //循环构造Content属性
237                             if (readFieldPairs.Length > 0)
238                             {
239                                 for (int j = 0; j < readFieldPairs.Length-1; j++)
240                                 {
241                                     readFieldValue = readFieldPairs.GetValue(j).ToString().Split(":".ToCharArray());
242                                     this.Content += readFieldValue[0] + ":" + datatable.Rows[i][readFieldValue[1]].ToString()+"<br>";
243                                 }
244                             }                            
245                             object[] arraryPoint = new object[2];
246                             arraryPoint[0] = point2;
247                             arraryPoint[1] = this.Content;
248                             //将Content属性清空
249                             this.Content = "";
250                             XY.Add(arraryPoint);
251                         }
252                     }
253                 }
254             }
255             this.MapPoints = XY;
256             return XY;
257 
258         }
259         #endregion
260 
261         #region 由地图坐标经过转换得到屏幕坐标的点
262         public System.Drawing.Point MapToScreenPoint(double mapX, double mapY)
263         {
264             ESRI.ArcGIS.ADF.Web.Geometry.Point adf_point = new ESRI.ArcGIS.ADF.Web.Geometry.Point(mapX, mapY);
265             ESRI.ArcGIS.ADF.Web.Geometry.TransformationParams transformationParameters = this.Map.GetTransformationParams(ESRI.ArcGIS.ADF.Web.Geometry.TransformationDirection.ToScreen);
266             System.Drawing.Point screen_point = adf_point.ToScreenPoint(transformationParameters);
267             return screen_point;
268         }
269 
270         #endregion
271 
272     }
273 }

：

2、SearchMapIdentityTask.cs，这个就是包装Task的类，主要代码如下

  1 using System;
  2 using System.Collections.Generic;
  3 using System.Text;
  4 using System.Web;
  5 using ESRI.ArcGIS.ADF.Web.UI.WebControls;
  6 using ESRI.ArcGIS.ADF.Web.DataSources;
  7 using System.Web.UI.WebControls;
  8 using System.Web.UI.HtmlControls;
  9 using System.Web.UI;
 10 using System.Collections;
 11 using System.Collections.Specialized;
 12 using System.Data;
 13 using System.ComponentModel;
 14 using System.Text.RegularExpressions;
 15 
 16 namespace SearchMapIdentityTask
 17 {
 18    
 19     public class SearchMapIdentityTask : FloatingPanelTask
 20     {
 21         private TextBox textBox = null;
 22         private HtmlInputButton button = null;
 23         private HtmlSelect selLayers = null;
 24         private HtmlInputButton clear = null;
 25 
 26         SearchMapIdentity searchMapIdentity = null;
 27         private string queryField = "";        
 28         private string readFileds = "";
 29 
 30         #region 相关属性
 31         [Description("用户where条件中要查询的字段")]
 32         public string QueryField
 33         {
 34             get { return queryField; }
 35             set { queryField = value; }
 36         }
 37         [Description("设置需要在详细信息中显示的字段，格式为(字段1中文名：字段1数据库表名;字段2中文名：字段2数据库表名)")]
 38         public string ReadFileds
 39         {
 40             get { return readFileds; }
 41             set { readFileds = value; }
 42         }
 43         #endregion
 44 
 45         #region 构造函数
 46         public SearchMapIdentityTask()
 47         {
 48             this.Width = Unit.Pixel(200);
 49         }
 50         #endregion
 51 
 52         #region 构建子控件
 53         protected override void CreateChildControls()
 54         {
 55             Controls.Clear();
 56             base.CreateChildControls();
 57             textBox = new TextBox();
 58             textBox.ID = "textBox";
 59             textBox.Width=200;
 60             button = new HtmlInputButton();
 61             button.ID = "button";
 62             button.Value = "查询";
 63             clear = new HtmlInputButton();
 64             clear.ID = "clear";
 65             clear.Value = "清除结果";
 66             selLayers = new HtmlSelect();
 67             selLayers.ID = "sellayer";  
 68             Controls.Add(selLayers);
 69             Controls.Add(textBox);
 70             Controls.Add(button);
 71             Controls.Add(clear);
 72 
 73             string argument = string.Format("'args='+document.getElementById('{0}').value", selLayers.ClientID);
 74             argument += string.Format("+':'+strTrim(document.getElementById('{0}').value)", textBox.ClientID);
 75 
 76             string onClick = string.Format("executeTask({0},\"{1}\");", argument, base.CallbackFunctionString);
 77             //调用SearchMapIdentity.js里的clearIdentifyDiv函数，清楚上一次查询产生的div
 78             onClick += "clearIdentifyDiv();";
 79             string onKeyDown = string.Format(" if(event.keyCode==13) {{{0} return false;}}", onClick);
 80             button.Attributes.Add("onclick", onClick);
 81             //点击clear按钮时，调用清除查询结果的js函数
 82             clear.Attributes.Add("onclick", "clearIdentifyDiv()");
 83             textBox.Attributes.Add("onkeydown", onKeyDown);
 84 
 85 
 86             //调用填充下拉框函数
 87             FillLayerSelect();
 88         }
 89         #endregion
 90         
 91         #region OnLoad—初始化一些初始变量
 92         protected override void OnLoad(EventArgs e)
 93         {
 94             base.OnLoad(e);
 95             //进行相关属性检查
 96             if (this.QueryField == "")
 97             {
 98                 throw new Exception("QueryField属性未设置");
 99             }
100 
101             Regex regex = new Regex("^(\\S+:\\S+;)+$");
102             if (this.ReadFileds == "")
103             {
104                 throw new Exception("ReadFileds属性未设置");
105             }
106             else if (!regex.IsMatch(this.ReadFileds))
107             {
108                 throw new Exception("ReadFileds格式不正确，请查看描述后修改！");
109             }
110 
111             this.MapInstance.ScaleChanged += new MapScaleChangeEventHandler(Map_ScaleChanged);
112             searchMapIdentity = new SearchMapIdentity(this.MapInstance);
113             searchMapIdentity.QueryField = this.QueryField;
114             searchMapIdentity.ReadFields = this.ReadFileds;
115             //searchMapIdentity.SetupIdentify();
116             if (this.Page.Session["MapPoints"] != null)
117             {
118                 searchMapIdentity.MapPoints = this.Page.Session["MapPoints"] as ArrayList;
119             }
120         }
121         #endregion
122 
123         #region OnPreRender - 加载客户端脚本和设置属性
124 
125         protected override void OnPreRender(EventArgs e)
126         {
127             base.OnPreRender(e);
128             if (this.Page != null)
129             {
130                 //注册SearchMapIdentity脚本
131                 ClientScriptManager scriptMgr = Page.ClientScript;
132                 Type controlType = this.GetType();
133                 string fileName = controlType.Namespace + ".SearchMapIdentity.js";
134                 scriptMgr.RegisterClientScriptResource(controlType, fileName);
135                 //注册回调的字符串
136                 System.Text.StringBuilder sb = new System.Text.StringBuilder();                
137                 sb.Append("<script language=\"javascript\" type=\"text/javascript\">var MapSearchIdentifyCallbackStr = \"" + base.CallbackFunctionString + "\";</script>\n");
138                 if (!Page.ClientScript.IsClientScriptBlockRegistered("MapSearchIdentify"))
139                     Page.ClientScript.RegisterClientScriptBlock(Page.GetType(), "MapSearchIdentify", sb.ToString());
140             }            
141         }
142         #endregion
143 
144         #region 回调处理函数
145         //得到传递进来的参数，赋给base.Input
146         public override string GetCallbackResult()
147         {
148             NameValueCollection keyValCol1 = CallbackUtility.ParseStringIntoNameValueCollection(_callbackArg);
149             if (keyValCol1["EventArg"] == "executeTask")
150             {
151                 string sInArgs = keyValCol1["args"];
152                 string delim = ":";
153                 char[] delchar = delim.ToCharArray();
154                 string[] args = sInArgs.Split(delchar);
155                 object[] inputs = new object[2];
156                 inputs[0] = args[0];
157                 inputs[1] = args[1];
158                 base.Input = inputs;
159             }
160             else if (keyValCol1["EventArg"] == "startTaskActivityIndicator")
161             {
162             }
163             else if (keyValCol1["EventArg"] == "hidden")
164             {
165             }
166             //自己添加的分支，用户处理点击小图片是的回发处理
167             else if (keyValCol1["EventArg"] == "ShowInfoWin")
168             {
169                 double MapX = Convert.ToDouble(keyValCol1["MapX"]);
170                 double MapY = Convert.ToDouble(keyValCol1["MapY"]);
171                 string content = keyValCol1["Content"];
172                 searchMapIdentity.DrawInfoWin(MapX, MapY, content);
173                 return this.MapInstance.CallbackResults.ToString();
174             }
175             return base.GetCallbackResult();
176         }
177         #endregion
178 
179         #region 执行TASK
180         public override void ExecuteTask()
181         {
182             if (Input == null) return;
183             object[] inputs = Input as object[];
184             string selLayer = inputs[0] as string;
185             string queryTxt = (string)inputs[1];
186             ViewState["selLayer"] = selLayer;
187             ViewState["queryTxt"] = queryTxt;
188             searchMapIdentity.QueryText = queryTxt;
189             searchMapIdentity.Identify(true, selLayer);
190             DataTable datatable = searchMapIdentity.QueryResult as DataTable;
191             DataSet ds = new DataSet();
192             ds.Tables.Add(datatable);            
193             ds.DataSetName = "查询"+ queryTxt +"的结果为：";
194             Page.Session["MapPoints"] = searchMapIdentity.MapPoints;
195             base.Results = ds;
196         }
197         #endregion
198 
199         #region 处理依赖资源
200         public override List<GISResourceItemDependency> GetGISResourceItemDependencies()
201         {
202             throw new Exception("The method or operation is not implemented.");
203         }
204         #endregion
205 
206         #region 渲染控件格式
207         protected override void RenderContents(HtmlTextWriter writer)
208         {
209             writer.RenderBeginTag(HtmlTextWriterTag.Table);
210 
211             writer.RenderBeginTag(HtmlTextWriterTag.Tr);
212             writer.RenderBeginTag(HtmlTextWriterTag.Td);
213             this.selLayers.RenderControl(writer);
214             writer.RenderEndTag();
215             writer.RenderEndTag();
216 
217             writer.RenderBeginTag(HtmlTextWriterTag.Tr);
218             writer.AddStyleAttribute(HtmlTextWriterStyle.WhiteSpace, "nowrap");
219             writer.RenderBeginTag(HtmlTextWriterTag.Td);
220             if (!string.IsNullOrEmpty(this.Input as string))
221             {
222                 this.textBox.Text = this.Input as string;
223             }
224             else
225             {
226                 this.textBox.Text = "";
227             }
228             this.textBox.RenderControl(writer);
229             writer.RenderEndTag();
230             writer.RenderEndTag();            
231 
232             writer.RenderBeginTag(HtmlTextWriterTag.Tr);
233             writer.RenderBeginTag(HtmlTextWriterTag.Td);
234             this.button.RenderControl(writer);
235             writer.Write("  ");
236             this.clear.RenderControl(writer);
237             writer.RenderEndTag();
238             writer.RenderEndTag();
239 
240             writer.RenderEndTag();
241         }
242         #endregion
243 
244         #region 辅助函数
245         Map _map = null;
246         TaskResults _taskResults = null;
247         private Map MapInstance
248         {
249             get
250             {
251                 if (_map == null)
252                 {
253                     for (int i = 0; i < base.TaskResultsContainers.Count; i++)
254                     {
255                         _taskResults = Utility.FindControl(TaskResultsContainers[i].Name, Page) as TaskResults;
256                         if (_taskResults != null && _taskResults.Map != null && _taskResults.Map.Length > 1)
257                         {
258                             _map = Utility.FindControl(_taskResults.Map, this.Page) as Map;
259                         }
260                         if (_map != null)
261                             break;
262                     }
263                 }
264                 return _map;
265             }
266         }
267 
268         private TaskResults getTaskResults()
269         {
270             if (_taskResults == null)
271                 _map = MapInstance;
272             return _taskResults;
273         }
274 
275         //填充selLayers下拉框
276         private void FillLayerSelect()
277         {
278             ListItem layerItem;
279             IMapFunctionality mf = MapInstance.GetFunctionality(0);
280             if (mf == null)
281             {
282                 layerItem = new ListItem("<no layers found>", "null");
283                 selLayers.Items.Add(layerItem);
284                 return;
285             }
286             IGISResource gisresource = mf.Resource;
287             bool supported = gisresource.SupportsFunctionality(typeof(IQueryFunctionality));
288             selLayers.Items.Clear();
289             if (supported)
290             {
291                 IQueryFunctionality qfunc = gisresource.CreateFunctionality(typeof(IQueryFunctionality), null) as IQueryFunctionality;
292                 string[] lids;
293                 string[] lnames;                
294                 qfunc.GetQueryableLayers(null, out lids, out lnames, ESRI.ArcGIS.ADF.Web.FeatureType.Point);
295                 int i = 0;
296                 while (i < lnames.Length)
297                 {
298                     layerItem = new ListItem(lnames[i], lnames[i]);
299                     selLayers.Items.Add(layerItem);
300                     i++;
301                 }
302             }
303         }
304 
305 
306         #endregion
307 
308         #region 地图比例尺变化以后要执行的函数
309         protected void Map_ScaleChanged(object sender, ESRI.ArcGIS.ADF.Web.UI.WebControls.ScaleEventArgs args)
310         {
311             if (Page.IsPostBack || Page.IsCallback)
312             {
313                 if (ViewState["selLayer"] != null && ViewState["queryTxt"] != null)
314                 {
315                     searchMapIdentity.QueryText = "四川";
316                     searchMapIdentity.Identify(false, ViewState["selLayer"] as string);
317                 }
318             }
319         }
320 #endregion
321 
322     }
323 }

3、SearchMapIdentity.js,主要是些动态创建和定位div的js脚本

  1 //显示详细信息的服务器回调函数
  2 function DrawInfowindow(mapX,mapY,content)
  3  {
  4     if (mapX==null||mapY==null) return;
  5     var argument="EventArg=ShowInfoWin&MapX=" + mapX + "&MapY=" + mapY + "&Content=" + content;
  6     var context = Maps["Map1"].controlName;
  7     eval(MapSearchIdentifyCallbackStr); 
  8  }
  9 
 10 
 11 //删除已经标示的DIV
 12 function clearIdentifyDiv()
 13 {
 14     var o = map.overlayObject
 15     while (o.hasChildNodes())
 16      { 
 17        o.removeChild(o.lastChild); 
 18      } 
 19 }
 20 
 21 //将图片定位到指定点
 22 function showZoomToPoint(x,y,mapX,mapY,content)
 23 {
 24     map = Maps["Map1"];
 25     var pointdiv = document.createElement("div"); 
 26     pointdiv.style.position="absolute";    
 27     pointdiv.style.zIndex=2;
 28     // point is bottom center... 2 pixels up for shadow
 29     var cWidth = Math.floor(pointdiv.clientWidth / 2);
 30     var cHeight = pointdiv.clientHeight;
 31     if (cWidth==0) cWidth = 20;
 32     if (cHeight==0) cHeight = 38;
 33     var idLeft = x - parseInt(map.divObject.style.left)-cWidth/2;
 34     var idTop = y - parseInt(map.divObject.style.top) - cHeight + 2;     
 35     pointdiv.innerHTML='<img src=images/blank.gif alt="" border="0"  hspace="0" vspace="0" onclick=\'DrawInfowindow(' + mapX + ',' + mapY + ',"' + content + '");\' style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'images/icon_info.png\');cursor:hand;" />\n';
 36     map.overlayObject.appendChild(pointdiv);  
 37     pointdiv.style.left= idLeft;
 38     pointdiv.style.top=idTop;
 39     return false;
 40 }
 41 
 42 //重新将图片定位到指定点
 43 function ReDrawZommToPoint(x,y,mapX,mapY,content)
 44  {           
 45     window.setTimeout("showZoomToPoint(" + x + "," + y + "," + mapX + "," + mapY + ",\'" + content + "\')",1000);
 46  }
 47 
 48 
 49 //显示详细信息的函数
 50 function showInfoWindow(x,y,content)
 51 {
 52     var div = document.getElementById("InfoWindow");
 53     if (div==null) {
 54         addInfowindow();
 55     }
 56     window.status=content;
 57     document.getElementById("infowindowTitle").innerHTML="<b><font color='black'>详细信息</font></b>"
 58     var infoContentHtml="<font color='black'>" + content + "</font><br>";
 59     var oNearQuery=document.getElementById("tr_NearQuery");
 60 
 61     infoContentHtml += "<span style=\"cursor:hand;\" onclick=\"alert('call js functions u need');\"><u>点我吧</u></span>&nbsp;";
 62 
 63     document.getElementById("infowindowContent").innerHTML= infoContentHtml ;
 64     var div = document.getElementById("InfoWindow");
 65     var cWidth = Math.floor(div.clientWidth / 2);
 66     var cHeight = div.clientHeight;
 67 
 68     if (cWidth==0) cWidth = 235;
 69     if (cHeight==0) cHeight = 148;
 70     var idLeft = x - parseInt(map.divObject.style.left) ;//- cWidth;
 71     var idTop = y - parseInt(map.divObject.style.top) - cHeight + 2; 
 72     window.setTimeout('moveLayer("InfoWindow", ' + idLeft + ', ' + idTop + '); showLayer("InfoWindow");', 0);
 73     return false;
 74     
 75 }
 76 
 77 //添加显示信息的div
 78 function addInfowindow()
 79 {
 80     var content="";   
 81     content = '<div id="InfoWindow" style="z-index:3;position:absolute; 235px; height:148px;left: 0px; top: 0px; visibility: hidden;  overflow:hidden; background-image: url(images/Info.gif); layer-background-image: url(images/Info.gif); border: 1px none #000000; cursor:default  "><table   border="0" cellpadding="0" cellspacing="0">'; 
 82     content += '<tr> ';
 83     content += '    <td valign="top"><table width="235" border="0" cellspacing="0" cellpadding="0"> ';
 84     content += '      <tr> ';
 85     content += '        <td><table  border="0" style="overflow: hidden;height: 20px; 235px;" cellspacing="0" cellpadding="0"> ';
 86     content += '          <tr> ';
 87     content += '            <td  id ="infowindowTitle" width="218" style="overflow: hidden; 218px; height:20px; font:宋体;  font-size:12px; color:black; padding-left:10px; " valign="middle"></td> ';
 88     content += '            <td width="17" valign="middle"><img style="cursor:hand;" onclick=\'closeInfoWindow();\' onmouseover="this.src=\'images/close2.png\'" onmouseout="this.src=\'images/close1.png\'" src="images/close1.png" width="8" height="6" /></td> ';
 89     content += '          </tr> ';
 90     content += '        </table></td> ';
 91     content += '      </tr> ';
 92     content += '      <tr> ';
 93     content += '        <td > ';
 94     content += '            <table align="center" width="220" border="0" cellspacing="0" cellpadding="0"> ';
 95     content += '              <tr> ';
 96     content += '                <td background="images/h-line.png"  style="height:1px; padding:10px"></td> ';
 97     content += '              </tr>';
 98     content += '            </table> ';
 99     content += '        </td> ';
100     content += '      </tr> ';
101     content += '      <tr> ';
102     content += '        <td style="height:125px; overflow:hidden; " valign="top"> ';
103     content += '        <table width="230" style="230px; height:125px; overflow: hidden;" border="0" cellpadding="0" cellspacing="0"> ';
104     content += '          <tr> ';
105     content += '            <td valign="top"> ';
106     content += '            <div  id="infowindowContent" style="overflow: hidden;height:75px; 230px;  font-size:12px ;padding-left:10px;padding-top:10px" ></div> ';
107     content += '            </td> ';
108     content += '          </tr>';
109     content += '        </table></td> ';
110     content += '      </tr> ';
111     content += '    </table></td> ';
112     content += '  </tr>';
113     content += '</table></div>';
114     map.overlayObject.insertAdjacentHTML("BeforeEnd", content);
115 }
116 
117 //关闭显示详细信息的div
118 function closeInfoWindow()
119 {
120     var div = document.getElementById("InfoWindow");
121     if (div!=null)
122     {
123         hideLayer("InfoWindow");
124     }
125 }
126 
127 //辅助函数——清除字符串空格
128 function strTrim(s)
129 {
130     var reg=/(^\s*)|(\s*$)/g;
131     var ss=s.replace(reg,"");
132     return ss;
133 }

使用注意事项：

1、要把附件中的图片Info.gif、close1.png、close2.png、h-line.png、icon_info.png拷贝到测试项目的根目录下的images文件夹下面。

2、要在mxd中添加1个以上点图层。

• SearchMapIdentityTask.rar (2.8 MB)
• 下载次数: 588

• data.rar (6.9 MB)
• 下载次数: 426

原文：http://dbajun.iteye.com/blog/242763