谷歌地图不显示[重复]

Question

我正在尝试将谷歌地图与 d3 一起使用，但是，尽管控制台日志似乎表明一切正确，但实际地图并未显示（还有标记）。我什至尝试删除标记覆盖，但地图也不显示。

var cx; var cy;
var width  = 1000;
var height = 800;

// Create the Google Map…
var map = new google.maps.Map(d3.select("#map") .node(), {
zoom: 111, // was 11
center: new google.maps.LatLng(43.7, -79.4),
mapTypeId: google.maps.MapTypeId.ROADMAP
}
); // end new map

var circles;
var imageAttributes = {height:32, width:32, x:-16, y:-16};

d3.json("/mydrupal/sites/default/d3_files/json/members google.json?nocache=" + (new Date()).getTime(),function(error,data) 
{
var overlay = new google.maps.OverlayView();
// Add the container when the overlay is added to the map.
overlay.onAdd = function() {
var layer = d3.select(this.getPanes()
    .overlayLayer)
    .append("div")
    .attr("class", "members"); // end var layer
// Draw each marker as a separate SVG element.
// We could use a single SVG, but what size would it have?
overlay.draw = function() {
  var projection = this.getProjection(),
      padding = 10; // end var projection
  var marker = layer.selectAll("svg")
      .data(d3.entries(data))
      .each(transform) // update existing markers
    .enter()
      .append("svg:svg")
      .each(transform)
      .attr("class", "marker"); // end var marker
  // Add a circle.
  marker.append("svg:circle")
      .attr("r", 4.5)
      .attr("cx", padding)
      .attr("cy", padding); // end marker append circle
  // Add a label.
  marker.append("svg:text")
      .attr("x", padding + 7)
      .attr("y", padding)
      .attr("dy", ".31em")
      .text(function(d) { 
            return d.key; 
           }); // end text and marker append

  function transform(d) {
    d = new google.maps.LatLng(d.value[0], d.value[1]);
    d = projection.fromLatLngToDivPixel(d);
    return d3.select(this)
        .style("left", (d.x - padding) + "px")
        .style("top", (d.y - padding) + "px");
   } // end transform 
}; // end overlay draw
}; // end overlay add function

// Bind our overlay to the map…
overlay.setMap(map); 
}); //  end members json

我在 http://jsfiddle.net/PatriciaW/seut5/ 创建了一个 jsfiddle

有什么明显的我忽略了（我想是的。）

Answer 1

我更新了 geocodezips jsfiddle，你没有包含 d3js 或 google maps api，你也没有包含地图的标签。

<div id="map"></div>

这是链接

http://jsfiddle.net/seut5/2/