snazzy info added, logo added

This commit is contained in:
piratefinn 2017-11-14 17:12:07 +00:00
parent 5af0e1e35c
commit c85602f6e8
7 changed files with 35 additions and 16 deletions

View file

@ -20,7 +20,8 @@
"../node_modules/moment/min/moment.min.js"
],
"styles": [
"scss/style.scss"
"scss/style.scss",
"../node_modules/snazzy-info-window/dist/snazzy-info-window.css"
],
"environmentSource": "environments/environment.ts",
"environments": {

26
package-lock.json generated
View file

@ -14,6 +14,11 @@
"resolved": "https://registry.npmjs.org/@agm/js-marker-clusterer/-/js-marker-clusterer-1.0.0-beta.2.tgz",
"integrity": "sha512-sQzNo+2NwjgVAiy/AU3deYvemoH3CHtYvh+aH/3jq9yIK+2ZiuwhZ2oKmoBsVPEMzLjOqF07FhDLowrAAZfVRw=="
},
"@agm/snazzy-info-window": {
"version": "1.0.0-beta.2",
"resolved": "https://registry.npmjs.org/@agm/snazzy-info-window/-/snazzy-info-window-1.0.0-beta.2.tgz",
"integrity": "sha512-YboKYJ2IzxY27XzGun4rHDw7I8BcHqfEgmzMR7bqSo1UH+JlgSNbuWfEQ2UvKqPlmW0bNm0o6xK8SfbE531QZA=="
},
"@angular-devkit/build-optimizer": {
"version": "0.0.13",
"resolved": "https://registry.npmjs.org/@angular-devkit/build-optimizer/-/build-optimizer-0.0.13.tgz",
@ -7744,6 +7749,11 @@
"debug": "2.6.8"
}
},
"snazzy-info-window": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/snazzy-info-window/-/snazzy-info-window-1.1.0.tgz",
"integrity": "sha1-ux4ws3r4/aj/kAZHQIWtVIbwbw8="
},
"sntp": {
"version": "1.0.9",
"resolved": "https://registry.npmjs.org/sntp/-/sntp-1.0.9.tgz",
@ -7989,14 +7999,6 @@
"integrity": "sha1-J5siXfHVgrH1TmWt3UNS4Y+qBxM=",
"dev": true
},
"string_decoder": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
"integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ==",
"requires": {
"safe-buffer": "5.1.1"
}
},
"string-width": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
@ -8007,6 +8009,14 @@
"strip-ansi": "3.0.1"
}
},
"string_decoder": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz",
"integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ==",
"requires": {
"safe-buffer": "5.1.1"
}
},
"stringstream": {
"version": "0.0.5",
"resolved": "https://registry.npmjs.org/stringstream/-/stringstream-0.0.5.tgz",

View file

@ -20,6 +20,7 @@
"dependencies": {
"@agm/core": "^1.0.0-beta.1",
"@agm/js-marker-clusterer": "^1.0.0-beta.2",
"@agm/snazzy-info-window": "^1.0.0-beta.2",
"@angular/common": "4.0.3",
"@angular/compiler": "4.0.3",
"@angular/core": "4.0.3",
@ -40,6 +41,7 @@
"ngx-bootstrap": "1.6.6",
"ngx-pagination": "^3.0.1",
"rxjs": "5.4.2",
"snazzy-info-window": "^1.1.0",
"ts-helpers": "1.1.2",
"webpack": "3.5.4",
"webpack-dev-server": "2.7.1",

View file

@ -6,6 +6,7 @@ import { BsDropdownModule } from 'ngx-bootstrap/dropdown';
import { NgxPaginationModule } from 'ngx-pagination';
import { AgmCoreModule, GoogleMapsAPIWrapper } from '@agm/core';
import { AgmJsMarkerClustererModule } from '@agm/js-marker-clusterer';
import { AgmSnazzyInfoWindowModule } from '@agm/snazzy-info-window';
import { CurrencyPipe } from '@angular/common';
@ -45,6 +46,7 @@ import { environment } from '../../environments/environment';
apiKey: environment.mapApiKey
}),
AgmJsMarkerClustererModule,
AgmSnazzyInfoWindowModule,
BsDropdownModule,
NgxPaginationModule,
DashboardRoutingModule,

View file

@ -25,13 +25,17 @@
<agm-marker-cluster maxZoom="13" imagePath="https://raw.githubusercontent.com/googlemaps/v3-utility-library/master/markerclustererplus/images/m">
<agm-marker
*ngFor="let m of markers"
[iconUrl]="'/assets/img/map-pin-lis.png'"
[latitude]="m.latitude"
[longitude]="m.longitude"
[label]="m.name[0]">
<agm-info-window>
<strong>{{m.name}}</strong>
</agm-info-window>
[longitude]="m.longitude">
<agm-snazzy-info-window
[maxWidth]="500"
[closeWhenOthersOpen]="true">
<ng-template>
<h4><strong>{{m.name}}</strong></h4>
<img src="assets/img/avatars/default.png" class="img-avatar" alt="avatar-image">
</ng-template>
</agm-snazzy-info-window>
</agm-marker>
</agm-marker-cluster>
</agm-map>

View file

@ -5,7 +5,7 @@ import { AgmCoreModule } from '@agm/core';
import 'rxjs/add/operator/map';
@Component({
templateUrl: 'map.component.html',
templateUrl: 'trail-map.component.html',
})
export class TrailMapComponent implements OnInit {

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB