Google Map 外部链接触发图标

<mce:script language="JavaScript" type="text/javascript" src="/Inc/google/key.js" mce_src="Inc/google/key.js"></mce:script> <mce:script type="text/javascript"><!-- var scriptTag = '<' + 'script src="http://maps.google.com/maps?file=api&v=2&key=' + myKey + '">' + '<' + '/script>'; document.write(scriptTag); // --></mce:script> <mce:script type="text/javascript"><!-- var cm_mapMarkers = []; var cm_mapHTMLS = []; function initialize() { if (GBrowserIsCompatible()) { var map = new GMap2(document.getElementById("map_canvas")); map.setCenter(new GLatLng(33.62219563597735, 114.66087341308594), 13); //map.addControl(new GSmallMapControl()); //map.setCenter(centerPoint, zoom, G_NORMAL_MAP); //按指定的中心设置地图视图。也可以同时设置缩放级别和地图类型。地图类型必须是地图已知的类型。请参见构造函数和方法 addMapType()。必须在构造后先调用此方法,才能设置地图的初始状态。在调用此函数之前调用对新构造的 GMap2 对象执行的操作,这是错误的。 map.addControl(new GScaleControl()); //添加比例尺控件 map.addControl(new GLargeMapControl()); //大号平移和缩放控件 位置为左上角 map.addControl(new GMapTypeControl()); //地图类型控件 可选平面图 卫星图 混合地图 map.addControl(new GOverviewMapControl()); //添加小地图控件 map.enableContinuousZoom(); //启用选择浏览器的连续平滑缩放(默认情况下禁用)。 map.enableScrollWheelZoom(); //启用使用鼠标滚轮缩放。注意:默认情况下禁用滚轮缩放。 // 为所有标记创建指定阴影、图标尺寸灯的基础图标 var baseIcon = new GIcon(); baseIcon.shadow = "/Img/Alarm/shadow50.png"; baseIcon.iconSize = new GSize(20, 34); baseIcon.shadowSize = new GSize(37, 34); baseIcon.iconAnchor = new GPoint(9, 34); baseIcon.infoWindowAnchor = new GPoint(9, 2); baseIcon.infoShadowAnchor = new GPoint(18, 25); // 创建信息窗口显示对应给定索引的字母的标记 function createMarker(point, index) { // Create a lettered icon for this point using our icon class var letter = String.fromCharCode("1".charCodeAt(0) + index); var letteredIcon = new GIcon(baseIcon); letteredIcon.image = "/Img/Alarm/FireAlarm.gif"; letteredIcon.iconSize = new GSize(30,30); // 设置 GMarkerOptions 对象 markerOptions = { icon: letteredIcon }; var marker = new GMarker(point, markerOptions); cm_mapMarkers.push(marker); cm_mapHTMLS.push("<b>名称:</b> 建筑" + letter + "<br><b>地址:</b> XXX路XX号<br><b>时间 :</b>2010-08-16<br><b>状况:</b> 已扑灭"); GEvent.addListener(marker, "click", function() { document.getElementById("MsgFrame").src = "/LC_Alarm/Alarm/Fire_Department.aspx?type=2&number=" + letter; marker.openInfoWindowHtml("<b>名称:</b> 建筑" + letter + "<br><b>地址:</b> XXX路XX号<br><b>时间 :</b>2010-08-16<br><b>状况:</b> 已扑灭"); }); return marker; } // 随机向地图添加 8 个标记 var bounds = map.getBounds(); var southWest = bounds.getSouthWest(); var northEast = bounds.getNorthEast(); var lngSpan = northEast.lng() - southWest.lng(); var latSpan = northEast.lat() - southWest.lat(); for (var i = 0; i <8; i++) { var latlng = new GLatLng(southWest.lat() + latSpan * Math.random(), southWest.lng() + lngSpan * Math.random()); map.addOverlay(createMarker(latlng, i)); } } } function showimg(id) { var Layer = new LcLayer("ImgInfo"); Layer.LayerTitle = "图片查看"; Layer.LayerUrl = "ImgInfo.aspx?id=" + id; Layer.IsReLoad = false; Layer.Width = 700; Layer.Height = 600; Layer.open(); } function cm_markerClicked(markerNum) { var marker = cm_mapMarkers[markerNum]; marker.openInfoWindowHtml(cm_mapHTMLS[markerNum]); } // --></mce:script> </head> <body scroll="yes" onload="initialize()" onunload="GUnload()"> <table width=""100%"" height=""100%"" border=""0"" cellspacing=""0"" cellpadding=""0"" align=""center""> <tr> <td width=""79%""> <div id=""map_canvas"" style="" height: 100%""></div> </td> <td width=""2px""></td> <td width=""20%""> <iframe id=""MsgFrame"" name=""MsgFrame"" src=""/LC_Alarm/Alarm/NewAlarmList.aspx"" style=""width:100%;height:100%;"" marginwidth=""0"" marginheight=""0"" height=""0"" width=""0"" frameBorder=""0"" scrolling=""no""></iframe> </td> </tr></body>

 

