在传单地图上用 d3 覆盖 json 的问题



我创建了这个传单地图:

//Create map element in DOM
<div id="map" class="sf" style="width: 600px; height: 400px"></div>

var map = L.map('map').setView([37.7701177, -122.40], 13);
mapLink = 
'<a href="http://openstreetmap.org">OpenStreetMap</a>';
L.tileLayer(
'http://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}.png', {
attribution: '&copy; ' + mapLink + ' Contributors',
maxZoom: 18,
}).addTo(map);

一切正常,但这是在 d3 框架中,我想使用 d3 覆盖一些点。

我加载了 json 数据:

var currentMap = d3.map();
d3.queue()
})
.defer(d3.csv, "data/SanFrancisco_CoWorkingTenants.json", function(cw) { 
console.log('cw')
})
.await(ready);

并尝试在传单地图上叠加这些点:

d3.json("data/SanFrancisco_CoWorkingTenants.json", function(data) {
/* Add a LatLng object to each item in the dataset */
data.features.forEach(function(d) {
d.LatLng = new L.LatLng(d.properties.Latitude,
d.properties.Longitude)
})

})

我的 json 是这样设置的:

var SFCoworking = {"type":"FeatureCollection", "features": [
{"type":"Feature","geometry":{"type":"Point","coordinates":[-122.39734599999997,37.79405200000008]},"properties":{"Bldg_Type":"Office","Bldg_Subty":"Office","Tenant":"HQ Global Workplaces","Tenant_Ind":"Finance","Tenant_I_1":"Real Estate","Tenant_Sub":"CoWorking/Flexible Space","Lease_Indu":"Finance","Lease_In_1":"Real Estate","Lease_Sub_":"CoWorking/Flexible Space","Local_Indu":"Real estate","Address":"50 California St","City":"San Francisco","State":"California","Zip":94111,"Bldg_Name":"50 California","Business_P":"","Market":"San Francisco","Submarket":"North Financial District","Micromarke":"","Prior_Loca":"","Bldg_Class":"A","Bldg_Sub_c":"No Value","Lease_Size":25826,"Suite":"","Floor_s_":"","View_Space":"","Space_Use_":"","Space_Use1":"","Office_s_f":"","Retail_s_f":"","Lab_s_f_":"","Docks":"","Docks_at_g":"","Docks_insi":"","Dock_Confi":"","Drive_Ins":"","Speed_Bay":"","Clear_Heig":"","Clear_He_1":"","Term__mos_":60,"Sign_Date":"2005-10-30T00:00:00.000Z","Commenceme":"2005-12-01T00:00:00.000Z","Move_in_Da":38687,"Expiration":"2010-11-30T00:00:00.000Z","Lease_Type":"Direct","Asking_Ren":"","First_Year":0,"Rent_Type":"Full Service Gross","Effective_":36,"Average_Re":36,"Shell_Rate":"","Office_Rat":"","Escalation":"","Escalati_1":"","Escalati_2":"","Escalati_3":0,"Free_Rent_":0,"Free_Rent1":"","Free_Ren_1":"","Rent_Comme":"","TIs_p_s_f_":0,"Improvemen":"","Submarket_":"CBD","Custom_Clu":"","Bldg_Size":687574,"Bldg_Statu":"Existing","Multi_floo":"No","Entire_flo":"Yes","Transactio":"","Footprint":"","Previous_L":"","Bldg_Leasi":"Shorenstein","Agency_Bro":"","Agency_B_1":"","Tenant_Bro":"","Tenant_B_1":"","Landlord_a":"","Current_La":"Shorenstein","Comments":"","Private_Co":"","Source":"","Full_Lease":"No","Followup_R":"No","Confidenti":"No","Corp__HQ_":"No","Total_Leas":"","OpEx_and_T":0,"Taxes":"","Insurance":"","Constructi":"","Industrial":"","Sprinkler_":"","Rail_Type":"","Crane_Serv":"","Crane_Coun":"","Crane_Capa":"","Crane_Hook":"","Crane_Comm":"","Broke_Grou":0,"Build_Date":25934,"Renovated_":35431,"Latitude":37.794052,"Longitude":-122.397346,"In_Leasing":"No","In_Statist":"Yes","In_Skyline":"Yes","Most_Expen":"Yes","Improvem_1":"","Prior_Addr":"","Prior_Buil":"","Prior_Subm":"","CoStar_Pro":320420,"CRM_Proper":"41FE1501-2DFB-E011-A40E-0026B952B32D","MDM_Proper":8254311,"MarketSphe":78718,"MarketSp_1":54771,"Created_On":42381.94861,"Created_By":"System Setup","Modified_O":43362.88333,"Modified_B":"","id":1,"ST_DESC":"lon = -122.397346; lat = 37.794052","OBJECTID":1}},

我收到一个错误,说:未捕获的类型错误:无法读取 null 的属性"功能"。 知道我做错了什么吗? 如果我将 json 的变量名称"SFcoworking"输入到 data.features.forEach 函数中,它仍然失败。

问题解决了。 在函数内本地声明 SFCowork 数据。 哎呀!

最新更新