科达封装

src/modules/map/declare/KeDaSearch/keDaSearch.html

@@ -0,0 +1,3 @@
+<div class="content" [ngStyle]="{'left': left+'px', 'top': top+'px', 'min-width': minWidth+'px'}" *ngIf="searchList.length">
+    <div *ngFor="let item of searchList" (click)="select(item)" class="item">{{item.name}}</div>
+</div>

src/modules/map/declare/KeDaSearch/keDaSearch.scss

@@ -0,0 +1,16 @@
+.content{
+    position: absolute;
+    z-index: 1024;
+    background-color: #fefefe;
+    border: 1px solid #d1d1d1;
+    bottom: auto;
+}
+.item {
+    white-space: nowrap;
+    font-size: 12px;
+    cursor: pointer;
+    padding: 4px;
+}
+.item:hover {
+    background-color: #007aff;
+}

src/modules/map/declare/KeDaSearch/keDaSearch.ts

@@ -0,0 +1,37 @@
+import { Component, OnInit, Inject } from '@angular/core';
+import { AutocompleteSelect } from '../map';
+
+
+
+@Component({
+  selector: 'keDa-Search',
+  templateUrl: './keDaSearch.html',
+  styleUrls: ['./keDaSearch.scss']
+})
+export class KedaSearchComponent {
+
+    constructor() { }
+    static instance: KedaSearchComponent
+    public searchList:AutocompleteSelect[] = []; //list
+    public left:number = 0
+    public top:number = 0
+    public minWidth:number = 0
+
+    ngOnInit(): void {
+        KedaSearchComponent.instance = this
+    }
+
+    // input 添加监听事件
+    addDOMEvent (id:string) {
+        let input = document.getElementById(id)
+        let DOM = input.getBoundingClientRect()
+        this.left = DOM.left
+        this.top = DOM.top + DOM.height + 2
+        this.minWidth = DOM.width
+    }
+
+    select(e) {
+        console.log(e)
+    }
+
+}

src/modules/map/declare/factory.ts

@@ -84,18 +84,18 @@ export class MapFactory {
         }
     }
 
