一、分析目的
1.探索上海市的房价区域分布
2.看看购房者都喜欢购买哪里的房子
二、数据采集
采集我爱我家上海区域的一万两千个小区的数据,采集的字段有小区、位置、最近30条成交套数、在售、在租、成交均价、成交总价、小区详细介绍等数据。直接上代码:
采集下来是这个样子的:
接着利用高德API把小区转换为经纬度坐标,这个代码就不贴了。转换之后变成这样:
三、数据可视化
利用百度地图API生成热力图。
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=ie1pboEhSttv7biL1iYj6kUI"></script> <script type="text/javascript" src="http://api.map.baidu.com/library/Heatmap/2.0/src/Heatmap_min.js"></script> <title>热力图功能示例</title> <style type="text/css"> ul,li{list-style: none;margin:0;padding:0;float:left;} html{height:100%} body{height:100%;margin:0px;padding:0px;font-family:"微软雅黑";} #container{height:500px;width:100%;} #r-result{width:100%;} </style> </head> <body> <div id="container"></div> <div id="r-result"> <input type="button" onclick="openHeatmap();" value="显示热力图"/><input type="button" onclick="closeHeatmap();" value="关闭热力图"/> </div> </body> </html> <script type="text/javascript"> var map = new BMap.Map("container"); // 创建地图实例 var point = new BMap.Point(121.409868, 31.208977); map.centerAndZoom(point, 15); // 初始化地图,设置中心点坐标和地图级别 map.enableScrollWheelZoom(); // 允许滚轮缩放 var points =[ {"lng":121.524245,"lat":31.234472,"count":5}, {"lng":121.525868,"lat":31.225027,"count":10}, {"lng":121.439535,"lat":31.133423,"count":5}, {"lng":121.511138,"lat":31.231639,"count":1} ]; if(!isSupportCanvas()){ alert('热力图目前只支持有canvas支持的浏览器,您所使用的浏览器不能使用热力图功能~') } //详细的参数,可以查看heatmap.js的文档 https://github.com/pa7/heatmap.js/blob/master/README.md //参数说明如下: /* visible 热力图是否显示,默认为true * opacity 热力的透明度,1-100 * radius 势力图的每个点的半径大小 * gradient {JSON} 热力图的渐变区间 . gradient如下所示 * { .2:'rgb(0, 255, 255)', .5:'rgb(0, 110, 255)', .8:'rgb(100, 0, 255)' } 其中 key 表示插值的位置, 0~1. value 为颜色值. */ heatmapOverlay = new BMapLib.HeatmapOverlay({"radius":50}); map.addOverlay(heatmapOverlay); heatmapOverlay.setDataSet({data:points,max:11}); //是否显示热力图 function openHeatmap(){ heatmapOverlay.show(); } function closeHeatmap(){ heatmapOverlay.hide(); } closeHeatmap(); function setGradient(){ /*格式如下所示: { 0:'rgb(102, 255, 0)', .5:'rgb(255, 170, 0)', 1:'rgb(255, 0, 0)' }*/ var gradient = {}; var colors = document.querySelectorAll("input[type='color']"); colors = [].slice.call(colors,0); colors.forEach(function(ele){ gradient[ele.getAttribute("data-key")] = ele.value; }); heatmapOverlay.setOptions({"gradient":gradient}); } //判断浏览区是否支持canvas function isSupportCanvas(){ var elem = document.createElement('canvas'); return !!(elem.getContext && elem.getContext('2d')); } </script>把point里面的数据替换成自己的坐标,修改一下半径和最大值,保存到本地,修改成index.html,放到容易找到的位置,然后利用python搭载简易的服务器,在cmd命令窗口,cd到index.html对应文件夹,然后输入
python -m http.server 80
接着用浏览器打开http://localhost:80
就可以看到热力图了。来看看最近30天成交的房子都是哪里的:
可以看出最近成交的房子主要集中在黄浦江旁边,看来大家都比较喜欢靠近江边的房子,房子成交最多的是闵行莘庄一带(估计是房价稍微便宜点)和浦东的外滩附近(估计是金融从业人士购买力比较强)。