出于项目的需要，还要继续对MapABC进行研究，昨天看了下地图上加点，结合项目实际写了个例子，用Struts2结合MapABC实现。
有一点请注意：使用Mapabc的话，页面编码必须是utf-8。
下面是具体的实现页面enInfor.jsp:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<%@ page language="java" pageEncoding="utf-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%
String path = request.getContextPath();
%>
<html>
<head>
<title>企业用户基本信息</title>
<script type="text/javascript" src="http://api.mapabc.com/fmp/v1.0/js/fmp.js?key=a12d3fe7926bb4d1e88a902e53a13c4e0cd06cdf83c3e5925aed194ee24cca1ee1168fc5032b616a"></script>
<script type="text/javascript" src="http://api.mapabc.com/fmp/v1.0/js/mapcomponent.js?key=a12d3fe7926bb4d1e88a902e53a13c4e0cd06cdf83c3e5925aed194ee24cca1ee1168fc5032b616a"></script>
<link href="<%=path %>/common/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="inforContent">
<div id="inforMsg">
<s:form action="/user/enRegister.action">
<table align="center">
<tr>
<th colspan="2" align="center">企业用户信息填写</th>
</tr>
<tr>
<td>企业名称：</td>
<td><input type="text" name="enterprise"></td>
</tr>
<tr>
<td>企业电话：</td>
<td><input type="text" name="tel"></td>
</tr>
<tr>
<td>企业地址：</td>
<td><input type="text" name="address"></td>
</tr>
<tr>
<td>企业描述：</td>
<td><textarea rows="5" cols="15" name="description"></textarea></td>
</tr>
<tr>
<td>经营范围：</td>
<td><input name="dealInArea" type="checkbox" value="餐饮">餐饮
<input name="dealInArea" type="checkbox" value="娱乐">娱乐
<input name="dealInArea" type="checkbox" value="休闲">休闲 </td>
</tr>
<tr>
<td>纬度坐标：</td>
<td>
<input type="text" id="enLat" name="enLat" disabled="disabled">
</td>
</tr>
<tr>
<td>经度坐标：</td>
<td>
<input type="text" id="enLng" name="enLng" disabled="disabled">
</td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="submit" value="提交">
<input type="reset" value="重写">
</td>
</tr>
</table>
</s:form>
</div>
<div id="mapControl">
<div id="mapMsg"> 地图显示区域 </div>
<div id="control">
<input type="button" value="标注所在地" onclick="beginDrawPointOnMap();">
</div>
</div>
<!--注意加载位置，一定要在DIV声明之后-->
<script type="text/javascript" src="<%=path%>/common/map.js"></script>
</div>
</body>
</html>
style.css是样式文件，很简单的：
@charset "utf-8";
/* CSS Document */
#inforContent{
background:#999999;
width:90%;
}
#inforMsg{
width:40%;
float:left;
}
#mapControl{
width:60%;
height:400px;
float:left;
}
#mapMsg{
width:100%;
height:350px;
float:left;
}
#control{
width:100%;
height:50px;
float:left;
}
具体的地图操作位于map.js文件中：
//创建一个MmapOptions对象
var mapOptions = new MMapOptions();
//设置地图组件的Id
mapOptions.mapId = "fmptest";
//设置地图的初始Zoom值
mapOptions.zoomLevel = 15;
//创建地图对象
var mapObj = new MMap("mapMsg", mapOptions);
//使用组件API
var mapComponent = new MapComponent(mapObj);
//设置城市中心点
mapComponent.setMapCityCenter("0371");
//企业用户标注自己位置事件
mapObj.addEventListener(MMap.EVENT_POINT_DRAWN,getCenterLatLng);
//得到标点的经纬度坐标
function getCenterLatLng(event){
var center = mapObj.getCenterByLatLng();
//对enLat文本进行赋值
document.getElementById("enLat").value=center.lat;
//对enLng文本进行赋值
document.getElementById("enLng").value=center.lng;
//画点结束后，结束画点操作
mapObj.quitMouseDraw();
}
//对进入编辑模式下的tip进行填充内容
function fillPointContent() {
var defaultPointStyle = new MStyle();
defaultPointStyle.canBeTop = false;
return defaultPointStyle;
}
//开始在地图上画点
function beginDrawPointOnMap()
{
var pointStyle = fillPointContent();
pointStyle.textContent = "鼠标画点";
mapObj.beginDrawPointOnMap(pointStyle);
}
以上就是全部的代码，后面会把这些坐标存储至数据库中，下次用户看的时候就可以直接显示信息啦。
分享到：
相关推荐
在IT行业中，电子地图是一种基于GIS（地理信息系统）技术，结合Web技术实现的交互式地图服务。它们可以提供位置查询、导航、路线规划等多种功能，广泛应用于交通、旅游、生活服务等多个领域。"MAPABC电子地图代码"是...
首先，我们需要了解地图坐标系统。在地图服务中，常见的坐标系统包括WGS84、GCJ-02（火星坐标）和BD-09（百度坐标）。在中国，由于国家安全考虑，通常使用的是GCJ-02坐标系，它对WGS84坐标进行了偏移处理。MapABC...
2. **定位与标注**：API支持获取用户当前位置，并能在地图上添加自定义标注，展示特定地点或兴趣点。这在地理信息展示、商业选址分析等方面非常实用。 3. **地理编码与反地理编码**：地理编码是将地址转换为经纬度...
这个示例创建了一个基本的MapABC地图，设置ID为"fmptest"，缩放级别为10，中心点位于北京。 总的来说，MapABC电子地图应用不仅提供了丰富的地图服务，还通过API开放了地图功能，使得开发者能够构建个性化的地图应用...
首先引入MapABC的JavaScript库，然后定义地图容器，设置地图选项（如地图ID、初始缩放级别、中心点坐标），最后创建MMap对象来实例化地图。这个“Hello, World”程序向我们展示了MapABC地图API易用性和灵活性的一面...
电子地图站点是现代互联网技术与地理信息系统（GIS）结合的产物，它们提供了丰富的地图服务，包括卫星影像、栅格地图、三维视图等，让用户能够方便地查询地理位置、规划路线和获取相关地理信息。以下是一些典型的...
通过调用`new MapABC.Map()`方法创建地图实例，传入容器ID和地图配置参数，如中心点坐标、初始缩放级别等。 三、地图控制 MapABC API 提供了各种地图控制，如缩放控件、平移控件、指南针等。这些控件可以方便地添加...
MapABC地图应用程序编程接口是北京图盟科技有限公司提供的一套用于构建地图应用的API，主要包含Ajax API（Ajax地图展现）2.1.2公众版。这个API允许开发者使用JavaScript在HTML页面中创建自定义的Ajax地图应用，同时...
再者，MapABC API允许开发者在地图上添加自定义图层，包括点、线和框。点通常表示地理位置，可以用来标记兴趣点；线则常用于描绘路径或路线，例如导航应用中的驾车路线；而框则可以用来围住特定的地理区域，如城市...
- **MMarker**：用于在地图上添加标记点。 - **MPolyline**：用于在地图上绘制线。 - **MArea**：基类，用于表示封闭区域，包含子类MCircle、MRectangle、MPolygon等。 **3. 参数选项对象** 这些对象用于设置...
快速入门通常会指导开发者如何在网页中引入MapABC API库，设置地图的基本参数，如中心点坐标、缩放级别，并展示如何加载地图。开发者可以通过简单的HTML和JavaScript代码，快速构建一个基本的在线地图应用。 三、...
当用到CLLocationManager 得到的数据转化为火星坐标, MKMapView不用处理 API 坐标系 百度地图API 百度坐标 腾讯搜搜地图API 火星坐标 搜狐搜狗地图API 搜狗坐标 阿里云地图API 火星坐标 图吧MapBar地图...
MapABC的基础使用 多点添加 地图交互 工具条样式修改 弹出信息泡泡等
1.了解MapABC地图 2.MapABC地图服务平台的产品特点？ 3.MapABC地图服务平台总体架构 4.MapABC Web API 简介 5.MapABC Ajax API（Ajax地图展现） 6.如何使用MapABC Ajax API（Ajax地图展现） ？ 7.如何使用MapABC ...
MapABC地图API是一款广泛应用于地理信息系统（GIS）开发中的工具，为开发者提供了在网页上集成地图功能的能力。这个压缩包包含四个不同版本的MapABC地图API文档：Flash版、JavaScript版、Silverlight版和Flex版，...
MapABC地图API JavaScript版
MapABC Flex API 示例代码用户手册开发包是一份珍贵的学习资源，专门为那些想要深入理解并使用MapABC Flex API的开发者设计。MapABC是一家提供地图服务的公司，其Flex API是用于在网页应用中集成动态地图功能的开发...
当用到CLLocationManager 得到的数据转化为火星坐标, MKMapView不用处理 API 坐标系 百度地图API 百度坐标 腾讯搜搜地图API 火星坐标 搜狐搜狗地图API 搜狗坐标 阿里云地图API 火星坐标 图吧MapBar地图...