-    public static AutocompleteInstance(city: Object): IAutocomplete {
+    public static AutocompleteInstance(options: any,component: any): IAutocomplete {
         switch (mapSupplier) {
-            case 1: return new GaodeAutocomplete(city);
+            case 1: return new GaodeAutocomplete(options,component);
-            case 2: return new KedaAutocomplete(city);
+            case 2: return new KedaAutocomplete(options,component);
             default: return null;
         }
     }
 
-    public static PlaceSearchInstance(): IPlaceSearch {
+    public static PlaceSearchInstance(component: any): IPlaceSearch {
         switch (mapSupplier) {
-            case 1: return new GaodePlaceSearch();
+            case 1: return new GaodePlaceSearch(component);
-            case 2: return new KedaPlaceSearch();
+            case 2: return new KedaPlaceSearch(component);
             default: return null;
         }
     }

src/modules/map/declare/gaode-map.ts

@@ -1,4 +1,4 @@
-import { HtmlRender, ICircle, IIcon, IIconOptions, ILayer, ILngLat, IMap, IMapOptions, IMarker, IMarkerCluster, IMarkOptions, IMouseTool, IInfoWindow, IPixel, IRenderClusterMarker, ISelf, ISize, PixelRender, ITileLayer, IDriving, IDrivingOptions, IAutocomplete, IPlaceSearch, AutoCompleteSearchCallback, AutoCompleteSearchResultDto } from './map'
+import { HtmlRender, ICircle, IIcon, IIconOptions, ILayer, ILngLat, IMap, IMapOptions, IMarker, IMarkerCluster, IMarkOptions, IMouseTool, IInfoWindow, IPixel, IRenderClusterMarker, ISelf, ISize, PixelRender, ITileLayer, IDriving, IDrivingOptions, IAutocomplete, IPlaceSearch, AutocompleteSearchCallback, AutocompleteSelectCallback, PlaceSearchCallback } from './map'
 import MapTools from './map-tools';
 declare var AMap: any;
 declare var AMapUI: any;
@@ -10,13 +10,13 @@ class GaodeBasic implements ISelf {
 
 export class GaoDeMap extends GaodeBasic implements IMap {
     /// plugins:同步加载插件
-    constructor(container: string, options: IMapOptions, plugins?: string[]) {
+    constructor(container: string, options: IMapOptions,plugins?:string[]) {
         super();
         this.self = new AMap.Map(container, options);
-        if (!!plugins && plugins.length) {
+        if(!!plugins && plugins.length){
-            for (var i in plugins) {
+            for(var i in plugins){
                 let name = plugins[i];
-                if (name.indexOf('AMap.') == -1) continue;
+                if(name.indexOf('AMap.')==-1)continue;
                 let pObj = eval(`new ${plugins[i]}()`);
                 this.self.plugin(pObj);
             }
@@ -38,7 +38,7 @@ export class GaoDeMap extends GaodeBasic implements IMap {
         return this.self.setZoomAndCenter(zoom, pos)
     }
     plugin(pluginNames: string[], callback: Function) {
-        let names = pluginNames.filter(s => s.indexOf("AMap.") == 0);
+        let names = pluginNames.filter(s=>s.indexOf("AMap.")==0);
         return this.self.plugin(names, callback)
     }
     getBounds() {
@@ -59,9 +59,9 @@ export class GaoDeMap extends GaodeBasic implements IMap {
     setCenter(pos: any) {
         return this.self.setCenter(pos)
     }
-    getCenter(): ILngLat {
+    getCenter():ILngLat {
         let d = this.self.getCenter();
-        return new GaoDeLngLat(0, 0, d);
+        return new GaoDeLngLat(0,0,d);
     }
     getZoom() {
         return this.self.getZoom();
@@ -238,7 +238,7 @@ export class GaoDePixel extends GaodeBasic implements IPixel {
         this.self = new AMap.Pixel(x, y);
     }
     getArray(): number[] {
-        return [this.x, this.y];
+       return [this.x,this.y];
     }
     
     x: number;
@@ -255,8 +255,8 @@ export class GaoDeMarker extends GaodeBasic implements IMarker {
     setContent(html: string) {
         return this.self.setContent(html)
     }
-    setPosition(x: ILngLat | number[]) {
+    setPosition(x: ILngLat|number[]) {
-        x = (x as ILngLat).getArray == undefined ? x : (x as ILngLat).getArray();
+        x = (x as ILngLat).getArray == undefined ? x:(x as ILngLat).getArray();
         return this.self.setPosition(x)
     }
     _position: number[]
@@ -279,7 +279,7 @@ export class GaoDeMarkerCluster extends GaodeBasic implements IMarkerCluster {
         super();
         let conf = MapTools.ExplicitConvert(options);
 
-        AMap.plugin('AMap.MarkerClusterer', () => {
+        AMap.plugin('AMap.MarkerClusterer',()=>{
             this.self = new AMap.MarkerCluster(map.self, list, conf)
         });
     }
@@ -292,23 +292,23 @@ export class GaoDeMarkerCluster extends GaodeBasic implements IMarkerCluster {
 }
 
 export class GaoDeLngLat extends GaodeBasic implements ILngLat {
-    constructor(x: number, y: number, me?: any) {
+    constructor(x: number, y: number,me?:any) {
         super();
-        if (me == undefined)
+        if(me==undefined)
             this.self = new AMap.LngLat(x, y);
         else
             this.self = me;
     }
 
-    typeName = "LngLat";
+    typeName="LngLat";
-    get KL(): number {
+    get KL():number{
         return this.lng;
     }
-    get kT(): number {
+    get kT():number{
         return this.lat;
     }
     getArray(): number[] {
-        return [this.lng, this.lat];
+        return [this.lng,this.lat];
     }
     get lng(): number {
         return this.self.lng;
@@ -316,7 +316,7 @@ export class GaoDeLngLat extends GaodeBasic implements ILngLat {
     get lat(): number {
         return this.self.lat;
     }
-    offset(x: number, y: number): ILngLat {
+    offset(x: number, y: number):ILngLat {
         return this.self.offset(x, y)
     }
 }
@@ -362,53 +362,59 @@ export class GaodeDriving extends GaodeBasic implements IDriving {
     constructor(options: IDrivingOptions) {
         super();
         options.map = options.map.self
-        AMap.plugin('AMap.Driving', () => {
+        AMap.plugin('AMap.Driving',()=>{
             this.self = new AMap.Driving(options)
         })
     }
     search(posStart?: ILngLat, posEnd?: ILngLat, callback?: Function) {
-        return this.self.search(posStart.getArray(), posEnd.getArray(), callback)
+        return this.self.search(posStart.getArray(),posEnd.getArray(),callback)
     }
     clear() {
         return this.self.clear()
     }
 }
 
-
-
 export class GaodeAutocomplete extends GaodeBasic implements IAutocomplete {
-    constructor(city: Object) {
+    private component:any
+    constructor(options: any,component: any) {
         super();
-        AMap.plugin('AMap.AutoComplete', () => {
+        this.component = component
-            this.self = new AMap.Autocomplete(city)
+        AMap.plugin('AMap.AutoComplete',()=>{
+            this.self = new AMap.Autocomplete(options)
         })
     }
-    search(address: string, callback: AutoCompleteSearchCallback) {
+    on(eventName: string, callback: AutocompleteSelectCallback) {
-        return this.self.search(address, (status, result) => {
+        return this.self.on(eventName, (event)=>{
-            callback(result.tips as AutoCompleteSearchResultDto[]);
+            callback.call(this.component,event)
-        });
+        })
     }
-    on(eventName: string, callback: Function) {
+    search(address: string, callback: AutocompleteSearchCallback) {
-        return this.self.on(eventName, callback)
+        return this.self.search(address,(status,result)=>{
+            callback.call(this.component,status,result)
+        })
     }
 }
 
 export class GaodePlaceSearch extends GaodeBasic implements IPlaceSearch {
-    constructor() {
+    private component:any
+    constructor(component: any) {
         super();
-        AMap.plugin('AMap.PlaceSearch', () => {
+        this.component = component
+        AMap.plugin('AMap.PlaceSearch',()=>{
             this.self = new AMap.PlaceSearch()
         })
     }
-    search(text: string, callback: Function) {
+    search(text: string, callback: PlaceSearchCallback) {
-        return this.self.search(text, callback)
+        return this.self.search(text,(status,result)=>{
+            callback.call(this.component,status,result)
+        })
     }
 }
 
 export class GaodeMouseTool extends GaodeBasic implements IMouseTool {
     constructor(map: IMap) {
         super();
-        AMap.plugin(["AMap.RangingTool", "AMap.MouseTool"], () => {
+        AMap.plugin(["AMap.RangingTool", "AMap.MouseTool"],()=>{
             this.self = new AMap.MouseTool(map.self);
         })
     }

src/modules/map/declare/keda-map.ts

@@ -1,5 +1,6 @@
-import { HtmlRender, IAutocomplete, ICircle, IDriving, IInfoWindow, ILayer, ILngLat, IMap, IMapOptions, IMarker, IMarkerCluster, IMarkOptions, IMouseTool, IPixel, IPlaceSearch, IRenderClusterMarker, ISelf, ITileLayer, PixelRender, SearchRender } from './map'
+import { AutocompleteSearchCallback, AutocompleteSelectCallback, HtmlRender, IAutocomplete, ICircle, IDriving, IInfoWindow, ILayer, ILngLat, IMap, IMapOptions, IMarker, IMarkerCluster, IMarkOptions, IMouseTool, IPixel, IPlaceSearch, IRenderClusterMarker, ISelf, ITileLayer, PixelRender, PlaceSearchCallback } from './map'
 import * as ObjectID from 'bson-objectid';
+import { KedaSearchComponent } from './KeDaSearch/keDaSearch';
 declare var KMap: any;
 
 class KedaBasic implements ISelf {
@@ -310,24 +311,37 @@ export class KedaDriving extends KedaBasic implements IDriving { //路线导航
 }
 
 export class KedaAutocomplete extends KedaBasic implements IAutocomplete { //Autocomplete 关键字搜索
-    constructor(options: any) {
+    private component: any
+    constructor(options: any,component: any) {
         super();
+        this.component = component
+        if (options && options.input != undefined) { //绑定input框搜索事件
+            KedaSearchComponent.instance.addDOMEvent(options.input)
+        }
     }
-    searchRender:SearchRender
+    on(eventName: string, callback: AutocompleteSelectCallback) {
-    on(eventName: string, callback: Function) {
 
     }
-    search(address: string, callback: Function) {
+    search(address: string, callback: AutocompleteSearchCallback) {
-   
+        (this.component.map as KeDaMap).self.queryInfoByType({
+            code: cityCode,
+            keyword: address,
+            searchType: [],
+            callback: (res)=>{
+                console.log(res)
+            }
+        })
     }
 }
 
 export class KedaPlaceSearch extends KedaBasic implements IPlaceSearch { //PlaceSearch 关键字搜索
-    constructor() {
+    private component: any
+    constructor(component: any) {
         super();
+        this.component = component
     }
-    search(text: string, callback: Function) {
+    search(text: string, callback: PlaceSearchCallback) {
-
+        throw new Error('Method not implemented.');
     }
 }
 

src/modules/map/declare/map.d.ts

@@ -5,20 +5,20 @@ export interface ISelf {
 
 export interface IMap extends ISelf {
     on(eventName: string, callback: Function);
-    add(obj: IMarker | ITileLayer | any);
+    add(obj: IMarker|ITileLayer|any);
-    remove(obj: IMarker | ITileLayer | any);
+    remove(obj: IMarker|ITileLayer|any);
     clearMap();
-    containerToLngLat(e: IPixel): ILngLat; //地图容器像素坐标转经纬度
+    containerToLngLat(e:IPixel): ILngLat; //地图容器像素坐标转经纬度
     setCity(city: string);
     getCity(callback: Function): any;
     setZoom(zoom: number);
     setZoomAndCenter(zoom: number, pos: number[]);
     getZoom(): number;
-    setCenter(pos: number[] | ILngLat);
+    setCenter(pos: number[]|ILngLat);
     getCenter(): ILngLat;
     getBounds(): any;
-    distance(a: number[], b: number[]): any;
+    distance(a:number[],b:number[]): any;
-    setAdministrativeAreaStyle(conponent: any, getData?: Function, setData?: Function): any; //自定义 行政区划 样式
+    setAdministrativeAreaStyle(conponent:any,getData?:Function,setData?:Function): any; //自定义 行政区划 样式
 }
 
 export interface IMapOptions {
@@ -28,10 +28,10 @@ export interface IMapOptions {
 
 export interface IMarker extends ISelf {
     id: string;
-    _position: number[];
+    _position:number[];
     on(eventName: string, callback: Function);
-    setPosition(x: ILngLat | number[])
+    setPosition(x:ILngLat|number[])
-    setContent(html: string)
+    setContent(html:string)
     setMap();
 }
 
@@ -59,19 +59,19 @@ export class IMarkOptions {
 }
 
 export interface IPixel extends ISelf {
-    x: number
+    x:number
-    y: number
+    y:number
-    getArray(): number[]
+    getArray():number[]
 }
 
 export interface ILngLat extends ISelf {
-    typeName: string
+    typeName:string
     lng: number
     lat: number
-    KL: number
+    KL:number
-    kT: number
+    kT:number
-    offset(x: number, y: number): ILngLat
+    offset(x: number, y: number):ILngLat
-    getArray(): number[]
+    getArray():number[]
 }
 
 export interface ILayer extends ISelf {
@@ -106,38 +106,56 @@ export interface IDrivingOptions {
 
 export interface IDriving extends ISelf {
     clear();
-    search(posStart?: ILngLat, posEnd?: ILngLat, callback?: Function);
+    search(posStart?: ILngLat, posEnd?: ILngLat, callback?:Function);
 }
 
-
+export class AutocompleteSearch { //Autocomplete Search() 数据类型
-export class AutoCompleteSearchResultDto {
+    info: string
-    name: string;//名称
+    count: number
-    district: string;//所属区域
+    tips: AutocompleteSelect[]
-    adcode: string;//区域编码
+}
-    location: ILngLat;
+export class AutocompleteSelect { //GaoDe POI 数据类型
+    id: string
+    name: string
+    adcode: string
+    district: string
+    location: ILngLat
+    type: string
+    poi:{ location: ILngLat }
 }
 
-type AutoCompleteSearchCallback = (status: string, searchData: { info: string, count: number, tips: AutoCompleteSearchResultDto[] }) => void;
+type AutocompleteSearchCallback = (status:string,searchData:AutocompleteSearch)=>void;
-
+type AutocompleteSelectCallback = (event:AutocompleteSelect)=>void;
 export interface IAutocomplete extends ISelf {
-    on(eventName: string, callback: Function)
+    search(address: string,callback: AutocompleteSearchCallback)
-    search(address: string, callback: AutoCompleteSearchCallback)
+    on(eventName: string, callback: AutocompleteSelectCallback)
+}
+
+export class PlaceSearchSearch { //PlaceSearch Search() 数据类型
+    info: string
+    poiList: PlaceSearchSearchTips
+}
+export class PlaceSearchSearchTips { //PlaceSearch Search() 数据类型
+    pois:AutocompleteSelect[]
+    pageIndex:number
+    pageSize:number
+    count:number
 }
 
-type SearchRender = (...args) => any[];
+type PlaceSearchCallback = (status:string,searchData:PlaceSearchSearch)=>void;
 export interface IPlaceSearch extends ISelf {
-    search(text: string, callback: Function);
+    search(text:string, callback: PlaceSearchCallback);
 }
 
 export interface IMouseTool extends ISelf {
-    rule(options: any)
+    rule(options:any)
-    measureArea(options: any)
+    measureArea(options:any)
-    close(isTrue: boolean)
+    close(isTrue:boolean)
 }
 
 export interface IInfoWindow extends ISelf {
-    open(map: IMap);
+    open(map:IMap);
-    listen(html: any, event: string, callback: Function)
+    listen(html:any, event:string, callback: Function)
 }
 
 export interface ICircle extends ISelf {