html,css怎么做一个可以区域划分的地图？
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了html,css怎么做一个可以区域划分的地图？相关的知识，希望对你有一定的参考价值。
在地图上我可以划分几个省为一个区域，点击这个区域还可以在上方弹出气泡提示，里面有代理点信息。
百度地图，高德地图等有这样的功能吗？如果没有大家可以给一下设计思路，谢谢
百度地图api:http://lbsyun.baidu.com/index.php?title=jspopular
补充：要做离线最好别用web端来做。后来发现，echarts来实现你的需求应该也是可以的（http://echarts.baidu.com/demo.html#map-world-dataRange） 参考技术A 申请百度地图的密钥，过程如下链接
11如何申请百度地图API密匙
然后便捷代码：
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>地图</title>
<style type="text/css">
htmlheight:100%
bodyheight:100%;margin:0px;padding:0px
#containerheight:100%
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=GbLBG0iSnUi7hvBVdWxAm0qCvK46SsFu">//2.0版本
</script>
</head>
<body>
<div id="container"></div>
<script type="text/javascript">
var map = new BMap.Map("container"); // 创建地图实例
var point = new BMap.Point(119.3,26.08); // 创建点坐标
map.centerAndZoom(point, 15); // 初始化地图，设置中心点坐标和地图级别
var marker = new BMap.Marker(point); // 创建标注
map.addOverlay(marker); //将标注添加到地图中
var opts1 = type: BMAP_NAVIGATION_CONTROL_LARGE
map.addControl(new BMap.NavigationControl(opts1));
var opts2 = offset: new BMap.Size(150, 5)
map.addControl(new BMap.ScaleControl(opts2));
map.addControl(new BMap.OverviewMapControl());
map.addControl(new BMap.MapTypeControl());
map.setCurrentCity("福州");
</script>
</body>
则显示如开始的图片
希望我的回答可以帮到您哦 参考技术B 电子地图标注软件可以标注位置，可以搜索地图上本来有的位置和标注的位置，可以把某个标注的位置显示在地图中心。软件有很多功能，请用户们来体验吧！
软件支持电脑在线（离线）地图查看浏览，支持无人机航拍地图导入！
1.支持谷歌在线（离线）百度地图，百度卫星地图，混合卫星地图，普通地图，地形地图，微软电子地图，微软卫星地图，bing地图，高德地图，在软件界面上可以选择地图类型切换；
2.支持1-20级的地图随意缩放，鼠标右键拖动漫游。
3.支持名称查询定位，可以输入地点名称后定位到所查询的位置。
4.支持坐标查询定位，可以输入坐标数值后定位的所查询的位置。
5.支持用户自定义信息，信息高级查询，查询结果实时定位。
6.支持在地图上所选择的标注能点击查看详细信息。
7.支持添加地图标记，距离测量显示，地点名称显示。
8.支持保存您当前操作的文件，供日后打开再用，保证操作不会丢失。
9.支持添加自定义标识图标，用户可以更换图标。
10.新增批量导入导出数据功能，网络代理设置。
11.新增分类图层管理。
12.图标上方显示文字。
13.支持在地图上绘制路线。
14.支持gps卫星定位。
15.支持商圈范围功能。
16.支持出图带标注功能。
17.支持打印出图。
以上是关于html,css怎么做一个可以区域划分的地图？的主要内容，如果未能解决你的问题，请参考以下文章