l="diff-bf4444d24793474575edfcb603c56d915e48829cR58">58 
+    });
59 
+  }
60 
+
61 
+  showMap() {
62 
+    let location = new google.maps.LatLng(13.7643439, 100.6899729);
63 
+    let options = {
64 
+      center: location,
65 
+      zoom: 15,
66 
+      disableDefaultUI: true
67 
+    }
68 
+    this.map = new google.maps.Map(this.mapRef.nativeElement, options);
69 
+    //this.map = new google.maps.Map(this.mapElement.nativeElement, mapOptions);
70 
+  }
71 
+
72 
+}

+ 17 - 0
src/app/nearme/nearme-routing.module.ts
Целия файл 

@@ -0,0 +1,17 @@
1 
+import { NgModule } from '@angular/core';
2 
+import { Routes, RouterModule } from '@angular/router';
3 
+
4 
+import { NearmePage } from './nearme.page';
5 
+
6 
+const routes: Routes = [
7 
+  {
8 
+    path: '',
9 
+    component: NearmePage
10 
+  }
11 
+];
12 
+
13 
+@NgModule({
14 
+  imports: [RouterModule.forChild(routes)],
15 
+  exports: [RouterModule],
16 
+})
17 
+export class NearmePageRoutingModule {}

+ 20 - 0
src/app/nearme/nearme.module.ts
Целия файл 

@@ -0,0 +1,20 @@
1 
+import { NgModule } from '@angular/core';
2 
+import { CommonModule } from '@angular/common';
3 
+import { FormsModule } from '@angular/forms';
4 
+
5 
+import { IonicModule } from '@ionic/angular';
6 
+
7 
+import { NearmePageRoutingModule } from './nearme-routing.module';
8 
+
9 
+import { NearmePage } from './nearme.page';
10 
+
11 
+@NgModule({
12 
+  imports: [
13 
+    CommonModule,
14 
+    FormsModule,
15 
+    IonicModule,
16 
+    NearmePageRoutingModule
17 
+  ],
18 
+  declarations: [NearmePage]
19 
+})
20 
+export class NearmePageModule {}

+ 40 - 0
src/app/nearme/nearme.page.html
Целия файл 

@@ -0,0 +1,40 @@
1 
+<ion-header>
2 
+  <ion-toolbar class="new-background-color">
3 
+    <ion-buttons slot="start" color="light">
4 
+      <ion-back-button></ion-back-button>
5 
+    </ion-buttons>
6 
+    <ion-title>Wellnewss Route</ion-title>
7 
+  </ion-toolbar>
8 
+</ion-header>
9 
+
10 
+<ion-content>
11 
+  <ion-grid>
12 
+    <ion-row>
13 
+      <ion-col>
14 
+        <div #nearmap id="nearmap"></div>
15 
+      </ion-col>
16 
+    </ion-row>
17 
+    <ion-row >
18 
+      <ion-col>
19 
+        <ion-card *ngFor="let nearm of placenear">
20 
+          <div *ngIf="nearm.better_featured_image != null">
21 
+            <img src="{{nearm.better_featured_image.source_url}}" alt="">
22 
+          </div>
23 
+          <div *ngIf="nearm.better_featured_image == null">
24 
+            <img src="/assets/images/temp.png" />
25 
+          </div>
26 
+          <ion-card-header>
27 
+            <a [routerLink]="['/tabs/place/', nearm.id]"><ion-card-title [innerHTML]="nearm.title.rendered"></ion-card-title>
28 
+            </a>
29 
+            <a [routerLink]="['/tabs/province/']">
30 
+              <span [innerHTML]="nearm._embedded['wp:term'][1][0].name"></span>
31 
+            </a> /
32 
+            <a [routerLink]="['/tabs/place/']">
33 
+              <span [innerHTML]="nearm._embedded['wp:term'][2][0].name"></span>
34 
+            </a>
35 
+          </ion-card-header>
36 
+        </ion-card>
37 
+      </ion-col>
38 
+    </ion-row>
39 
+  </ion-grid>
40 
+</ion-content>

