长沙好房子网站 (长沙好房子网地图)

CSS (style.css) css body {font-family: Arial, Helvetica, sans-serif;margin: 0;padding: 0; }map {width: 100%;height: 100vh; }JavaScript (map.js) javascript // 创建地图 var map = L.map('map').setView([28.196440, 112.980850], 13);// 加载瓦片图层 L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {maxZoom: 19,attribution: '© OpenStreetMap contributors' }).addTo(map);// 获取所有好房源数据 var houses = [{id: 1,name: "万达广场",address: "芙蓉区万达广场",price: "1000000",type: "公寓",latitude: 28.196440,longitude: 112.980850},{id: 2,name: "香樟园小区",address: "雨花区香樟园小区",price: "800000", type: "住宅",latitude: 28.215830,longitude: 112.991360},{id: 3,name: "麓谷国际社区",address: "天心区麓谷国际社区",price: "1200000",type: "别墅",latitude: 28.161860,longitude: 112.957710} ];// 遍历好房源数据，在地图上添加标注 for (var i = 0; i < houses.length; i++) {var house = houses[i];L.marker([house.latitude, house.longitude]).addTo(map).bindPopup(` `); }结果这个HTML代码会创建一个交互式地图，其中包含长沙一些好房源的位置和信息。打开地图页面，用户可以放大、缩小、平移地图，以查找他们感兴趣的区域。当他们单击一个标注时，会弹出一个弹出窗口，显示房源的详细信息，如名称、地址、价格和类型。