Python 实现高德地图找房（三）：地图可视化与高德 JS API
·
Python 实现高德地图找房（三）：地图可视化与高德 JS API
你将学到：folium 交互式地图、热力图、区域标记、高德地图 JavaScript API、HTML 页面开发、地图交互功能
实验环境：node-04（120.46.44.194），华为云 FlexusX ECS
一、本篇概述
1.1 实验流程
本篇在 node-04 上完成地图可视化，产出两个可在浏览器中直接打开的 HTML 页面：
node-03 (上篇产出) node-04 (本篇)
┌───────────────────┐ ┌────────────────────────┐
│ houses_geocoded.json│ ── SCP ─> │ 第一部分: folium │
│ (含经纬度坐标) │ │ 交互式地图 + 热力图 │
└───────────────────┘ │ → house_map_folium.html│
│ │
│ 第二部分: 高德 JS API │
│ HTML 页面 + 筛选交互 │
│ → house_map_amap.html │
└────────────────────────┘
1.2 两种可视化方案对比
| 方案 | 技术 | 优点 | 缺点 |
|---|---|---|---|
| folium | Python 库 + Leaflet.js | 纯 Python 生成，无需 Key | 交互功能有限 |
| 高德 JS API | 原生 HTML + JS | 功能丰富，官方支持 | 需申请 JS API Key |
二、folium 交互式地图
2.1 folium 简介
folium 是 Python 的地图可视化库，基于 Leaflet.js 封装，能生成交互式 HTML 地图。
folium 架构：
┌─────────────────────────────────┐
│ Python 代码 │
│ folium.Map() / Marker() │
└────────────┬────────────────────┘
│
▼
┌─────────────────────────────────┐
│ Leaflet.js (JS) │
│ 地图渲染引擎 │
└────────────┬────────────────────┘
│
▼
┌─────────────────────────────────┐
│ HTML 文件 │
│ house_map_folium.html │
│ (浏览器打开即可交互) │
└─────────────────────────────────┘
2.2 安装
pip3 install --break-system-packages folium
# 验证
python3 -c "import folium; print(folium.__version__)"
# 0.19.5
2.3 创建基础地图
import folium
import json
import pandas as pd
# 加载地理编码数据
with open('/root/houses_geocoded.json', 'r', encoding='utf-8') as f:
data = json.load(f)
df = pd.DataFrame(data)
# 深圳中心坐标
sz_center = [22.543, 114.058]
# 创建地图
m = folium.Map(
location=sz_center,
zoom_start=11, # 初始缩放级别
tiles='OpenStreetMap', # 底图样式
control_scale=True, # 显示比例尺
)
| 参数 | 说明 | 常用值 |
|---|---|---|
location |
地图中心 [纬度, 经度] | [22.543, 114.058] |
zoom_start |
初始缩放级别 | 1-20，11 表示城市级 |
tiles |
底图样式 | OpenStreetMap/CartoDB positron/Stamen Terrain |
control_scale |
显示比例尺 | True/False |
2.4 添加房源标记（Marker）
# 价格颜色分级函数
def price_color(price):
if price >= 6000: return 'red' # 红色: 高价
elif price >= 4000: return 'orange' # 橙色: 中高
elif price >= 2500: return 'green' # 绿色: 中等
else: return 'blue' # 蓝色: 低价
# 为每条房源添加标记
for h in data:
popup_html = f"""
<div style="font-size:12px; min-width:200px;">
<h4 style="margin:0 0 5px 0; color:#333;">{h['title']}</h4>
<table style="width:100%; border-collapse:collapse;">
<tr><td style="color:#FF6B6B; font-weight:bold;">
💰 {h['price']}元/月</td></tr>
<tr><td>📐 {h['area']}㎡ · {h['rooms']}</td></tr>
<tr><td>🧭 朝向: {h['direction']}</td></tr>
<tr><td>📍 {h['address']}</td></tr>
<tr><td>🏷️ {h['tags']}</td></tr>
<tr><td>🏢 {h['floor']} · {h['years']}年建</td></tr>
</table>
</div>
"""
folium.Marker(
location=[h['latitude'], h['longitude']],
popup=folium.Popup(popup_html, max_width=250),
tooltip=f"{h['title']} - {h['price']}元/月",
icon=folium.Icon(
color=price_color(h['price']),
icon='home',
prefix='fa'
),
).add_to(m)
Marker 关键参数：
| 参数 | 说明 | 示例 |
|---|---|---|
location |
标记位置 [纬度, 经度] | [22.539, 113.946] |
popup |
点击弹出的内容 | folium.Popup(html) |
tooltip |
悬停提示文字 | "科技园精装两居室" |
icon |
图标样式 | folium.Icon(color='red', icon='home') |
2.5 添加价格热力图（HeatMap）
from folium.plugins import HeatMap
# 热力图数据：[纬度, 经度, 权重值]
heat_data = [[h['latitude'], h['longitude'], h['price']/100] for h in data]
HeatMap(
heat_data,
radius=20, # 热力点半径（像素）
blur=15, # 模糊度
max_zoom=13, # 最大缩放级别
gradient={ # 渐变色
0.2: '#95E1D3', # 浅绿
0.4: '#4ECDC4', # 青色
0.6: '#45B7D1', # 蓝色
0.8: '#FF8C00', # 橙色
1.0: '#FF0000', # 红色
}
).add_to(m)
热力图效果：
低价区(浅绿) 高价区(红色)
┌─────────┐ ┌─────────┐
│ ● ● │ │ ●●●● │
│ ● ●● ● │ │ ●●●●●● │
│ ● ● │ │ ●●●● │
└─────────┘ └─────────┘
宝安/龙岗 南山/福田
1000-3000元 4500-12000元
2.6 添加区域中心标记（CircleMarker）
# 各区中心坐标
district_centers = {
'南山': (22.533, 113.930),
'福田': (22.523, 114.055),
'罗湖': (22.548, 114.130),
'宝安': (22.555, 113.883),
'龙华': (22.658, 114.037),
'光明': (22.745, 113.936),
'龙岗': (22.719, 114.246),
'盐田': (22.565, 114.258),
'坪山': (22.706, 114.350),
}
for dist, (lat, lng) in district_centers.items():
dist_data = df[df['district'] == dist]
avg_price = dist_data['price'].mean()
count = len(dist_data)
folium.CircleMarker(
location=[lat, lng],
radius=15,
popup=f"{dist}区: {count}套房源, 均价{avg_price:.0f}元/月",
tooltip=f"{dist}区",
color='#FF6B6B' if avg_price >= 5000 else '#4ECDC4',
fill=True,
fill_opacity=0.3,
weight=2,
).add_to(m)
2.7 保存地图
m.save('/root/house_map_folium.html')
2.8 folium 运行结果
root@node-04:~# python3 gaode_visualize.py
Python 高德地图找房 - 地图可视化
服务器: ecs-11e6-0004
============================================================
第一部分：folium 交互式地图
============================================================
[1] 数据加载: 25 条房源
[2] 创建基础地图
中心: [22.543, 114.058], 缩放: 11
底图: OpenStreetMap
[3] 添加房源标记（Marker）
已添加 25 个标记
[4] 添加热力图（HeatMap）
热力图已添加
[5] 添加区域中心标记（CircleMarker）
已添加 9 个区域标记
[6] folium 地图已保存: /root/house_map_folium.html
生成的 HTML 文件：house_map_folium.html（65KB），浏览器打开即可交互：
- 点击标记查看房源详情
- 鼠标悬停显示标题和价格
- 缩放/拖拽地图
- 热力图直观展示价格分布
2.9 folium 方法速查表
| 方法/类 | 说明 | 示例 |
|---|---|---|
folium.Map(location, zoom) |
创建地图 | Map(location=[22.5,114.0], zoom=11) |
folium.Marker(location, popup, icon) |
添加标记 | Marker([lat,lng], popup=html) |
folium.Icon(color, icon) |
标记图标 | Icon(color='red', icon='home') |
folium.Popup(html) |
弹出框 | Popup(html, max_width=250) |
folium.CircleMarker(loc, r) |
圆形标记 | CircleMarker([lat,lng], radius=15) |
HeatMap(data, radius, blur) |
热力图 | HeatMap([[lat,lng,val]], radius=20) |
m.save(filepath) |
保存为 HTML | m.save('map.html') |
m.add_child(layer) |
添加图层 | m.add_child(HeatMap(data)) |
三、高德地图 JavaScript API
3.1 JS API 简介
高德地图 JavaScript API 是高德开放平台提供的浏览器端地图 SDK，功能比 folium 更强大，支持自定义标记、信息窗体、路线规划等。
高德 JS API 架构：
┌──────────────────────────────┐
│ HTML 页面 │
│ ┌────────────────────────┐ │
│ │ <div id="container"> │ │ ← 地图容器
│ │ │ │
│ │ 地图渲染区域 │ │
│ │ │ │
│ └────────────────────────┘ │
│ │
│ <script> │
│ AMap.Map() 创建地图 │ ← JS API 调用
│ AMap.Marker() 添加标记 │
│ AMap.InfoWindow() 信息窗体 │
│ </script> │
└──────────────────────────────┘
│
▼
webapi.amap.com/maps?v=2.0 ← 高德云端服务
3.2 HTML 页面结构
完整的 HTML 页面分为三个部分：
HTML 页面结构：
┌─────────────────────────────────────┐
│ <head> 样式定义 │
│ CSS 样式（卡片、标签、筛选栏） │
├─────────────────────────────────────┤
│ <body> 页面布局 │
│ ┌─────────────────────────────┐ │
│ │ #header 标题栏 │ │
│ │ 🏠 深圳租房地图 · 高德找房 │ │
│ ├─────────────────────────────┤ │
│ │ .filter-bar 筛选栏 │ │
│ │ [区域▼] [价格] [面积] │ │
│ ├──────────────────┬──────────┤ │
│ │ #container │ #sidebar │ │
│ │ 地图渲染区域 │ 房源列表 │ │
│ │ │ 卡片列表 │ │
│ └──────────────────┴──────────┘ │
├─────────────────────────────────────┤
│ <script> JS 逻辑 │
│ 1. 加载房源数据 │
│ 2. 初始化地图 │
│ 3. 创建标记 │
│ 4. 渲染房源列表 │
│ 5. 筛选交互 │
└─────────────────────────────────────┘
3.3 Python 生成 HTML
关键技巧：使用字符串拼接而非 f-string，避免 JS 的 {} 被 Python 解析为字典。
def create_amap_html():
"""创建高德地图 JavaScript API HTML 页面"""
# 构造房源 JS 数据（用 % 格式化避免 f-string 解析 JS 的 {}）
houses_js = []
for h in data:
houses_js.append(
"{id:%d, title:'%s', price:%d, area:%s, rooms:'%s', "
"direction:'%s', address:'%s', district:'%s', "
"lng:%s, lat:%s, tags:'%s', floor:'%s', years:'%s'}" % (
h['id'], h['title'], h['price'], h['area'],
h['rooms'], h['direction'], h['address'],
h['district'], h['longitude'], h['latitude'],
h['tags'], h['floor'], h['years']
)
)
houses_js_str = ',\n '.join(houses_js)
total_count = len(data)
district_count = len(set(h['district'] for h in data))
# 使用三引号普通字符串 + 字符串拼接
html_content = """<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>深圳租房地图 - 高德地图找房</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Microsoft YaHei', sans-serif; }
#header {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white; padding: 12px 20px;
display: flex; align-items: center; justify-content: space-between;
}
#container { width: 100%; height: calc(100vh - 80px); }
#sidebar {
width: 320px; height: calc(100vh - 80px);
position: absolute; right: 0; top: 48px;
background: white; overflow-y: auto;
border-left: 2px solid #eee; padding: 10px;
}
.house-card {
border: 1px solid #eee; border-radius: 8px;
padding: 10px; margin-bottom: 8px;
cursor: pointer; transition: all 0.2s;
}
.price-badge {
display: inline-block; padding: 2px 6px;
border-radius: 3px; font-size: 11px; color: white;
}
.price-high { background: #FF0000; }
.price-mid-high { background: #FF8C00; }
.price-mid { background: #4ECDC4; }
.price-low { background: #95E1D3; }
</style>
</head>
<body>
<div id="header">
<h1>🏠 深圳租房地图 · 高德找房</h1>
<div class="stats">共 """ + str(total_count) + """ 套房源 · 涵盖
""" + str(district_count) + """ 个行政区</div>
</div>
<div class="filter-bar">
<label>区域筛选:</label>
<select id="districtFilter" onchange="filterHouses()">
<option value="">全部</option>
<option value="南山">南山</option>
<option value="福田">福田</option>
<!-- ... 更多区域 -->
</select>
<label>价格上限:</label>
<input type="number" id="priceFilter" placeholder="元/月"
onchange="filterHouses()">
<label>面积下限:</label>
<input type="number" id="areaFilter" placeholder="㎡"
onchange="filterHouses()">
</div>
<div id="container"></div>
<div id="sidebar">
<h3>房源列表</h3>
<div id="houseList"></div>
</div>
<!-- 高德地图 JS API -->
<script src="https://webapi.amap.com/maps?v=2.0&key=your_amap_js_key_here"></script>
<script>
// 房源数据
var houses = [
""" + houses_js_str + """
];
// 初始化地图
var map = new AMap.Map('container', {
zoom: 11,
center: [114.058, 22.543],
viewMode: '2D',
});
// 创建标记
var markers = [];
houses.forEach(function(h) {
var marker = new AMap.Marker({
position: new AMap.LngLat(h.lng, h.lat),
title: h.title + ' - ' + h.price + '元/月',
content: '<div class="price-badge '
+ priceColorClass(h.price) + '">'
+ h.price + '</div>',
offset: new AMap.Pixel(-15, -15),
});
marker.on('click', function() {
var infoWindow = new AMap.InfoWindow({
content: content,
offset: new AMap.Pixel(0, -30),
});
infoWindow.open(map, marker.getPosition());
});
markers.push(marker);
map.add(marker);
});
// 添加控件
map.addControl(new AMap.Scale());
map.addControl(new AMap.ToolBar({ position: 'LB' }));
</script>
</body>
</html>"""
with open('/root/house_map_amap.html', 'w', encoding='utf-8') as f:
f.write(html_content)
3.4 关键 JS 功能说明
3.4.1 价格颜色分级
function priceColorClass(price) {
if (price >= 6000) return 'price-high'; // 红色
if (price >= 4000) return 'price-mid-high'; // 橙色
if (price >= 2500) return 'price-mid'; // 青色
return 'price-low'; // 浅绿
}
价格分级示意：
≥6000元 4000-5999元 2500-3999元 <2500元
┌────┐ ┌────┐ ┌────┐ ┌────┐
│ 红 │ │ 橙 │ │ 青 │ │ 浅绿│
└────┘ └────┘ └────┘ └────┘
price-high price-mid-high price-mid price-low
3.4.2 房源列表渲染
function renderHouseList(filtered) {
var listHtml = '';
filtered.forEach(function(h) {
listHtml += '<div class="house-card" onclick="locateHouse(' + h.id + ')">'
+ '<div class="title">' + h.title + '</div>'
+ '<span class="price-badge ' + priceColorClass(h.price) + '">'
+ h.price + '元/月</span>'
+ '<div class="info">' + h.area + '㎡ · ' + h.rooms
+ ' · ' + h.district + '区</div>'
+ '<div class="tags">' + h.tags + '</div>'
+ '</div>';
});
document.getElementById('houseList').innerHTML = listHtml;
}
3.4.3 点击列表定位房源
function locateHouse(id) {
var h = houses.find(function(h) { return h.id === id; });
if (h) {
map.setCenter([h.lng, h.lat]); // 地图中心移动到该房源
map.setZoom(15); // 放大到街道级
// 弹出信息窗体
var marker = markers.find(function(m) {
return m.houseData.id === id;
});
if (marker) {
var infoWindow = new AMap.InfoWindow({
content: content,
offset: new AMap.Pixel(0, -30),
});
infoWindow.open(map, marker.getPosition());
}
}
}
3.4.4 多条件筛选
function filterHouses() {
var district = document.getElementById('districtFilter').value;
var maxPrice = parseInt(document.getElementById('priceFilter').value) || 99999;
var minArea = parseInt(document.getElementById('areaFilter').value) || 0;
// 过滤房源
var filtered = houses.filter(function(h) {
var matchDistrict = !district || h.district === district;
var matchPrice = h.price <= maxPrice;
var matchArea = h.area >= minArea;
return matchDistrict && matchPrice && matchArea;
});
// 清除旧标记
map.remove(markers);
// 添加筛选后的标记
var newMarkers = [];
filtered.forEach(function(h) {
var marker = new AMap.Marker({
position: new AMap.LngLat(h.lng, h.lat),
content: '<div class="price-badge '
+ priceColorClass(h.price) + '">' + h.price + '</div>',
offset: new AMap.Pixel(-15, -15),
});
newMarkers.push(marker);
map.add(marker);
});
markers = newMarkers;
renderHouseList(filtered);
}
3.5 运行结果
root@node-04:~# python3 gaode_visualize.py
Python 高德地图找房 - 地图可视化
服务器: ecs-11e6-0004
============================================================
第一部分：folium 交互式地图
============================================================
已添加 25 个标记
热力图已添加
已添加 9 个区域标记
folium 地图已保存: /root/house_map_folium.html
============================================================
第二部分：高德地图 JavaScript API HTML 页面
============================================================
高德JS API HTML已保存: /root/house_map_amap.html
地图可视化完成！输出文件：
/root/house_map_folium.html - folium交互式地图
/root/house_map_amap.html - 高德JS API地图页面
3.6 高德 JS API 方法速查表
| 方法/类 | 说明 | 示例 |
|---|---|---|
AMap.Map(container, opts) |
创建地图实例 | Map('div', {zoom:11, center:[]}) |
AMap.Marker(opts) |
创建标记点 | Marker({position: LngLat, title}) |
AMap.InfoWindow(opts) |
信息窗体 | InfoWindow({content: html}) |
AMap.LngLat(lng, lat) |
经纬度对象 | LngLat(114.058, 22.543) |
AMap.Scale() |
比例尺控件 | map.addControl(new Scale()) |
AMap.ToolBar() |
工具栏控件 | map.addControl(new ToolBar()) |
marker.on('click', fn) |
标记点击事件 | marker.on('click', callback) |
map.setCenter([lng,lat]) |
设置地图中心 | map.setCenter([114,22]) |
map.setZoom(level) |
设置缩放级别 | map.setZoom(15) |
map.add/remove(marker) |
添加/移除标记 | map.add(marker) |
四、踩坑记录
4.1 坑1：f-string 解析 JS 花括号（最严重）
问题：使用 Python f-string 生成 HTML 时，JS 对象的 {} 被 Python 解析为字典表达式：
# 错误写法 - f-string 会解析 JS 的 {}
html = f"""
<script>
var map = new AMap.Map('container', {{
zoom: 11, // {{ 需要转义
}});
houses.forEach(function(h) {{
var marker = new AMap.Marker({
position: new AMap.LngLat(h.lng, h.lat), // {} 被解析为字典！
});
}});
</script>
"""
错误信息：
KeyError: 'position: new AMap.LngLat(h.lng, h.lat)'
解决方案：改用普通字符串 + 字符串拼接：
# 正确写法 - 使用三引号普通字符串
html_content = """<script>
var map = new AMap.Map('container', {
zoom: 11,
});
</script>"""
# 动态数据用 % 格式化或字符串拼接
houses_js_str = ',\n'.join(houses_js)
html_content = html_content + houses_js_str + """</script>"""
4.2 坑2：中文字体缺失
问题：matplotlib 生成的图表中文显示为方框。
# 解决方案
apt-get install -y fonts-noto-cjk
# Python 中设置
plt.rcParams['font.sans-serif'] = ['Noto Sans CJK SC', 'SimHei', 'DejaVu Sans']
plt.rcParams['axes.unicode_minus'] = False
4.3 坑3：服务器无 GUI 环境
问题：matplotlib 默认使用 TkAgg 后端，服务器无显示设备会报错。
_tkinter.TclError: no display name and no $DISPLAY environment variable
解决方案：
import matplotlib
matplotlib.use('Agg') # 必须在 import pyplot 之前设置
import matplotlib.pyplot as plt
4.4 坑4：高德 JS API Key 类型
问题：使用 Web 服务 Key 打开 JS API 地图会报 INVALID_USER_KEY。
原因：高德 Key 分为不同类型，JS API 需要专门的「Web端(JS API)」类型 Key。
高德 Key 类型：
┌─────────────┬────────────────────────────┐
│ Web服务 │ REST API 调用（地理编码等） │
│ │ restapi.amap.com │
├─────────────┼────────────────────────────┤
│ Web端(JS API)│ 浏览器端 JS SDK │
│ │ webapi.amap.com/maps │
├─────────────┼────────────────────────────┤
│ Android SDK │ 安卓 App │
├─────────────┼────────────────────────────┤
│ iOS SDK │ iOS App │
└─────────────┴────────────────────────────┘
4.5 坑5：boxplot labels 参数移除
问题：matplotlib 3.10+ 移除了 boxplot() 的 labels 参数。
TypeError: Axes.boxplot() got an unexpected keyword argument 'labels'
解决方案：
# 旧写法（报错）
bp = ax.boxplot(data, labels=names)
# 新写法
bp = ax.boxplot(data, patch_artist=True)
ax.set_xticklabels(names)
五、两个 HTML 页面对比
5.1 功能对比
| 功能 | folium 版 | 高德 JS API 版 |
|---|---|---|
| 地图底图 | OpenStreetMap | 高德地图（更清晰） |
| 房源标记 | ✅ | ✅ |
| 信息弹窗 | ✅ HTML 弹窗 | ✅ InfoWindow |
| 价格热力图 | ✅ HeatMap | ❌（需额外开发） |
| 区域圆标 | ✅ CircleMarker | ❌ |
| 区域筛选 | ❌ | ✅ 下拉框 |
| 价格筛选 | ❌ | ✅ 输入框 |
| 面积筛选 | ❌ | ✅ 输入框 |
| 房源列表 | ❌ | ✅ 侧边栏卡片 |
| 点击定位 | ❌ | ✅ locateHouse() |
| 比例尺 | ✅ | ✅ |
| 工具栏 | ❌ | ✅ ToolBar |
| 需要 Key | ❌ | ✅ JS API Key |
| 文件大小 | 65KB | 16KB |
5.2 使用建议
选择决策树：
是否需要复杂交互（筛选/列表）？
│
├── 是 ──> 高德 JS API 方案
│ （需申请 JS API Key）
│
└── 否 ──> 是否需要热力图？
│
├── 是 ──> folium 方案
│ （无需 Key，开箱即用）
│
└── 否 ──> 两者皆可
六、完整数据流回顾
全流程数据流（4台服务器协作）：
node-01 (1.94.202.19) node-02 (120.46.159.92)
┌─────────────────────┐ ┌─────────────────────┐
│ gaode_crawler.py │ │ gaode_geocode.py │
│ │ │ │
│ requests + BS4 │ SCP │ 高德 API 地理编码 │
│ 25条房源数据采集 │ ─────> │ 地址→经纬度坐标 │
│ │ │ │
│ houses.csv (3.1KB) │ │ houses_geocoded.json│
│ houses.json (7.5KB) │ │ houses_geocoded.csv │
└─────────────────────┘ └─────────────────────┘
│
SCP │
▼
node-03 (124.70.105.142) node-04 (120.46.44.194)
┌─────────────────────┐ ┌─────────────────────┐
│ gaode_analysis.py │ │ gaode_visualize.py │
│ │ │ │
│ pandas 统计分析 │ SCP │ folium 交互式地图 │
│ matplotlib 六图 │ <───── │ 高德 JS API HTML │
│ │ │ │
│ plot_*.png × 6 │ │ house_map_folium │
│ (dashboard) │ │ house_map_amap │
└─────────────────────┘ └─────────────────────┘
七、小结
7.1 三篇博客核心知识点
| 篇号 | 知识点 | 核心库 |
|---|---|---|
| 第一篇 | HTTP 请求、HTML 解析、CSV 存储 | requests, BeautifulSoup, csv |
| 第二篇 | 地理编码、数据分析、图表绘制 | 高德 API, pandas, matplotlib |
| 第三篇 | 交互式地图、JS API、HTML 开发 | folium, 高德 JS API |
7.2 产出文件汇总
| 文件 | 服务器 | 大小 | 说明 |
|---|---|---|---|
houses.csv |
node-01 | 3.1 KB | 原始房源数据 |
houses.json |
node-01 | 7.5 KB | JSON 格式 |
houses_geocoded.json |
node-02 | 8.8 KB | 含坐标数据 |
houses_geocoded.csv |
node-02 | 3.5 KB | 含坐标 CSV |
plot_district_price.png |
node-03 | 64 KB | 各区均价柱状图 |
plot_price_distribution.png |
node-03 | 47 KB | 价格分布直方图 |
plot_area_price_scatter.png |
node-03 | 67 KB | 面积-价格散点图 |
plot_unit_price_rank.png |
node-03 | 49 KB | 各区单价排名 |
plot_room_type_box.png |
node-03 | 44 KB | 户型价格箱线图 |
plot_dashboard.png |
node-03 | 143 KB | 综合仪表盘 |
house_map_folium.html |
node-04 | 66 KB | folium 交互式地图 |
house_map_amap.html |
node-04 | 16 KB | 高德 JS API 地图 |
7.3 关键分析结论
- 福田区均价最高（6120元/月），龙岗区最低（2167元/月），差距 2.8 倍
- 南山区单价最高（74.4元/㎡/月），科技园和后海区域拉高均价
- 合租单间均价 1483 元，是整租均价（4070元）的 36%
- 近地铁标签出现 10 次，是最常见卖点
- 面积与价格呈正相关，但南山/福田存在明显的区位溢价
相关链接
- 第一篇：环境搭建与数据爬虫
- 第二篇：地理编码与数据分析
- 高德地图 JS API 文档：https://lbs.amap.com/api/javascript-api/summary
- folium 官方文档：https://python-visualization.github.io/folium/
- Leaflet.js 文档：https://leafletjs.com/
Agent 垂直技术社区，欢迎活跃、内容共建。
更多推荐
5
0- 0
已为社区贡献24条内容
所有评论(0)