如何在Google地图上叠加topojson文件?

时间:2015-05-02 08:16:08

标签: google-maps d3.js overlay topojson

嗨,所以我有一个名为topojson文件的文件,它使用以下代码绘制nyc学区。但是说我想把这张图画放在谷歌地图上。我怎样才能做到这一点?如何在谷歌地图上叠加这个...我已经尝试了一些方法,但它们没有工作,现在我很困惑。

var sdData = {};

d3.json('nyc_school_districts.topojson', function(data){

var h = 500,
    w = 500,
    id = '',
    g;

var svg = d3.select('#map')
            .append('svg')
            .attr('height', h)
            .attr('width', w);

var proj = d3.geo.mercator()
                .center([-73.95,40.69])
                .scale(45000)
                .translate([w/2, h/2]);
var path = d3.geo.path().projection(proj);


// tip for map
var tip = d3.tip()
    .html(function(d){return '<b>' + d.id + '</b>'})

// mouseover for map
function mapMove() {

    return svg.call(tip);
};

var nyc = svg.selectAll("path")
            .data(topojson.feature(data,data.objects.nyc_school_districts).features)
            .enter()
            .append('path')
            .attr('class', function(d){return "sd "+ d.id})
            .attr('d', path)
            .on('mousemove', tip.show)
            .on('mouseout', tip.hide)
            .on('mouseover', function(d){id=d.id;mapMove()});

});

0 个答案:

没有答案