D3 Examples - Putting TopoJSON on a Google Map

xxxxxxxxxx
 
<!DOCTYPE html>
<html>
<head>
  <title>HTML5</title>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=650, user-scalable=yes">
​
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
  </script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  <script src="https://d3js.org/topojson.v1.min.js"></script>
​
  <style>
​
    html, body {
      height: 100%;
      margin: 0;
    }
​
    #mapcanvas{
​
      height:100%;
    }
​
  </style>
​
  <script>
​
​
   var geoJsonObject;
   var thejson;
​
   $(document).ready(function(){
​
​
​
  var mapOptions = {
    zoom: 5,
    center: new google.maps.LatLng(38.284335, -120.833818),
    mapTypeId: google.maps.MapTypeId.TERRAIN
  };
​
  map=new google.maps.Map($('#mapcanvas')[0], mapOptions);
​
//county.json is a topojson file
​
  $.getJSON("county.json", function(data){
        geoJsonObject = topojson.feature(data, data.objects.county)
        map.data.addGeoJson(geoJsonObject); 
      }); 
​
​
​
  });//end document ready
​
​
 </script>
 
</head>
<body>
  <div id="mapcanvas">
  </div>
</body>
​
​
</html>
    