import { Component , EventEmitter , Output } from '@angular/core' ; declare var AMap ; declare var AMapUI ; import { MapPositionModel } from '../../model/mapPositionModel' ; /***
 *  高德地图 - 地图选点反推地址组件
 *  1. 组件依赖高德官方两个js，在入口文件index.html引入
 *    <!--高德地图JavaScript API入口脚本-->
 *    <script src="http://webapi.amap.com/maps?v=1.4.0&key=7c24ba9bd6a0b7b95d70ec6919e30c34&plugin=AMap.ToolBar"></script>
 *    <!-- 高德地图UI组件库 1.0 -->
 *   <script src="//webapi.amap.com/ui/1.0/main.js?v=1.0.11"></script>
 */ @ Component ( { selector : 'map-position-picker' , templateUrl : 'map-position-picker.html' } ) export class MapPositionPickerComponent { @ Output ( ) outputPosition : EventEmitter < any > = new EventEmitter ( ) ; loaded : boolean = false ; position : MapPositionModel ; alternate : Array < MapPositionModel > = [ ] ; constructor ( ) { console . log ( 'Hello MapPositionPickerComponent Component' ) ; this . initMap ( ) ; } initMap ( ) { AMapUI . loadUI ( [ 'misc/PositionPicker' ] , ( PositionPicker ) => { var map = new AMap . Map ( 'container' , { zoom : 13 , scrollWheel : false , } ) ; map . plugin ( 'AMap.Geolocation' , ( ) => { let geolocation = new AMap . Geolocation ( { enableHighAccuracy : true , timeout : 10000 , maximumAge : 0 , convert : true , showButton : true , buttonPosition : 'LB' , buttonOffset : new AMap . Pixel ( 10 , 20 ) , showMarker : true , showCircle : true , panToLocation : true , zoomToAccuracy : false } ) ; map . addControl ( geolocation ) ; geolocation . getCurrentPosition ( ) ; AMap . event . addListener ( geolocation , 'complete' , ( data ) => { } ) ; AMap . event . addListener ( geolocation , 'error' , ( err ) => { console . log ( err ) ; } ) ; } ) ; var positionPicker = new PositionPicker ( { mode : 'dragMap' , map : map } ) ; positionPicker . on ( 'success' , ( positionResult ) => { this . position = { address : positionResult . address , location : positionResult . position , } ; this . alternate = positionResult . regeocode . pois ; this . loaded = true ; this . outputPosition . emit ( { firstPosition : this . position , morePostion : this . alternate , } ) ; } ) ; positionPicker . on ( 'fail' , ( positionResult ) => { console . log ( '定位失败' ) ; } ) ; positionPicker . start ( ) ; map . panBy ( 0 , 1 ) ; positionPicker . setMode ( 'dragMap' ) ; map . addControl ( new AMap . ToolBar ( { liteStyle : true } ) ) ; } ) ; } mapGeolocation ( successCallback ) { } mapGeolocationSuccessCallback ( data ) { console . log ( '定位当前位置成功' ) ; console . log ( '经度：' + data . position . getLng ( ) ) ; console . log ( '纬度：' + data . position . getLat ( ) ) ; if ( data . accuracy ) { console . log ( '精度：' + data . accuracy + ' 米' ) ; } console . log ( '是否经过偏移：' + ( data . isConverted ? '是' : '否' ) ) ; } mapGeolocationErrorCallback ( error ) { console . log ( '定位失败' , error ) ; } }