无法在d3.geo映射中显示csv数据

时间:2015-03-20 15:50:17

标签: dictionary d3.js topojson

我想在我的地图中显示csv数据。我从json数据创建的地图。但现在它没有显示任何csv数据,只显示了json数据。

tootip.html(“区:”+“\ n”+ d.id + d.Family_Feud_m) 这里d.id的“id”来自json文件,d.Family_Feud_m来自csv文件的“Family_Feud_m”。

这是我的完整js代码:

var Districts=[];

var bardata = [];

var width = 500,
    height = 700;
var scal = 5000;

var tootip = d3.select('body')
            .append('div')
            .style('position','absolute')
            .style('padding','0 10px')
            .style('background','white')
            .style('opacity',0)


var projection = d3.geo.mercator()
    .scale(scal)
    .translate([-76.5/50.0 * scal, scal/2-scal/55]);

var path = d3.geo.path()
    .projection(projection);

var svg = d3.select(".viewer")
    .append("svg")
    .attr("width", width)
    .attr("height", height);

function redrawMap()
{
      svg.selectAll(".subunit")
        .style('fill',function(d){
            amount = Districts[d.id];
            if(amount == 0 || amount== undefined)
                return 'rgba(0,0,0,0.5)';

            return 'rgba(43,120,200,'+amount*1.0/10.0+')';
        });

}


 d3.csv('./data/resultsuicide.csv',function(data){
    console.log(data)
    for(key in data) {
        bardata.push(data[key].value)
    }


d3.json("./data/bd.json", function(error, bd) {
  svg.selectAll(".subunit")

      .data(topojson.feature(bd, bd.objects.subunits).features)
    .enter().append("path")
      .attr("class", function(d) { return "subunit " + d.id; })
      .attr("d", path)
      .on('mouseover',function(d){

        tootip.transition()
        .style('opacity',.9)
        tootip.html(" District :"+"\n" +d.id +d.Family_Feud_m)
        .style('left',(d3.event.pageX-35)+'px')
        .style('top',(d3.event.pageY-30)+'px')
        tempcolor = this.style.fill;
        d3.select(this)

        .style('opacity',.5)
        .style('fill','green')

    })

    .on('mouseout',function(d){
        d3.select(this)

        .style('opacity',1)
        .style('fill',tempcolor)
    })


    redrawMap();
});


});

//提前谢谢

0 个答案:

没有答案