NewAlarmList.aspx

StringBuilder htmlstr = new StringBuilder(); htmlstr.Append(@" <table width=""100%"" class=""pagetab"" border=""0"" cellspacing=""0"" cellpadding=""0"" align=""left"">"); htmlstr.Append(@" <tr height=""50""> <td align=""left"" style=""color:#FF9C00; font-size:20px; font-weight:bold; background:url(/Img/celan.gif) no-repeat left center; padding-left:28px;"">最新火险警情</td> </tr> <tr height=""50""> <td align=""left""><a href="javascript:parent.cm_markerClicked(0);" mce_href="javascript:parent.cm_markerClicked(0);">药品检验所</a> 地址:xx路xx号<br>日期:2010-12-08 状态:已扑灭</td> </tr> <tr height=""50""> <td align=""left""><a href="javascript:parent.cm_markerClicked(1);" mce_href="javascript:parent.cm_markerClicked(1);">劳动保障局</a> 地址:xx路xx号<br>日期:2010-10-30 状态:处理中</td> </tr> <tr height=""50""> <td align=""left""><a href="javascript:parent.cm_markerClicked(2);" mce_href="javascript:parent.cm_markerClicked(2);">金贝壳花业</a> 地址:xx路xx号<br>日期:2010-10-25 状态:已扑灭</td> </tr> <tr height=""50""> <td align=""left""><a href="javascript:parent.cm_markerClicked(3);" mce_href="javascript:parent.cm_markerClicked(3);">亚洲饭莊</a> 地址:xx路xx号<br>日期:2010-09-23 状态:处理中</td> </tr> <tr height=""50""> <td align=""left""><a href="javascript:parent.cm_markerClicked(4);" mce_href="javascript:parent.cm_markerClicked(4);">周口职业技术学院</a> 地址:xx路xx号<br>日期:2010-08-18 状态:处理中</td> </tr> <tr height=""50""> <td align=""left""><a href="javascript:parent.cm_markerClicked(5);" mce_href="javascript:parent.cm_markerClicked(5);">周口人民检察院</a> 地址:xx路xx号<br>日期:2010-07-16 状态:已扑灭</td> </tr> <tr height=""50""> <td align=""left""><a href="javascript:parent.cm_markerClicked(6);" mce_href="javascript:parent.cm_markerClicked(6);">滨河公园</a> 地址:xx路xx号<br>日期:2010-07-13 状态:已扑灭</td> </tr> <tr height=""50""> <td align=""left""><a href="javascript:parent.cm_markerClicked(7);" mce_href="javascript:parent.cm_markerClicked(7);">专科病医院</a> 地址:xx路xx号<br>日期:2010-06-08 状态:处理中</td> </tr> </table> "); 

 

效果:

Google Map 外部链接触发图标_第1张图片

你可能感兴趣的:(Google Map 外部链接触发图标)