Kılavuzluk öğesinin içindeki yaprakçık haritası?

Aşağıdaki koda sahipken, bir kılavuz öğesinin içine nasıl bir yaprakçık eşlemesi koyarım ve kılavuz öğesini yeniden boyutlandırdığımda, harita buna göre yeniden boyutlandırılır?Kılavuzluk öğesinin içindeki yaprakçık haritası?

<div gridster="gridsterOpts"> 
    <ul id="gridster-ul"> 
     <li ng-repeat="widget in widgets" gridster-item size-x="widget.sizeX" size-y="widget.sizeY"> 
      <hexbin-graph ng-if="widget.type == 'hexbin'" resize="{{context.resize}}"> 
       <button onclick="generateData()">Generate Data</button> 
      </hexbin-graph> 
     </li> 
    <ul> 
</div>

Yönergesi:

app.directive('hexbinGraph', function ($http, $rootScope) { 

    var map = undefined; 
    var center = [38.7, -9.1]; 


    return { 
     restrict: 'E', 
     scope: true, 
     link: function($scope, $elem, $attr) { 

       $attr.$observe('resize', function(newVal) { 
        console.log('resize'); 
        createHexbinGraph(); 
       }); 

       if (map != undefined) { map.remove(); } 

       var osmUrl = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', 
       osmAttrib = '&copy; <a href="http://openstreetmap.org/copyright">OpenStreetMap</a> contributors', 
       osm = L.tileLayer(osmUrl, {maxZoom: 18, attribution: osmAttrib}); 

       map = new L.Map($elem[0], {layers: [osm], center: new L.LatLng(center[0], center[1]), zoom: 7}); 


       function createHexbinGraph() { 

        // $elem[0] = null; 
        //var map = undefined; 

     //   if (map != undefined) { map.remove(); } 

     //   var osmUrl = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', 
       // osmAttrib = '&copy; <a href="http://openstreetmap.org/copyright">OpenStreetMap</a> contributors', 
       // osm = L.tileLayer(osmUrl, {maxZoom: 18, attribution: osmAttrib}); 

        // map = new L.Map($elem[0], {layers: [osm], center: new L.LatLng(center[0], center[1]), zoom: 7}); 

        var options = { 
         radius : 12, 
         opacity: 0.5, 
         duration: 500, 
         lng: function(d){ 
          return d[0]; 
         }, 
         lat: function(d){ 
          return d[1]; 
         }, 
         value: function(d){ 
          return d.length; 
         }, 
         valueFloor: 0, 
         valueCeil: undefined 
        }; 

        var hexLayer = L.hexbinLayer(options).addTo(map) 
        hexLayer.colorScale().range(['white', 'blue']); 

        var latFn = d3.random.normal(center[0], 1); 
        var longFn = d3.random.normal(center[1], 1); 

        var generateData = function(){ 
         var data = []; 
         for(i=0; i<1000; i++){ 
          data.push([longFn(), latFn()]); 
         } 
         hexLayer.data(data); 
        }; 

        // $elem[0] = map; 
        //map.remove(); 

        //if (map != undefined) { map.remove(); } 
       } 
      } 
     } 
});

ne eksik? Broşür haritasının genişliğini ve yüksekliğini tanımlamanın bir yolu var mı? Teşekkürler

kaynak

2016-04-12 Shoplifter20