+ 9 - 0
src/app/nearme/nearme.page.scss
Целия файл 

@@ -0,0 +1,9 @@
1 
+ion-card-title {
2 
+    font-family: "IBM Plex Sans Thai", sans-serif !important;
3 
+    font-weight: 600;
4 
+    font-size: 20px;
5 
+  }
6 
+
7 
+  #nearmap {
8 
+    height: 300px;
9 
+}

+ 24 - 0
src/app/nearme/nearme.page.spec.ts
Целия файл 

@@ -0,0 +1,24 @@
1 
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
2 
+import { IonicModule } from '@ionic/angular';
3 
+
4 
+import { NearmePage } from './nearme.page';
5 
+
6 
+describe('NearmePage', () => {
7 
+  let component: NearmePage;
8 
+  let fixture: ComponentFixture<NearmePage>;
9 
+
10 
+  beforeEach(waitForAsync(() => {
11 
+    TestBed.configureTestingModule({
12 
+      declarations: [ NearmePage ],
13 
+      imports: [IonicModule.forRoot()]
14 
+    }).compileComponents();
15 
+
16 
+    fixture = TestBed.createComponent(NearmePage);
17 
+    component = fixture.componentInstance;
18 
+    fixture.detectChanges();
19 
+  }));
20 
+
21 
+  it('should create', () => {
22 
+    expect(component).toBeTruthy();
23 
+  });
24 
+});

+ 45 - 0
src/app/nearme/nearme.page.ts
Целия файл 

@@ -0,0 +1,45 @@
1 
+import { Component, OnInit, Input, ViewChild, ElementRef } from '@angular/core';
2 
+import { WpServiceService } from '../wp-service.service';
3 
+import { Geolocation } from '@ionic-native/geolocation/ngx';
4 
+import { NativeGeocoder, NativeGeocoderResult, NativeGeocoderOptions } from '@ionic-native/native-geocoder/ngx';
5 
+
6 
+declare var google: any;
7 
+
8 
+
9 
+@Component({
10 
+  selector: 'app-nearme',
11 
+  templateUrl: './nearme.page.html',
12 
+  styleUrls: ['./nearme.page.scss'],
13 
+})
14 
+export class NearmePage implements OnInit {
15 
+
16 
+  @ViewChild('nearmap', { static: true }) mapRef: ElementRef;
17 
+
18 
+  nearmap: any;
19 
+  placenear: any = [];
20 
+
21 
+  constructor(private wpservice: WpServiceService, private geolocation: Geolocation) { }
22 
+
23 
+  ngOnInit() {
24 
+
25 
+    this.showMap();
26 
+    //console.log(this.mapRef.nativeElement);
27 
+    this.wpservice.getNear().subscribe((placeneardata) => {
28 
+      this.placenear = placeneardata;
29 
+      console.log('load Near Place');
30 
+      console.log(placeneardata);
31 
+    });
32 
+
33 
+  }
34 
+
35 
+  showMap() {
36 
+    let location = new google.maps.LatLng(13.7643439, 100.6899729);
37 
+    let options = {
38 
+      center: location,
39 
+      zoom: 15,
40 
+      disableDefaultUI: true
41 
+    }
42 
+    this.nearmap = new google.maps.Map(this.mapRef.nativeElement, options);
43 
+  }
44 
+
45 
+}

+ 10 - 0
src/app/place/place.page.html
Целия файл 

@@ -1,5 +1,8 @@
1 1 
 <ion-header>
2 2 
   <ion-toolbar class="new-background-color">
3 
+    <ion-buttons slot="start" color="light">
4 
+      <ion-back-button></ion-back-button>
5 
+    </ion-buttons>
3 6 
     <ion-title>Wellness Route</ion-title>
4 7 
   </ion-toolbar>
5 8 
 </ion-header>
 
@@ -13,6 +16,13 @@
13 16 
           <div class="txt-place-title">Place Category Name</div>
14 17 
         </ion-col>
15 18 
       </ion-row>
