update 修改 webmap bing 地图服务 review by luox

src/common/web-map/WebMapBase.ts

@@ -30,6 +30,8 @@ export default abstract class WebMapBase extends Events {
 
   tiandituKey: string;
 
+  bingMapsKey: string;
+
   googleMapsAPIKey: string;
 
   googleMapsLanguage: string;
@@ -81,6 +83,7 @@ export default abstract class WebMapBase extends Events {
     this.accessKey = options.accessKey;
     this.tiandituKey = options.tiandituKey || '';
     this.googleMapsAPIKey = options.googleMapsAPIKey || '';
+    this.bingMapsKey = options.bingMapsKey || '';
     this.googleMapsLanguage = options.googleMapsLanguage || 'zh-CN';
     this.withCredentials = options.withCredentials || false;
     this.proxy = options.proxy;

src/mapboxgl/web-map/WebMap.vue

@@ -131,6 +131,7 @@ class SmWebMap extends Mixins(VmUpdater, MapEvents) {
   @Prop() accessToken: string;
   @Prop() accessKey: string;
   @Prop() tiandituKey: string;
+  @Prop() bingMapsKey: string;
   @Prop() googleMapsAPIKey: string;
   @Prop({ default: 'zh-CN' }) googleMapsLanguage: string;
   @Prop({ default: false }) withCredentials: boolean;
@@ -324,6 +325,7 @@ class SmWebMap extends Mixins(VmUpdater, MapEvents) {
       accessKey,
       tiandituKey,
       googleMapsLanguage,
+      bingMapsKey,
       googleMapsAPIKey,
       withCredentials,
       excludePortalProxyUrl,
@@ -341,6 +343,7 @@ class SmWebMap extends Mixins(VmUpdater, MapEvents) {
         accessKey,
         tiandituKey,
         googleMapsLanguage,
+        bingMapsKey,
         googleMapsAPIKey,
         withCredentials,
         excludePortalProxyUrl,

src/mapboxgl/web-map/WebMapV2.ts

@@ -27,6 +27,7 @@ import proj4 from 'proj4';
  * @param {string} [options.accessToken] - 用于访问 SuperMap iPortal 、SuperMap Online 中受保护的服务。当设置 `id` 时有效。
  * @param {string} [options.accessKey] - SuperMap iServer 提供的一种基于 Token（令牌）的用户身份验证机制。当设置 `id` 时有效。
  * @param {String} [options.tiandituKey] - 用于访问天地图的服务。当设置 `id` 时有效。
+ * @param {String} [options.bingMapsKey] - 用于访问必应地图的服务。当设置 `id` 时有效。
  * @param {String} [options.googleMapsAPIKey] - 用于访问谷歌地图。当设置 `id` 时有效。
  * @param {String} [options.googleMapsLanguage] - 用于定义在谷歌地图图块上显示标签的语言。当设置 `id` 且底图为谷歌地图时有效。
  * @param {boolean} [options.withCredentials=false] - 请求是否携带 cookie。当设置 `id` 时有效。
@@ -44,6 +45,7 @@ interface webMapOptions {
   accessToken?: string;
   accessKey?: string;
   tiandituKey?: string;
+  bingMapsKey?: string;
   googleMapsAPIKey?: string;
   googleMapsLanguage?: string;
   withCredentials?: boolean;
@@ -697,11 +699,29 @@ export default class WebMap extends WebMapBase {
       });
   }
 
-  private _createBingLayer(layerName: string, layerInfo: any, addedCallback?: Function): void {
-    const bingUrl =
-      'https://dynamic.t0.tiles.ditu.live.com/comp/ch/{quadkey}?it=G,TW,L,LA&mkt=zh-cn&og=109&cstl=w4c&ur=CN&n=z';
+  private async _createBingLayer(layerName: string, layerInfo: any, addedCallback?: Function): Promise<void> {
+    let metaInfoUrl =
+      `https://dev.virtualearth.net/REST/v1/Imagery/Metadata/RoadOnDemand?uriScheme=https&include=ImageryProviders&key=${this.bingMapsKey}&c=zh-cn`;
+    const metaInfo = await this._fetchRequest(metaInfoUrl, 'json', {
+      withoutFormatSuffix: true
+    });
+    if (
+      metaInfo.statusCode !== 200 ||
+      metaInfo.resourceSets.length !== 1 ||
+      metaInfo.resourceSets[0].resources.length !== 1
+    ) {
+      return;
+    }
+    const resource = metaInfo.resourceSets[0].resources[0];
+    const urls = [];
+    resource.imageUrlSubdomains.map(function (subdomain) {
+      const imageUrl = resource.imageUrl
+        .replace('{subdomain}', subdomain);
+      urls.push(imageUrl);
+    });
+
     // @ts-ignore
-    this._addBaselayer([bingUrl], layerName, layerInfo.visible);
+    this._addBaselayer(urls, layerName, layerInfo.visible);
     addedCallback && addedCallback();
   }
 
@@ -2735,7 +2755,7 @@ export default class WebMap extends WebMapBase {
     return epsgCode;
   }
 
-  private _fetchRequest(url: any, type: string, options: Object) {
+  private _fetchRequest(url: any, type: string, options?: Object) {
     return SuperMap.FetchRequest.get(url, null, options)
       .then(response => {
         return response[type]();

src/mapboxgl/web-map/WebMapViewModel.ts

@@ -43,6 +43,7 @@ interface webMapOptions {
   accessToken?: string;
   accessKey?: string;
   tiandituKey?: string;
+  bingMapsKey?: string;
   googleMapsAPIKey?: string;
   googleMapsLanguage?: string;
   withCredentials?: boolean;

src/mapboxgl/web-map/__tests__/WebMap.spec.js

@@ -745,5 +745,57 @@ describe('WebMap.vue', () => {
     await mapWrapperLoaded(wrapper);
     await flushPromises();
   });
+
+  it('bing map', async done => {
+    const metaInfo = {
+      resourceSets: [
+        {
+            "resources": [
+                {
+                    "__type": "ImageryMetadata:http://schemas.microsoft.com/search/local/ws/rest/v1",
+                    "imageHeight": 256,
+                    "imageUrl": "https://{subdomain}.ssl.ak.dynamic.tiles.virtualearth.net/comp/ch/{quadkey}?mkt=zh-CN&it=G,L&shading=hill&og=2505&n=z",
+                    "imageUrlSubdomains": [
+                        "t0",
+                        "t1",
+                        "t2",
+                        "t3"
+                    ],
+                    "imageWidth": 256,
+                }
+            ]
+        }
+    ],
+      statusCode: 200,
+      statusDescription: "OK"
+    }
+    const fetchResource = {
+      'https://fakeiportal.supermap.io/iportal/web/maps/1234/map.json': baseLayers['BING'],
+      'https://fakeiportal.supermap.io/iportal/web/config/portal.json': iportal_serviceProxy,
+      'https://dev.virtualearth.net/REST/v1/Imagery/Metadata/RoadOnDemand?uriScheme=https&include=ImageryProviders&key=AhOVlIlR89XkNyDsXBAb7TjabrEokPoqhjk4ncLm9cQkJ5ae_JyhgV1wMcWnVrko&c=zh-cn': metaInfo
+    };
+    mockFetch(fetchResource);
+    wrapper = mount(SmWebMap, {
+      localVue,
+      propsData: {
+        serverUrl: 'https://fakeiportal.supermap.io/iportal',
+        mapId: '1234',
+        bingMapsKey: 'AhOVlIlR89XkNyDsXBAb7TjabrEokPoqhjk4ncLm9cQkJ5ae_JyhgV1wMcWnVrko'
+      },
+    });
+    const callback = jest.fn();
+    wrapper.vm.viewModel.on({ addlayerssucceeded: callback });
+    await mapWrapperLoaded(wrapper);
+    const addBaseLayer = jest.spyOn(wrapper.vm.viewModel._handler, '_addBaselayer');
+    await flushPromises();
+    expect(callback).toHaveBeenCalledTimes(1);
+    expect(addBaseLayer).toHaveBeenCalledWith([
+      'https://t0.ssl.ak.dynamic.tiles.virtualearth.net/comp/ch/{quadkey}?mkt=zh-CN&it=G,L&shading=hill&og=2505&n=z',
+      'https://t1.ssl.ak.dynamic.tiles.virtualearth.net/comp/ch/{quadkey}?mkt=zh-CN&it=G,L&shading=hill&og=2505&n=z',
+      'https://t2.ssl.ak.dynamic.tiles.virtualearth.net/comp/ch/{quadkey}?mkt=zh-CN&it=G,L&shading=hill&og=2505&n=z',
+      'https://t3.ssl.ak.dynamic.tiles.virtualearth.net/comp/ch/{quadkey}?mkt=zh-CN&it=G,L&shading=hill&og=2505&n=z'
+    ], '必应地图', undefined);
+    done();
+  });
 });