shaojiahao
/
ShangHaiYuan-AnXin
2
0
Fork 0
Code Issues 11 Pull Requests Projects Releases Wiki Activity
Browse Source

科达地图封装

上海一张图
陈鹏飞 4 years ago
parent
9f75500496
commit
ad1686125f
4 changed files with 216 additions and 67 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 13
      src/modules/map/declare/factory.ts
  2. 20
      src/modules/map/declare/gaode-map.ts
  3. 239
      src/modules/map/declare/keda-map.ts
  4. 11
      src/modules/map/declare/map.d.ts

13
src/modules/map/declare/factory.ts
Unescape View File

@ -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;
}
}

20
src/modules/map/declare/gaode-map.ts
Unescape View File

@ -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 {

239
src/modules/map/declare/keda-map.ts
Unescape View File

@ -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();

11
src/modules/map/declare/map.d.ts vendored
Unescape View File

@ -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);
}

Write Preview
Loading…
Cancel
Save