19 
+      <ion-row>
20 
+        <ion-col>
21 
+          <ion-toolbar class="search">
22 
+            <ion-searchbar placeholder="ค้นหา"></ion-searchbar>
23 
+          </ion-toolbar>
24 
+        </ion-col>
25 
+      </ion-row>
16 26 
       <ion-card *ngFor="let pcl of placecatlist">
17 27 
         <div *ngIf="$any(pcl).better_featured_image != null">
18 28 
           <img src="{{$any(pcl).better_featured_image.source_url}}" alt="">

+ 22 - 7
src/app/placedetail/placedetail.page.html
Целия файл 

@@ -8,7 +8,7 @@
8 8 
 </ion-header>
9 9
10 10 
 <ion-content>
11 
-  <div *ngIf="placelist?.better_featured_image != null" >
11 
+  <div *ngIf="placelist?.better_featured_image != null">
12 12 
     <img src="{{placelist?.better_featured_image.source_url}}">
13 13 
   </div>
14 14 
   <div *ngIf="placelist?.better_featured_image == null" class="asd">
 
@@ -25,21 +25,24 @@
25 25 
         <div>{{ placelist?.acf.openclose }}</div>
26 26 
       </ion-col>
27 27 
       <ion-col size="12">
28 
+        {{ placelist?.acf.gmap.address }}
29 
+        {{ placelist?.acf.gmap.lat }}
30 
+        {{ placelist?.acf.gmap.lng }}
28 31 
         <img src="/assets/images/map-temp.jpg" alt="">
29 32 
       </ion-col>
30 
-      <ion-col size="12">
33 
+      <ion-col size="12">
31 34 
         <ion-row>
32 35 
           <ion-col size="4" class="ion-text-center">
33 36 
             <!-- <div [innerHTML]="placelist?.acf.phone"></div>                         -->
34 
-            <fa-icon [icon]="['fas', 'phone-square-alt']" size="2x"></fa-icon>
37 
+            <fa-icon [icon]="['fas', 'phone-square-alt']" size="2x"></fa-icon>
35 38 
           </ion-col>
36 39 
           <ion-col size="4" class="ion-text-center">
37 40 
             <!-- <div [innerHTML]="placelist?.acf.phone"></div>                         -->
38 
-            <fa-icon [icon]="['fas', 'map-marked-alt']" size="2x"></fa-icon>
41 
+            <fa-icon [icon]="['fas', 'map-marked-alt']" size="2x"></fa-icon>
39 42 
           </ion-col>
40 43 
           <ion-col size="4" class="ion-text-center">
41 44 
             <!-- <div [innerHTML]="placelist?.acf.email"></div>             -->
42 
-            <fa-icon [icon]="['fas', 'envelope']" size="2x"></fa-icon>
45 
+            <fa-icon [icon]="['fas', 'envelope']" size="2x"></fa-icon>
43 46 
           </ion-col>
44 47 
         </ion-row>
45 48 
       </ion-col>
 
@@ -48,10 +51,22 @@
48 51 
         <div [innerHTML]="placelist?.acf.address"></div>
49 52 
       </ion-col>
50 53 
       <ion-col size="12">
51 
-        <div class="txt-lead">รายละเอียด</div>
52 
-        <div [innerHTML]="placelist?.content.rendered"></div>
54 
+        <!-- <div class="txt-lead">รายละเอียด</div>
55 
+        <div [innerHTML]="placelist?.content.rendered"></div> -->
53 56 
         <!-- <div>{{placelist?.content.rendered}}</div> -->
57 
+        <!-- <ion-button (click)="loadMap()" shape="round" color="dark">
58 
+          <ion-icon slot="start" name="locate"></ion-icon>
59 
+          Where I Am
60 
+        </ion-button> -->
61 
+        <div class="map-wrapper">
62 
+          <div id="map_center">
63 
+            <img src="assets/icon/location-marker.png" />
64 
+          </div>
65 
+          <div #map id="map"></div>
66 
+        </div>
67 
+
54 68 
       </ion-col>
55 69 
     </ion-row>
