使用ionic2在googlemaps中显示和查看地理围栏

Question

我正在开发一个离子2应用程序，我使用离子原生地理围栏编码地理围栏功能，我能够设置地理围栏半径数据并获取当前位置，但无法在谷歌地图上直观地查看它，包括截图期望的产出低于

HTML

<ion-item>
   <ion-range [(ngModel)]="formData.radius" ngControl="radius" name="radius" #radius="ngModel" min="40" max="200" color="primary" pin="true" snaps="true" step="10">
   </ion-range>
</ion-item>

打字稿

import { Geolocation, Geofence } from 'ionic-native';

export class PlaceAddPage {
 radius:number = 100;

 constructor(private platform: Platform) {
  this.platform.ready().then(() => {
  // initialize the plugin
  Geofence.initialize().then(
    // resolved promise does not return a value
    () => console.log('Geofence Plugin Ready'),
    (err) => console.log(err)
   )
  })
 }


 initMap() {
  Geolocation.getCurrentPosition().then((position) => {
   let latLng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
   let latLng1 = new google.maps.LatLng(13.0608842, 80.2221805);
   let GooleMap = new google.maps.Map(document.getElementById('mapfence'), {
    center: latLng,
    zoom: 15
   });
   let marker = new google.maps.Marker({
    position: latLng,
    map: GooleMap,
    title: 'My Location',
   });
  });
 }
}

所需输出

Answer 1

如果你需要实现上面的插件，那么你必须做更多的事情并导入更多的插件。一个这样的root插件是import * as Leaflet from "leaflet";。

在下面的Git回购中，他们已经完美地实现了Ionic 2.所以继续玩它。它对我来说很好。如果你有任何问题，请在下面评论。

使用 Git repo播放。

Answer 2

如果您想使用Google地图API进行地理围栏，请浏览Ionic2 Geofence using Google maps api