diff --git a/src/modules/map/declare/factory.ts b/src/modules/map/declare/factory.ts index 476410a..4177652 100644 --- a/src/modules/map/declare/factory.ts +++ b/src/modules/map/declare/factory.ts @@ -2,7 +2,7 @@ const mapSupplier: number = 2; // 1:高德, 2:科达 import { IMap, IMapOptions, IMarker, IPixel, IMarkOptions, ILngLat, ILayer, ICircle, IMarkerCluster, IRenderClusterMarker, IInfoWindow, IMouseTool, IIcon, ISize, IIconOptions, ITileLayer, IDriving, IDrivingOptions, IAutocomplete, IPlaceSearch } from './map' import { GaodeCircle, GaodeIcon, GaodeInfoWindow, GaodeLayer, GaoDeLngLat, GaoDeMap, GaoDeMarker, GaoDeMarkerCluster, GaodeMouseTool, GaoDePixel, GaoDeRenderClusterMarker, GaodeTileLayer, GaodeSize, GaodeDriving, GaodeAutocomplete, GaodePlaceSearch } from './gaode-map' -import { KedaInfoWindow, KeDaLngLat, KeDaMap, KeDaMarker, KedaMouseTool, KeDaPixel, KedaTileLayer } from './keda-map'; +import { KedaAutocomplete, KedaCircle, KedaDriving, KedaInfoWindow, KedaLayer, KeDaLngLat, KeDaMap, KeDaMarker, KedaMarkerCluster, KedaMouseTool, KeDaPixel, KedaPlaceSearch, KedaRenderClusterMarkerr, KedaTileLayer } from './keda-map'; import MapTools from './map-tools'; export class MapFactory { @@ -33,6 +33,7 @@ export class MapFactory { public static MarkerClusterInstance(map: IMap, list: Object[], renderObj: { gridSize: number, render: IRenderClusterMarker }): IMarkerCluster { switch (mapSupplier) { case 1: return new GaoDeMarkerCluster(map, list, renderObj); + case 2: return new KedaMarkerCluster(map, list, renderObj); default: return null; } } @@ -45,14 +46,14 @@ export class MapFactory { } } - public static IconInstance(options: IIconOptions): IIcon { + public static IconInstance(options: IIconOptions): IIcon { //科达map 暂不需要 switch (mapSupplier) { case 1: return new GaodeIcon(options); default: return null; } } - public static SizeInstance(x: number, y: number): ISize { + public static SizeInstance(x: number, y: number): ISize { //科达map 暂不需要 switch (mapSupplier) { case 1: return new GaodeSize(x, y); default: return null; @@ -70,6 +71,7 @@ export class MapFactory { public static LayerInstance(options: any): ILayer { switch (mapSupplier) { case 1: return new GaodeLayer(options); + case 2: return new KedaLayer(options); default: return null; } } @@ -77,6 +79,7 @@ export class MapFactory { public static DrivingInstance(options: IDrivingOptions): IDriving { switch (mapSupplier) { case 1: return new GaodeDriving(options); + case 2: return new KedaDriving(options); default: return null; } } @@ -84,6 +87,7 @@ export class MapFactory { public static AutocompleteInstance(city: Object): IAutocomplete { switch (mapSupplier) { case 1: return new GaodeAutocomplete(city); + case 2: return new KedaAutocomplete(city); default: return null; } } @@ -91,6 +95,7 @@ export class MapFactory { public static PlaceSearchInstance(): IPlaceSearch { switch (mapSupplier) { case 1: return new GaodePlaceSearch(); + case 2: return new KedaPlaceSearch(); default: return null; } } @@ -114,6 +119,7 @@ export class MapFactory { public static CircleInstance(options: any): ICircle { switch (mapSupplier) { case 1: return new GaodeCircle(options); + case 2: return new KedaCircle(options); default: return null; } } @@ -121,6 +127,7 @@ export class MapFactory { public static RenderClusterMarkerInstance(): IRenderClusterMarker { switch (mapSupplier) { case 1: return new GaoDeRenderClusterMarker(); + case 2: return new KedaRenderClusterMarkerr(); default: return null; } } diff --git a/src/modules/map/declare/gaode-map.ts b/src/modules/map/declare/gaode-map.ts index b94a241..32a1f4b 100644 --- a/src/modules/map/declare/gaode-map.ts +++ b/src/modules/map/declare/gaode-map.ts @@ -22,12 +22,6 @@ export class GaoDeMap extends GaodeBasic implements IMap { } } } - setBounds(zoom?: any, x?: any, y?: any, is?: boolean) { - return this.self.setBounds(zoom, x, y, is) - } - setFitView(options: any) { - return this.self.setFitView(options) - } containerToLngLat(e: any) { return this.self.containerToLngLat(e) } @@ -96,7 +90,7 @@ export class GaoDeMap extends GaodeBasic implements IMap { districtExplorer.loadAreaNode(adcode, (error, areaNode) => { //更新地图视野 - that.setBounds(areaNode.getBounds(), null, null, true); + that.self.setBounds(areaNode.getBounds(), null, null, true); //设置定位节点,支持鼠标位置识别 //注意节点的顺序,前面的高优先级 @@ -132,7 +126,7 @@ export class GaoDeMap extends GaodeBasic implements IMap { }); // 更新地图视野以适合区划面 - that.setFitView(districtExplorer.getAllFeaturePolygons()); + that.self.setFitView(districtExplorer.getAllFeaturePolygons()); }); if (level == "0" || level == "1" || level == "2") { @@ -184,7 +178,7 @@ export class GaoDeMap extends GaodeBasic implements IMap { }); // 更新地图视野以适合区划面 - that.setFitView(districtExplorer.getAllFeaturePolygons()); + that.self.setFitView(districtExplorer.getAllFeaturePolygons()); }); }); @@ -227,7 +221,7 @@ export class GaoDeMap extends GaodeBasic implements IMap { }); // 更新地图视野以适合区划面 - that.setFitView(districtExplorer.getAllFeaturePolygons()); + that.self.setFitView(districtExplorer.getAllFeaturePolygons()); }); }) } @@ -372,12 +366,12 @@ export class GaodeDriving extends GaodeBasic implements IDriving { this.self = new AMap.Driving(options) }) } + search(posStart?: ILngLat, posEnd?: ILngLat, callback?: Function) { + return this.self.search(posStart.getArray(),posEnd.getArray(),callback) + } clear() { return this.self.clear() } - search(x: any, y: any, callback: Function) { - return this.self.search(x.self, y.self, callback) - } } export class GaodeAutocomplete extends GaodeBasic implements IAutocomplete { diff --git a/src/modules/map/declare/keda-map.ts b/src/modules/map/declare/keda-map.ts index 89cc443..b50696c 100644 --- a/src/modules/map/declare/keda-map.ts +++ b/src/modules/map/declare/keda-map.ts @@ -1,4 +1,4 @@ -import { IInfoWindow, ILngLat, IMap, IMapOptions, IMarker, IMarkOptions, IMouseTool, IPixel, ISelf, ITileLayer } from './map' +import { HtmlRender, IAutocomplete, ICircle, IDriving, IInfoWindow, ILayer, ILngLat, IMap, IMapOptions, IMarker, IMarkerCluster, IMarkOptions, IMouseTool, IPixel, IPlaceSearch, IRenderClusterMarker, ISelf, ITileLayer, PixelRender, SearchRender } from './map' import * as ObjectID from 'bson-objectid'; declare var KMap: any; @@ -6,6 +6,9 @@ class KedaBasic implements ISelf { self: any; discriminator: string = "ISelf"; } +const cityPosition:number[] = [121.469167918, 31.232262275]; //上海市 坐标 +const beforCity:string = "上海市"; //当前城市 +const cityCode:string = "310000"; //当前城市 行政编码 export class KeDaMap extends KedaBasic implements IMap { constructor(container: string, options: IMapOptions) { //地图初始化 @@ -14,6 +17,8 @@ export class KeDaMap extends KedaBasic implements IMap { let opt = Object.assign({}, { containerId: container }, options) as any; opt.configUrl = "/assets/kmap/Kmap.config.json"; opt.targetCoordinateType = "WGS84"; + opt.center = cityPosition; + opt.zoom === undefined? opt.zoom = 9 : opt.zoom = opt.zoom - 2 let mapLayer = function () { if (opt.viewMode && opt.viewMode == "3D") { let data = { @@ -46,23 +51,20 @@ export class KeDaMap extends KedaBasic implements IMap { return d; } setAdministrativeAreaStyle(conponent: any, getData?: Function, setData?: Function) { //自定义 行政区划 样式 - throw new Error('Method not implemented.'); - } - setBounds(zoom?: any, x?: any, y?: any, is?: boolean) { - throw new Error('Method not implemented.'); - } - setFitView(options: any) { - throw new Error('Method not implemented.'); - } + } clearMap() { - throw new Error('Method not implemented.'); + this.self.clear() } distance(a: number[], b: number[]) { - throw new Error('Method not implemented.'); - } - getCity(callback: Function) { - throw new Error('Method not implemented.'); + let num + this.self.distancePoints({ + startPoint: a, + endPoint: b, + units: "meters", + callback: (res)=>{ num = res.data } + }) + return num } setZoomAndCenter(zoom: number, pos: number[]) { this.self.flyTo({ @@ -70,26 +72,35 @@ export class KeDaMap extends KedaBasic implements IMap { point: pos, }); } - plugin(eventName: string[], callback: Function) { - throw new Error('Method not implemented.'); - } getBounds() { - throw new Error('Method not implemented.'); + let bounds + this.self.getBounds({ + callback: (res)=>{ + bounds = res.data + console.log(res.data) + } + }) + return bounds } add(obj: any) { if(obj && obj.typeName === "KeDaMarker"){ let _marker = (obj as KeDaMarker); _marker.map = this; - _marker.startBindEvent(); - } - if (obj == "卫星图层") { + this.self.addMarkers(_marker.self) + } else if (obj == "卫星图层") { this.self.setImageLayer({ display: true }) } else if (obj == "路网图层") { this.self.setMapStyle({ solution: '8888' }); } } remove(obj: any) { - if (obj == "卫星图层") { + if(obj && obj.typeName === "KeDaMarker"){ + this.self.removeMarkersByType({ markerType: obj.id }) + } else if (obj && obj.typeName === "KeDaInfoWindow") { + this.self.removeAllPopups() + } else if (obj && obj.typeName === "KeDaCircle") { + this.self.removeLayer({ layerId: obj.id }) + } else if (obj == "卫星图层") { this.self.setImageLayer({ display: false }) } else if (obj == "路网图层") { this.self.setMapStyle({ solution: '9999' }); @@ -97,15 +108,16 @@ export class KeDaMap extends KedaBasic implements IMap { } setCity(city: string) { let that = this - if (city.includes("上海")) { - window.setTimeout(function () { - that.self.flyTo({ - zoom: 9, - point: [121.495126354, 31.241993148] - }); - }, 10000) + if (city.includes("上海") && this.self.flyTo instanceof Function) { + that.self.flyTo({ + zoom: 9, + point: cityPosition + }); } } + getCity(callback: Function) { + return callback + } setZoom(zoom: number) { this.self.zoomTo({ zoom: zoom @@ -132,8 +144,9 @@ export class KeDaMap extends KedaBasic implements IMap { getCenter() { let center this.self.getCenter({ - callback: function (data) { - console.log(data); + callback: function (res) { + center = res.data + console.log(res); } }); return center @@ -149,7 +162,6 @@ export class KeDaMap extends KedaBasic implements IMap { handler: callback }); } - } export class KeDaPixel extends KedaBasic implements IPixel { @@ -177,28 +189,43 @@ export class KeDaMarker extends KedaBasic implements IMarker { } else { pos = options.position.getArray() } - let d = { - url: '/assets/images/dingwei.png', + let points = [{ point: pos, + htmlText: null, + }] + let marker = { + data: points, + url: '/assets/images/dingwei.png', offset: options.offset? options.offset.self : null, + markerType: "KedaMarker", ended: (res) => {this.id = res.data;} }; - this.self = d; + this.self = marker; this._position = pos if (options.map) { this.map = options.map as KeDaMap - this.map.self.addMarker(this.self); + this.map.self.addMarkers(this.self); } } _position: number[]; - setContent(html: string) { - throw new Error('Method not implemented.'); + setContent(html: string) { //marker 添加 DOM元素 + this.map.self.setMarkerProperty({ + type: "markerType", + markerType: "KedaMarker", + points:[ + {htmlText:html} + ] + }) } - setPosition(x: number[]) { - throw new Error('Method not implemented.'); + setPosition(position: number[]) { + this.map.self.setMarkerProperty({ + type: "markerType", + markerType: "KedaMarker", + points:[position] + }) } setMap() { - throw new Error('Method not implemented.'); + this.map.self.removeMarkersByType({ markerType: this.id }) } get id(): string { return this.self.id @@ -206,7 +233,6 @@ export class KeDaMarker extends KedaBasic implements IMarker { set id(str: string) { this.self.id = str } - public bindObj=[]; // event on(eventName: string, callback: Function): void { this.bindObj.push({ @@ -219,7 +245,7 @@ export class KeDaMarker extends KedaBasic implements IMarker { if(this.map!==undefined){ this.bindObj.forEach((item,index)=>{ this.map.self.addEventOnMarkers({ - selector: `#${this.id}`, + selector: `.${this.id}`, event: item.eventName, handler: item.callback, }); @@ -228,6 +254,7 @@ export class KeDaMarker extends KedaBasic implements IMarker { } } } + export class KeDaLngLat extends KedaBasic implements ILngLat { constructor(lng: number, lat: number) { super(); @@ -239,7 +266,7 @@ export class KeDaLngLat extends KedaBasic implements ILngLat { return x = 2 * Math.asin(Math.sin(Math.round(x)/12756274) / Math.cos(this.kT* Math.PI / 180)), x = this.KL + 180 *x / Math.PI, y = 2*Math.asin(Math.round(y)/12756274), - new KeDaLngLat(x,y); + new KeDaLngLat(x,y); } typeName="LngLat"; lng: number; @@ -255,7 +282,125 @@ export class KeDaLngLat extends KedaBasic implements ILngLat { } } +export class KedaDriving extends KedaBasic implements IDriving { //路线导航 + public map:KeDaMap; + public policy:number; // 0:快捷模式, 4:躲避拥堵 + public id:string; + constructor(options: any) { + super(); + this.map = options.map as KeDaMap + options.policy === undefined? this.policy = 0 : this.policy = options.policy + } + clear() { + this.map.self.removeRoutePlanning({ id:this.id }) + } + search(posStart?: ILngLat, posEnd?: ILngLat, callback?: Function) { + let params = { + startPoint: posStart.getArray(), + endPoint: posEnd.getArray(), + error: ()=>{ alert('路线规划失败!') }, + ended: (res)=>{ this.id = res.data } + } + if (this.policy === 0) { //快捷模式 + this.map.self.createMinDistanceRoutePlanning(params) + } else { //躲避拥堵 + this.map.self.createMinTimeRoutePlanning(params) + } + } +} + +export class KedaAutocomplete extends KedaBasic implements IAutocomplete { //Autocomplete 关键字搜索 + constructor(options: any) { + super(); + } + searchRender:SearchRender + on(eventName: string, callback: Function) { + + } + search(address: string, callback: Function) { + + } +} + +export class KedaPlaceSearch extends KedaBasic implements IPlaceSearch { //PlaceSearch 关键字搜索 + constructor() { + super(); + } + search(text: string, callback: Function) { + + } +} + +export class KedaCircle extends KedaBasic implements ICircle { //圆形 图层 + public typeName:string = "KeDaCircle"; + public id:string; + constructor(options: any) { + super(); + let circle = { + data: { + type: 'FeatureCollection', + features: [ + { + type: 'Feature', + geometry: { + type: 'Point', + coordinates: cityPosition + }, + properties: { id: ObjectID.default.generate() } + } + ] + }, + defaultStyles: { + "line-dasharray": options.strokeDasharray, + "line-opacity": options.strokeOpacity, + "fill-color": options.fillColor, + "fill-opacity": options.fillOpacity, + }, + radius: 0, + draggable: false, + updateHandler: (res)=>{ console.log(res) }, + end: (res)=>{ this.id = res } + } + this.self = circle + } + setRadius(num: number) { //设置圆的半径 + this.self.radius = num / 1000 + } + setCenter(pos: number[]) {//设置圆的中心 + this.self.center = pos + } + setMap(map: IMap) {//把圆添加到 map + map.self.addGeometryCircleLayer(this.self) + } +} + +export class KedaMarkerCluster extends KedaBasic implements IMarkerCluster { //Marker 聚合物 + constructor(map: IMap, list: Object[], options: any) { + super(); + } + on(eventName: string, callback: Function): void { + throw new Error('Method not implemented.'); + } + setData(list: any[]) { + throw new Error('Method not implemented.'); + } +} + +export class KedaRenderClusterMarkerr extends KedaBasic implements IRenderClusterMarker { //Marker 聚合物 配置项 + constructor() { + super(); + } + getFirstImages(context: any): string { + throw new Error('Method not implemented.'); + } + contentRender: HtmlRender; + contentNonRender: HtmlRender; + pixelRender: PixelRender; + pixelNonRender: PixelRender; +} + export class KedaInfoWindow extends KedaBasic implements IInfoWindow { //信息窗体 + public typeName:string = "KeDaInfoWindow"; constructor(options) { super(); let opt = { @@ -274,6 +419,12 @@ export class KedaInfoWindow extends KedaBasic implements IInfoWindow { //信息 } } +export class KedaLayer extends KedaBasic implements ILayer { //mapInit 配置项 + constructor(options: any) { + super(); + } +} + export class KedaTileLayer extends KedaBasic implements ITileLayer { //图层切换 constructor() { super(); diff --git a/src/modules/map/declare/map.d.ts b/src/modules/map/declare/map.d.ts index 346fb9c..be92a5b 100644 --- a/src/modules/map/declare/map.d.ts +++ b/src/modules/map/declare/map.d.ts @@ -5,15 +5,10 @@ export interface ISelf { export interface IMap extends ISelf { on(eventName: string, callback: Function); - //异步加载插件,插件完成的callback - //pluginName:要加载的插件名 - plugin(pluginName: string[], callback: Function); add(obj: IMarker|ITileLayer|any); remove(obj: IMarker|ITileLayer|any); clearMap(); containerToLngLat(e:IPixel): ILngLat; //地图容器像素坐标转经纬度 - setFitView(options:any); - setBounds(zoom?:any, x?:any, y?:any, is?:boolean); setCity(city: string); getCity(callback: Function): any; setZoom(zoom: number); @@ -41,7 +36,8 @@ export interface IMarker extends ISelf { } export interface IMarkerCluster extends ISelf { - + on(eventName: string, callback: Function): void; + setData(list: any[]); } type HtmlRender = (...args) => string | HTMLElement; @@ -110,7 +106,7 @@ export interface IDrivingOptions { export interface IDriving extends ISelf { clear(); - search(x?:any, y?:any, callback?:Function); + search(posStart?: ILngLat, posEnd?: ILngLat, callback?:Function); } export interface IAutocomplete extends ISelf { @@ -118,6 +114,7 @@ export interface IAutocomplete extends ISelf { search(address: string,callback: Function) } +type SearchRender = (...args) => any[]; export interface IPlaceSearch extends ISelf { search(text:string, callback: Function); }