70 
+
56 71 
   </ion-grid>
57 72 
 </ion-content>

+ 52 - 22
src/app/placedetail/placedetail.page.scss
Целия файл 

@@ -11,35 +11,65 @@
11 11 
 //     position: absolute;
12 12 
 // }
13 13
14 
-
15 
-.bg{
14 
+.bg {
15 
+  position: absolute;
16 
+  left: 0px;
17 
+  top: 0px;
18 
+  width: 100vw;
19 
+  height: 60vh;
20 
+  .holidaycard {
16 21 
     position: absolute;
17 22 
     left: 0px;
18 
-    top: 0px;
19 
-    width: 100vw;
20 
-    height: 60vh;
21 
-    .holidaycard {
22 
-        position: absolute;
23 
-        left: 0px;
24 
-        bottom: 0px;
25 
-        min-height: 60%;
26 
-        width: 100%;
27 
-        padding: 10px;
28 
-        border-radius: 25px ;
29 
-        background: white;
30 
-        --background: white;
31 
-    }
23 
+    bottom: 0px;
24 
+    min-height: 60%;
25 
+    width: 100%;
26 
+    padding: 10px;
27 
+    border-radius: 25px;
28 
+    background: white;
29 
+    --background: white;
30 
+  }
32 31 
 }
33 32
34 33 
 .asd {
34 
+}
35 
+
36 
+.asd .country {
37 
+  position: absolute;
38 
+  top: 50px;
39 
+  width: 140px;
40 
+  padding-left: 10px !important;
41 
+  padding-right: 10px !important;
42 
+  color: white;
43 
+}
44 
+
45 
+#map_canvas {
46 
+  width: 90%;
47 
+  height: 80%;
48 
+  border: 1px solid red;
49 
+}
50 
+
51 
+#address {
52 
+  padding: 10px;
53 
+  font-size: 18px;
54 
+  font-weight: bold;
55 
+}
35 56
57 
+#map {
58 
+  width: 100%;
59 
+  height: 20vh;
36 60 
 }
37 61
38 
-.asd .country{
62 
+.map-wrapper {
63 
+  position: relative;
64 
+
65 
+  #map_center {
39 66 
     position: absolute;
40 
-    top: 50px;
41 
-    width: 140px;
42 
-    padding-left: 10px !important;
43 
-    padding-right: 10px !important;
44 
-    color: white;
67 
+    z-index: 99;
68 
+    height: 40px;
69 
+    width: 40px;
70 
+    top: 50%;
71 
+    left: 50%;
72 
+    margin-left: -21px;
73 
+    margin-top: -41px;
74 
+  }
45 75 
 }

+ 105 - 7
src/app/placedetail/placedetail.page.ts
Целия файл 

@@ -1,7 +1,12 @@
1 
-import { Component, OnInit, Input } from '@angular/core';
1 
+import { Component, OnInit, Input, ViewChild, ElementRef } from '@angular/core';
2 2 
 import { ActivatedRoute, Router } from '@angular/router';
3 3 
 import { WpServiceService } from '../wp-service.service';
