liuhj 4 months ago
parent
commit
d438389335
1 changed files with 41 additions and 26 deletions
  1. 41 26
      src/components/statistics/Statistically.vue

+ 41 - 26
src/components/statistics/Statistically.vue

@@ -496,7 +496,7 @@ export default {
                 this.StatisticsGroupCost()
             }
             if (this.activeName=='fifth') {
-                this.getonline();
+                // this.getonline();
             }
             // console.log(tab, event);
         },
@@ -627,17 +627,6 @@ export default {
         },
         //在线地图
         async onlinemap(){
-            // var token="eyJraWQiOiI1NEIyRkFLODMzIiwidHlwIjoiSldUIiwiYWxnIjoiRVMyNTYifQ.eyJpc3MiOiJIS0YzNzJKU01LIiwiaWF0IjoxNzMzMTkxMzI2LCJvcmlnaW4iOiJvYS5wYW4tYW1lcmljYW4taW50bC5jb20ifQ.1czYQb-Nxh6n4kG9sVylQH32XawN92gBKXjn6i_SU0F2M9fpwbStM-gDRvfANEiEUDz5ogUmm_FQf9eBF8o9Zg";
-            // mapkit.init({
-            //     authorization: token, // 使用获取到的token
-            //     language: 'zh'
-            // });
-            // this.map = new mapkit.Map(document.getElementById('map'), {
-            //     center: new mapkit.Coordinate(37.7749, -122.4194),
-            //     zoom: 11
-            // });
-            // const token = mapkitToken.getToken(CLIENT_ID, TEAM_ID, KEY_ID, PRIVATE_KEY);
-            // const { getToken } = require('mapkit-token');
             const token = "eyJraWQiOiI1NEIyRkFLODMzIiwidHlwIjoiSldUIiwiYWxnIjoiRVMyNTYifQ.eyJpc3MiOiJIS0YzNzJKU01LIiwiaWF0IjoxNzMzMTkxMzI2LCJvcmlnaW4iOiJvYS5wYW4tYW1lcmljYW4taW50bC5jb20ifQ.1czYQb-Nxh6n4kG9sVylQH32XawN92gBKXjn6i_SU0F2M9fpwbStM-gDRvfANEiEUDz5ogUmm_FQf9eBF8o9Zg";
             mapkit.init({
                 language: 'zh-Hans',
@@ -645,22 +634,48 @@ export default {
                     done(token);
                 }
             });
-            // var map = new mapkit.Map('map', { center: new mapkit.Coordinate(104.096488, 30.635261) });
-            // const coordinate = new mapkit.Coordinate(104.096488, 30.635261)
-            // const map = new mapkit.Map("map", {
-            //     center: coordinate, 
-            //     countryCode: "CN",
-            //     isZoomEnabled:true,
-            // })
-            this.map = new mapkit.Map("map", { 
-                center: new mapkit.Coordinate(104.096488, 30.635261),
-                showsMapTypeControl: true,
-                showsZoomControl: true,
+            var sanFranciscoLandmarks = [
+                { coordinate: new mapkit.Coordinate(37.7951315, -122.402986), title: "Transamerica Pyramid", phone: "+1-415-983-5420", url: "http://www.transamericapyramidcenter.com/" },
+                { coordinate: new mapkit.Coordinate(37.7954201, -122.39352), title: "Ferry Building", phone: "+1 (415) 983-8030", url: "http://www.ferrybuildingmarketplace.com" },
+                { coordinate: new mapkit.Coordinate(37.8083396, -122.415727), title: "Fisherman's Wharf", phone: "+1 (415) 673-3530", url: "http://visitfishermanswharf.com" },
+                { coordinate: new mapkit.Coordinate(37.8023553, -122.405742), title: "Coit Tower", phone: "+1 (415) 249-0995", url: "http://sfrecpark.org/destination/telegraph-hill-pioneer-park/coit-tower/" },
+                { coordinate: new mapkit.Coordinate(37.7552305, -122.452624), title: "Sutro Tower", phone: "+1 (415) 681-8850", url: "http://www.sutrotower.com" },
+                { coordinate: new mapkit.Coordinate(37.779267, -122.419269), title: "City Hall", phone: "+1 (415) 701-2311", url: "http://sfgsa.org/index.aspx?page=1085" },
+                { coordinate: new mapkit.Coordinate(37.8184493, -122.478409), title: "Golden Gate Bridge", phone: "+1 (415) 921-5858", url: "http://www.goldengatebridge.org" },
+                { coordinate: new mapkit.Coordinate(37.7785538, -122.514035), title: "Cliff House", phone: "+1 (415) 386-3330", url: "http://www.cliffhouse.com/" }
+            ];
+            var annotations = sanFranciscoLandmarks.map(function(landmark) {
+                var annotation = new mapkit.MarkerAnnotation(landmark.coordinate, {
+                    callout: landmarkAnnotationCallout,
+                    color: "#c969e0"
+                });
+                annotation.landmark = landmark;
+                return annotation;
             });
-            // let overlay = new mapkit.MapOverlay(map.region, {
-            //     urlTemplate: "https://example.com/overlay/{x}/{y}/{z}.png"
+        
+            var CALLOUT_OFFSET = new DOMPoint(-148, -78);
+            var landmarkAnnotationCallout = {
+                calloutElementForAnnotation: function(annotation) {
+                    return calloutForLandmarkAnnotation(annotation);
+                },
+            
+                calloutAnchorOffsetForAnnotation: function(annotation, element) {
+                    return CALLOUT_OFFSET;
+                },
+            
+                calloutAppearanceAnimationForAnnotation: function(annotation) {
+                    return ".4s cubic-bezier(0.4, 0, 0, 1.5) 0s 1 normal scale-and-fadein";
+                }
+            };
+            this.map = new mapkit.Map("map");
+            this.map.showItems(annotations);
+
+            // this.map = new mapkit.Map("map", { 
+            //     center: new mapkit.Coordinate(104.096488, 30.635261),
+            //     showsMapTypeControl: true,
+            //     showsZoomControl: true,
             // });
-            // map.addOverlay(overlay);
+            console.log(this.map);
             
         },
         //团组酒店