2017-04-03 75 views
0

我有一个代码,需要一个谷歌地图,并上传一个D3层,它在V3和它的工作正常。现在我需要将其转移到V4,它给了我一个错误: “遗漏的类型错误:r是不是一个函数” 下面的代码被转移后,到V4d3从v3翻译到v4

<body> 
     <div id="map"></div> 
     <script> 
     var map = new google.maps.Map(d3.select("#map").node(), { 
      zoom: 7, 
      center: new google.maps.LatLng(31.5852,36.2384), 
      mapTypeId: google.maps.MapTypeId.ROADMAP, 

     styles: [ 

       {elementType: 'geometry', stylers: [{color: "#212121"}]}, 
       {elementType: 'labels.text.stroke', stylers: [{color: '#242f3e'}]}, 
       {elementType: 'labels.text.fill', stylers: [{color: '#746855'}]}, 

       ] 
     }); 

     d3.json("Export_Output_6_modified.json", function(error, jordanLevel2) { 
      if (error) throw error 

      //console.log(data[0].comuni[0].geometry.coordinates); 
      var overlay = new google.maps.OverlayView(); 

      overlay.onAdd = function() { 

      var layer = d3.select(this.getPanes().overlayLayer).append("div");//.attr("height",1000) 

      overlay.draw = function() { 

       layer.select('svg').remove(); 

       var w = 900; 
       var h = 900; 

       var color = ['#e41a1c', '#377eb8', '#4daf4a', '#984ea3', '#ff7f00', '#ffff33', '#a65628', '#f781bf', '#999999']; 
       var heat_color = d3.scaleLinear().domain([0, 1]).range(['#b2df8a', '#ff7f00']).interpolate(d3.interpolateHcl); 

       var overlayProjection = this.getProjection(); 

       // Turn the overlay projection into a d3 projection 
       var googleMapProjection = function(coordinates) { 
       var googleCoordinates = new google.maps.LatLng(coordinates[1], coordinates[0]); 
       var pixelCoordinates = overlayProjection.fromLatLngToDivPixel(googleCoordinates); 
       return [pixelCoordinates.x, pixelCoordinates.y]; 
       } 

       var path = d3.geoPath().projection(googleMapProjection); 

       var svg = layer.append("svg") 
       .attr('width', w) 
       .attr('height', h) 

       var g = svg.append('g') 
       .attr("id", "mapGroup"); 
    //I believe the problem is here.... 
       g.selectAll(".path") 
       .data(jordanLevel2.features) 
       .enter() 
       .append("path") 
       .attr("d", path) 
       .attr('class', 'state selected') 
       .style("fill", function(d, i) { 
        return color[i % color.length]; 
       }) 
       .style('opacity', .7); 

      } 
      } 
      overlay.setMap(map); 

     }); 
     </script> 
    </body> 

回答

-1

不幸的是,没有任何简单的方法来从V3到V4迁移。 v4版本是模块化的,并且是许多小型图书馆的集合,而不是一个大型图书馆。所以,这些变化是根本性的,可能会更好。我发现Irene Ros的presentation是迁移到v4的良好开端。另外,请参阅GitHub repo,其中有许多Scott书籍迁移到v4的示例。

+0

是的我知道,但在另一方面,我需要翻译具体的方面。 我阅读演示文稿它必须从投影转换为geoProjection,但也出现错误 – DANAA