4 4
5 
+import { Geolocation } from '@ionic-native/geolocation/ngx';
6 
+import { NativeGeocoder, NativeGeocoderResult, NativeGeocoderOptions } from '@ionic-native/native-geocoder/ngx';
7 
+
8 
+declare var google;
9 
+
5 10 
 @Component({
6 11 
   selector: 'app-placedetail',
7 12 
   templateUrl: './placedetail.page.html',
 
@@ -12,7 +17,16 @@ export class PlacedetailPage implements OnInit {
12 17 
   data: any;
13 18 
   placelist: any;
14 19
15 
-  constructor(private wpservice: WpServiceService, private route: ActivatedRoute, private router: Router) { }
20 
+  @ViewChild('map', { static: false }) mapElement: ElementRef;
21 
+  map: any;
22 
+  address: string;
23 
+  latitude: number;
24 
+  longitude: number;
25 
+  latdynamic: any;
26 
+  londynamic: any;
27 
+
28 
+
29 
+  constructor(private wpservice: WpServiceService, private route: ActivatedRoute, private router: Router, private geolocation: Geolocation, private nativeGeocoder: NativeGeocoder) { }
16 30 
   @Input() id: string;
17 31 
   showDiss = false;
18 32 
 
@@ -21,23 +35,107 @@ export class PlacedetailPage implements OnInit {
21 35 
     if (this.id != undefined) {
22 36 
       this.showDiss = true;
23 37 
     }
38 
+    this.loadMap();
24 39 
     // console.log("showDiss ", this.showDiss);
25 40 
     // let id = this.route.snapshot.paramMap.get('id') || this.id;
26 41 
     // console.log("fetching ...");
27 42 
     // this.wpservice.getPlaceDetail(id).subscribe(data => {
28 
-      // let post = JSON.parse(data.data);
29 
-      // console.log(" get data ", post);
30 
-      // post['media_url'] = post['_embedded']['wp:featuredmedia'][0]['media_details'].sizes['medium'].source_url;
31 
-      // this.data = post;
43 
+    // let post = JSON.parse(data.data);
44 
+    // console.log(" get data ", post);
45 
+    // post['media_url'] = post['_embedded']['wp:featuredmedia'][0]['media_details'].sizes['medium'].source_url;
46 
+    // this.data = post;
32 47 
     let id = this.route.snapshot.paramMap.get('id') || this.id;
33 48 
     console.log("fetching ...");
34 49 
     this.wpservice.getPlaceDetail(id).subscribe((data) => {
35 
-      this.placelist = data;
50 
+      this.placelist = data;
51 
+      this.latdynamic = data['acf']['gmap']['lat'];
52 
+      this.londynamic = data['acf']['gmap']['lng'];
36 53 
       console.log("load Place Detail ...");
54 
+      console.log(this.latdynamic);
55 
+      console.log("load Lati ...");
56 
+      console.log(this.londynamic);
57 
+      console.log("load Lon ...");
37 58 
       console.log(data);
38 59 
     }, error => {
39 60 
       console.log("errror ", error);
40 61 
     });
41 62 
   }
42 63
64 
+  loadMap() {
65 
+    this.geolocation.getCurrentPosition().then((resp) => {
66 
+
67 
+      this.latitude = resp.coords.latitude;
68 
+      this.longitude = resp.coords.longitude;
69 
+      // this.latdynamic = resp.coords.latitude;
70 
+      // this.londynamic = resp.coords.longitude;
71 
+
72 
+      let latLng = new google.maps.LatLng(resp.coords.latitude, resp.coords.longitude);
73 
+      let mapOptions = {
74 
+        center: latLng,
75 
+        zoom: 15,
76 
+        mapTypeId: google.maps.MapTypeId.ROADMAP
77 
+      }
78 
+
79 
+      this.getAddressFromCoords(resp.coords.latitude, resp.coords.longitude);
80 
+
81 
+      this.map = new google.maps.Map(this.mapElement.nativeElement, mapOptions);
82 
+
83 
+      this.map.addListener('dragend', () => {
84 
+
85 
+        this.latitude = this.map.center.lat();
86 
+        this.longitude = this.map.center.lng();
87 
+
88 
+        this.getAddressFromCoords(this.map.center.lat(), this.map.center.lng())
89 
+      });
90 
+
91 
+    }).catch((error) => {
92 
+      console.log('Error getting location', error);
93 
+    });
94 
+  }
95 
+
96 
+  getAddressFromCoords(lattitude, longitude) {
97 
+    console.log("getAddressFromCoords " + lattitude + " " + longitude);
98 
+    let options: NativeGeocoderOptions = {
99 
+      useLocale: true,
100 
+      maxResults: 5
101 
+    };
102 
+
103 
+    this.nativeGeocoder.reverseGeocode(lattitude, longitude, options)
104 
+      .then((result: NativeGeocoderResult[]) => {
105 
+        this.address = "";
106 
+        let responseAddress = [];
107 
+        for (let [key, value] of Object.entries(result[0])) {
108 
+          if (value.length > 0)
109 
+            responseAddress.push(value);
110 
+
111 
+        }
112 
+        responseAddress.reverse();
113 
+        for (let value of responseAddress) {
114 
+          this.address += value + ", ";
115 
+        }
116 
+        this.address = this.address.slice(0, -2);
117 
+      })
118 
+      .catch((error: any) => {
119 
+        this.address = "Address Not Available!";
120 
+      });
121 
+
122 
+  }
123 
+
124 
+  // getAddressFromCoords2(lattitude, longitude) {
125 
+  //   console.log("getAddressFromCoords2 " + lattitude + " " + longitude);
126 
+  //   let options: NativeGeocoderOptions = {
127 
+  //     useLocale: true,
128 
+  //     maxResults: 5
129 
+  //   };
130 
+  // }
131 
+
132 
+  // getGeoencoder(latitude, longitude) {
133 
+  //   this.nativeGeocoder.reverseGeocode(latitude, longitude, this.geoencoderOptions)
134 
+  //     .then((result: NativeGeocoderResult[]) => {
135 
+  //       this.address = this.generateAddress(result[0]);
136 
+  //     })
137 
+  //     .catch((error: any) => {
138 
+  //       alert('Error getting location' + JSON.stringify(error));
139 
+  //     });
140 
+  // }
43 141 
 }

+ 8 - 1
src/app/province/province.page.html
Целия файл 

@@ -16,6 +16,13 @@
16 16 
           <div class="txt-place-title">Province Name</div>
17 17 
         </ion-col>
18 18 
       </ion-row>
19 
+      <ion-row>
20 
+        <ion-col>
21 
+          <ion-toolbar class="search">
22 
+            <ion-searchbar placeholder="ค้นหา"></ion-searchbar>
23 
+          </ion-toolbar>
24 
+        </ion-col>
25 
+      </ion-row>
19 26 
       <ion-card *ngFor="let provlist of provicelist">
20 27 
         <div *ngIf="$any(provlist).better_featured_image != null">
21 28 
           <img src="{{$any(provlist).better_featured_image.source_url}}" alt="">
 
@@ -24,7 +31,7 @@
24 31 
           <img src="/assets/images/temp.png" />
25 32 
         </div>
26 33 
         <ion-card-header>
27 
-          <a [routerLink]="['/tabs/place/', pldata.id]"><ion-card-title [innerHTML]="provlist.title.rendered"></ion-card-title></a>
34 
+          <a [routerLink]="['/tabs/place/', provlist.id]"><ion-card-title [innerHTML]="provlist.title.rendered"></ion-card-title></a>
28 35 
         </ion-card-header>
29 36 
       </ion-card>
30 37 
     </ion-grid>

+ 1 - 18
src/app/province/province.page.scss
Целия файл 

@@ -1,21 +1,4 @@
1 
-// .bg {
2 
-//   position: absolute;
3 
-//   left: 0px;
4 
-//   top: 0px;
5 
-//   width: 100vw;
6 
-//   height: 100vh;
7 
-//   .holidaycard {
8 
-//     position: absolute;
9 
-//     left: 0px;
10 
-//     bottom: 0px;
11 
-//     min-height: 60%;
12 
-//     width: 100%;
13 
-//     padding: 10px;
14 
-//     border-radius: 25px;
15 
-//     background: white;
16 
-//     --background: white;
17 
-//   }
18 
-// }
1 
+
19 2 
 .holidaycard {
20 3 
   position: absolute;
21 4 
   left: 0px;

+ 8 - 0
src/app/tabs/tabs-routing.module.ts
Целия файл 

@@ -61,6 +61,14 @@ const routes: Routes = [
61 61 
         loadChildren: () => import('../province/province.module').then(m => m.ProvincePageModule)
62 62 
       },
63 63 
       {
64 
+        path: 'gmap',
65 
+        loadChildren: () => import('../gmap/gmap.module').then(m => m.GmapPageModule)
66 
+      },
67 
+      {
68 
+        path: 'nearme',
69 
+        loadChildren: () => import('../nearme/nearme.module').then( m => m.NearmePageModule)
70 
+      },
71 
+      {
64 72 
         path: '',
65 73 
         redirectTo: '/tabs/home',
66 74 
         pathMatch: 'full'

+ 5 - 3
src/app/tabs/tabs.page copy.html
Целия файл 

@@ -1,8 +1,10 @@
1 1 
 <ion-tabs>
2 2 
   <ion-fab vertical="bottom" horizontal="center" slot="fixed">
3 
-    <ion-fab-button>
4 
-      <ion-icon name="add-outline"></ion-icon>
5 
-    </ion-fab-button>
3 
+
4 
+      <ion-fab-button [routerLink]="['/tabs/nearme/']">
5 
+        <ion-icon name="add-outline"></ion-icon>
6 
+      </ion-fab-button>
7 
+
6 8 
   </ion-fab>
7 9
8 10 
   <ion-tab-bar slot="bottom">

+ 5 - 6
src/app/tabs/tabs.page.html
Целия файл 

@@ -1,17 +1,16 @@
1 1 
 <ion-tabs>
2 
-  <!-- <ion-fab vertical="bottom" horizontal="center" slot="fixed">
3 
-    <ion-fab-button>
4 
-      <ion-icon name="add-outline"></ion-icon>
2 
+  <ion-fab vertical="bottom" horizontal="center" translucent="true">
3 
+    <ion-fab-button routerLink="nearme" routerDirection="forward">
4 
+    <ion-icon name="navigate"></ion-icon>
5 5 
     </ion-fab-button>
6 
-  </ion-fab> -->
7 
-
6 
+  </ion-fab>
8 7 
   <ion-tab-bar slot="bottom">
9 8 
     <ion-tab-button tab="home">
10 9 
       <ion-icon name="home"></ion-icon>
11 10 
       <ion-label>หน้าแรก</ion-label>
12 11 
     </ion-tab-button>
13 12
14 
-    <ion-tab-button tab="tab2">
13 
+    <ion-tab-button tab="nearme">
15 14 
       <ion-icon name="location"></ion-icon>
16 15 
       <ion-label>ใกล้ฉัน</ion-label>
17 16 
     </ion-tab-button>

+ 7 - 0
src/app/wp-service.service.ts
Целия файл 

@@ -22,6 +22,13 @@ export class WpServiceService {
22 22 
     );
23 23 
   }
24 24
25 
+  getNear() {
26 
+    return this.http.get(
27 
+      "/assets/json/place.json"
28 
+      // "http://tamtime.iamarray.xyz/wp-json/wp/v2/place?_embed"
29 
+    );
30 
+  }
31 
+
25 32 
   getPlaceDetail(id) {
26 33 
     return this.http.get(
27 34 
       "http://tamtime.iamarray.xyz/wp-json/wp/v2/place/"+id+"/?_embed"

BIN
src/assets/icon/location-marker.png
Целия файл


+ 5 - 1
src/global.scss
Целия файл 

@@ -164,4 +164,8 @@ a {
164 164
165 165 
 // ion-content {
166 166 
 //   --background: url(/assets/images/wnr-bg.jpg) no-repeat center/cover fixed;
167 
-// }
167 
+// }
168 
+.ios ion-fab-button {
169 
+  position:absolute;
170 
+  bottom: 25px;
171 
+}

+ 2 - 0
src/index.html
Целия файл 

@@ -17,6 +17,8 @@
17 17 
   <!-- add to homescreen for ios -->
18 18 
   <meta name="apple-mobile-web-app-capable" content="yes" />
19 19 
   <meta name="apple-mobile-web-app-status-bar-style" content="black" />
20 
+
21 
+  <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDHSbJHYItlRqJeZ737ju4weBHlarJIPGE"></script>
20 22 
 </head>
21 23
22 24 
 <body>

Sign In - Gogs: Simplico Git Service
Home Explore Help
Sign In

Sign In

Forgot password?