mapbar地图应用程序接口使用手册之地图操作接口分册

mapbar地图应用程序接口使用手册之地图操作接口分册内容摘要：

大、缩小、 秱劢 功能的地图。 以下简单代码即可搞定。 代码 !DOCTYPE html PUBLIC //W3C//DTD XHTML Strict//EN html xmlns= head meta equiv=contenttype content=text/html。 charset=GBK/ titleMapbar 地图 JavaScript API 示例 /title script type=text/javascript src= script language = javascript var maplet。 // oo: true 打开鹰眼地图； false 关闭鹰眼地图。 var oo = true。 // 创建一个北京地图 ， 地图中心为 北京 天安门广场 ， 显示比例尺为第 8 级（即城市地图级别） ， 地图尺寸为宽 640 象素 , 高 480 象素。 function init() { // 页面展现初始化凼数 maplet = new Maplet(myMap)。 // 创建一个名字为 myMap 的地图对象实例。 (new MStandardControl())。 // 添加地图标准缩放控件（鱼骨头）。 (new MPoint(北京 市 ),8)。 // 显示以北京为中心，比例尺为 8 级的地 图。 } /script head body onload=init()。 div id=myMap style=position:relative。 top:20。 left:100。 width:640px。 height:480px/div!//定义 myMap 地图 在窗口的位置信息，例如： 宽、高 等。 /body /html 地图操作接口分册 机密 第 10 页 共 50 页 代码执行 图例 定制自己的按钮 要想在地图上自己定制操作按钮（放大、缩小、测距、秱劢）， 4 行代码解决问题。 程序 html head meta equiv=ContentType content=text/html。 charset=GBK title /title script language=javascript src= script type=text/javascript language=javascript function init() { maplet = new Maplet(myMap)。 (new MPoint(北京市 ), 8)。 } /script /head body onLoad=init()。 !// 定制自己的按钮。 button onClick=(1)放大 /button !//定义放大按钮。 button onClick=(2)缩小 /button !// 定义缩小按钮。 button onClick=(11)测距 /button !// 定义测距按钮。 button onClick=(3)移动 /button !// 定义移动按钮。 div id=myMap style=position:relative。 top:20。 left:100。 width:640px。 height:480px/div 地图操作接口分册 机密 第 11 页 共 50 页 /body /html 代码执行 图例 操作说明：单击按钮，地图执行 按钮提示的操作功能。 在地图上创建 1个标注点 POI 在地图上创建 1 个标注点 POI，也是几行代码的工作量。 代码 !DOCTYPE html PUBLIC //W3C//DTD XHTML Strict//EN html xmlns= head meta equiv=ContentType content=text/html。 charset=GBK title/title script language=javascript src= script type=text/javascript language=javascript var myicon = new MMarker ( // 创建一个标注点 POI 对象实例。 new MPoint(北京市 ), // 定义 标注点 坐标中心。 new MIcon( // 配置标注点显示图标。 new MInfoWindow(名称 ,内容 ), // 定义标注点气泡信息框的标题不内容。 new MLabel(标签 ) // 定义标注点在地图上显示的标签名称。 )。 地图操作接口分册 机密 第 12 页 共 50 页 function init() { maplet = new Maplet(myMap)。 (new MPoint(北京市 ), 8)。 (myicon)。 // 将标注点 POI 添加到地图上。 } /script /head body onLoad=init()。 div id=myMap style=width:640px。 height:480px/div /body /html 代码执行 图例 操作说明：单击标注点图标，界面弹出标注点气泡信息框。 在地图上添加 1条折线（面） 在地图上划 折线，也丌过是几行代码的工作量。 代码 !DOCTYPE html PUBLIC //W3C//DTD XHTML Strict//EN html xmlns= head meta equiv=ContentType content=text/html。 charset=GBK title/title script language=javascript src= 地图操作接口分册 机密 第 13 页 共 50 页 script type=text/javascript language=javascript var myBrush = new MBrush(FF0000,3)。 // 创建用于折线的画笔 对象实例。 = true。 // 定义 画笔 是否填充线所包含的区域（面） = 00f。 // 定义 画笔 填充的背景色。 = 10。 // 定义画笔线粗细宽度。 var myPline = new MPolyline( // 创建 1 个折线对象实例。 [ new MPoint(39。 HEJJFUXVVHCWI39。 ), // 定义折线起点坐标。 new MPoint(39。 HERTVFXVVGWBA39。 ), // 定义折线中间点坐标。 new MPoint(39。 HEJJFUWVVGDFI39。 ) // 定 义折线终点坐标 ], myBrush, // 引用画笔。 new MInfoWindow(线的名称 , 线的内容 ) // 定义单击折线弹出的折线气泡信息框。 )。 function init() { maplet = new Maplet(myMap)。 (new MPoint(北京市 ), 8)。 (myPline)。 } /script /head body onLoad=init()。 div id=myMap style=width:640px。 height:480px/div /body /html 执行代码图例 地图操作接口分册 机密 第 14 页 共 50 页 操作说明：单击折线任意点，界面弹出折线气泡信息框。 地图基本操作 演示在地图上定制多个支持地图基本操作功能的按钮，单击这些按钮时，执行按钮提示的操作功能。 程序看起来似乎复杂，实际很单纯，克隆 14 行代码，满足 14 中地图操作功能演示。 代码 html head meta equiv=ContentType content=text/html。 charset=GBK / titleMapbar Map/title style // 删除了本段格式风格定义描述内容。 /style script type=text/javascript src= script language = javascript var maplet。 var oo = true。 function init() { maplet = new Maplet(mapbar)。 (new MPoint(泉州市 ),8)。 (new MStandardControl())。 } function getCenter() { 地图操作接口分册 机密 第 15 页 共 50 页 var str = ()。 return ((amp。 ctr=) + 5, (amp。 client=))。 } /script /head body onload = init()。 leftmargin=10 topmargin=10 marginheight=0 marginwidth=0 table width=830 cellpadding=0 cellspacing=0 border=0 tr td width=500 div id=mapbar style=position:relative。 top:0。 left:0。 width:500px。 height:350px。 border:0。 // 地图显示区。 /td td style=paddingleft:10px。 valign=top div style=paddingbottom:5px。 input type=button onClick=(39。 zoomin39。 )。 value=拉框放大 style=border:1 solid 999999。 fontsize:12px。 paddingtop:2px。 /div div style=paddingbottom:5px。 input type=button onClick=(39。 zoomout39。 )。 value=拉框缩小 style=border:1 solid 999999。 fontsize:12px。 paddingtop:2px。 /div div style=paddingbottom:5px。 input type=button onClick=()。 value=逐级放大 style=border:1 solid 999999。 fontsize:12px。 paddingtop:2px。 /div div style=paddingbottom:5px。 input type=button onClick=()。 value=逐级缩小 style=border:1 solid 999999。 fontsize:12px。 paddingtop:2px。 /div div style=paddingbottom:5px。 input type=button onClick=(39。 pan39。 )。 value=地图移动 style=border:1 solid 999999。 fontsize:12px。 paddingtop:2px。 /div div style=paddingbottom:5px。 input type=button onClick=()。 ean()。 value=地图清除 style=border:1 solid 999999。 fontsize:12px。 paddingtop:2px。 /div div style=paddingbottom:5px。 input type=button onClick=(0,200)。 value=地图上移 style=border:1 solid 999999。 fontsize:12px。 paddingtop:2px。 /div div style=paddingbottom:5px。 input type=button onClick=(0,200。