基于百度地图api房地产展示系统实现

《基于百度地图api房地产展示系统实现》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、基于百度地图API房地产展示系统实现　　摘要：针对房地产楼盘信息量大，可视化能力差的问题，详细讲解了房地产展示系统的体系结构和基于百度地图API开发系统的具体步骤，为基于百度地图API开发系统提供一定的实践经验和技术支持。关键词：百度地图API；JavaScript；房地产中图分类号：TP319文献标识码：A文章编号：16727800（2012）0090163020引言随着我国经济的快速发展，人们购房的刚性需求不断增加，开发企业及楼盘不断增加，房地产市场管理比较混乱。如何对房地产行业进行规范并合理地管理；如何让群众更便捷地掌握全市的房产信息，了解购房的注意事项等问题；如何给开发

2、企业提供一个发布信息、展示自我能力的平台，这些问题都摆在了房地产市场管理部门的面前。因此，房地产市场管理部门急需一个平台来规范管理、展示自我、方便销售。这能够对房地产市场、购房群众和开发企业起到统一的协调作用，能服务并推动房地产事业的发展。1BaiDu地图API简介5百度地图API是一套应用程序接口。通过API，只需简单的操作，即可在自己的应用中构建功能丰富、个性化的、高效的地图功能。API中包含了构建地图基本功能的多个接口，提供了诸如位置搜索、周边查询、出行路线规划等功能服务。百度地图API服务是免费开放的，提供了基于移动设备和浏览器的两套API。基于不同编程方式可以将其分为

3、百度地图APIJavaScript版、API移动版、静态图版、Flash版、Web服务版等几个版本。其具有以下特色功能：①新版团购插件，无需开发，即可使用，并提供3种智能化的地图创建方式；②Library百度地图，Library是一套基于百度地图API二次开发的开源代码库；③百度移动定位API；④基于智能移动平台的接口，使用者可随时获得当前的精准地理位置；⑤PlaceAPI，发送HTTP请求，返回POI检索的数据；⑥地图名片，可视化制作带地图的企业名片，只需简单输入企业信息；⑦车联网API，汽车上的位置服务接口，含测距及发送到汽车上的交通、天气等信息。2系统架构与实现系统开发的

4、总体目标是在当前流行的互联网平台上，利用现有的开发工具，结合BaiDu地图API，开发一个人机交互界面友好、操作简单的、易于维护的、具有简单WEBGIS功能的房产展示系统。2.1系统架构5房地产展示系统采用浏览器/服务器（B/S）模式，客户可以通过浏览器在网上查询自己想要的楼盘信息，开发企业可以通过后台管理页面将信息发布到Internet上，房地产市场管理办公室可以通过审核功能和编辑功能对房源信息进行管理操作，上述这些都是用户通过浏览器操作。开发企业的房源信息数据存储在SQLServer中，通过WebServer读取数据，BaiDu地图服务则借助于浏览器把数据展示在地图上。具体

5、系统架构如图1所示。2.2系统的实现在房地产展示系统中，WebServer服务器端基于asp.net开发，百度地图API采用的是JavaScript版本。以下为系统具体实现步骤。（1）获取百度地图API。在使用JavaScript版的地图API之前需要通过（2）设置地图显示区域。在前台aspx页面中的标签中，通过定义标签来显示地图，并定义CSS样式。注意，在aspx页面内显示地图的标签，不能嵌套在标签内。根据该系统的需求，设置显示区域为全屏，因此，该标签样式的宽和高设置为100%。具体代码如下：　　在前台js代码中，可以调用该类中的函数获得数据，示例代码为：vards=Read

6、Data.GetMapData（）.value；5获得的变量ds是一个数据集类型变量，也即是表类型变量。在显示时，可以通过循环来实现数据的输出。（5）楼盘信息的展示。获得数据后，要利用前台提供的样式和BaiDu地图API提供的对象设计楼盘信息的展示形式。展示楼盘的位置，获得证件类型和名称，可以定义Icon对象、Label对象和Marker对象。展示楼盘的基本信息，可以定义InfoWindow对象。示例代码如下：varmyIcon=newBMap.Icon（”images/green.png”，newBMap.Size（13，21））；varmarker=newBMap.Mark

7、er（point1，{icon：myIcon}）；varlabel=newBMap.Label（data，{“offset”：newBMap.Size（10，-6）}）；marker.setLabel（label）；varinfoWindow=newBMap.InfoWindow（sContent）；（6）添加楼盘图例。根据楼盘的类型，在地图空间中的楼盘名字已显示成不同的颜色，而为了使地图具有更好的可读性，可以通过添加图例的方法来实现。在此，利用Photoshop做出一张图例的图片，通过JS