Угловой 2 как установить strictBounds

Question

Может кто-нибудь помочь мне в этом? Я хочу, чтобы создать строгие рамки, как это:

var strictBounds = new google.maps.LatLngBounds(
     new google.maps.LatLng(51.51260063140188, 5.100499215469426), 
     new google.maps.LatLng(51.527701526080484, 5.1409469274140065) 
    ); 

    //Listen for the dragend event 
    map.addListener('dragend', function() { 
     if (strictBounds.contains(map.getCenter())) return; 

     //We're out of bounds - Move the map back within the bounds 
     var c = map.getCenter(), 
      x = c.lng(), 
      y = c.lat(), 

      maxX = strictBounds.getNorthEast().lng(), 
      maxY = strictBounds.getNorthEast().lat(), 
      minX = strictBounds.getSouthWest().lng(), 
      minY = strictBounds.getSouthWest().lat(); 

     if (x < minX) x = minX; 
     if (x > maxX) x = maxX; 
     if (y < minY) y = minY; 
     if (y > maxY) y = maxY; 
     map.setCenter(new google.maps.LatLng(y, x)); 
    }); 

Это то, что я сделал в JavaScript, но как я могу осуществить это в angular2-Google-картах здесь plunker: LINK

Я надеюсь, что один из вас ребята могут помочь мне и сказать мне, как начать

Answer 1

Выполнить эту функцию в _initMapInstance в angular2-Google-карты/SRC/директив/Google-map.ts как это:

private _initMapInstance(el: HTMLElement) { 
this._mapsWrapper.createMap(el, { 

}); 
this._handleBoundaries(); 



private _handleBoundaries() { 
    this._mapsWrapper.subscribeToMapEvent<void>('dragend').subscribe(() => { 
    this._mapsWrapper.getCenter().then((center: LatLng) => { 

     var x = this._longitude; 
     var y = this._latitude; 

     // console.log('y',y, 'x', x); 

     var maxX = 5.139133754119953; 
     var maxY = 51.52773156266013; 
     var minX = 5.105831446991047; 
     var minY = 51.51337849651561; 

     if (x < minX) x = minX; 
     if (x > maxX) x = maxX; 
     if (y < minY) y = minY; 
     if (y > maxY) y = maxY; 

     this._mapsWrapper.setCenter({lat: y, lng: x}); 
    }); 
}); 

}