Question

我已经创建了此传单地图：

//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}},

我收到一条错误消息：Uncaught TypeError：无法读取null的属性“功能”。有什么想法我做错了吗？如果我将json的变量名“ SFcoworking”输入到data.features.forEach函数中，它仍然会失败。

Answer 1

问题解决了。在函数内本地声明的SFCoworking数据。糟糕！

在传单地图上使用D3将JSON覆盖问题

1 个答案: