- add marker service
- enable dependency injection with webpack configuration
This commit is contained in:
Arno Kaimbacher
parent
2f048c1c0f
commit
5f2dd2851b
16 changed files with 4606 additions and 1165 deletions
1
.babelrc
1
.babelrc
|
|
@ -4,6 +4,7 @@
|
|||
"@babel/preset-typescript"
|
||||
],
|
||||
"plugins": [
|
||||
"babel-plugin-transform-typescript-metadata",
|
||||
["@babel/plugin-proposal-decorators", { "legacy": true }],
|
||||
["@babel/plugin-proposal-class-properties", { "loose": true }],
|
||||
["@babel/plugin-proposal-private-methods", { "loose": true }]
|
||||
|
|
|
|||
|
|
@ -28,8 +28,8 @@
|
|||
<body>
|
||||
<!-- your content here... -->
|
||||
<app-component></app-component>
|
||||
|
||||
<!-- <script src="dist/polyfills.js" defer></script> -->
|
||||
<!--
|
||||
<script src="dist/polyfills.js" defer></script> -->
|
||||
<script src="dist/main.js"></script>
|
||||
</body>
|
||||
|
||||
|
|
|
|||
69
notes.txt
69
notes.txt
|
|
@ -15,6 +15,8 @@ npm install --save-dev @babel/plugin-proposal-decorators
|
|||
|
||||
npm install --save leaflet@latest
|
||||
|
||||
# Polyfills for angular
|
||||
npm install --save core-js zone.js
|
||||
|
||||
|
||||
|
||||
|
|
@ -36,6 +38,11 @@ CREATE src/app/map/map.component.css (0 bytes)
|
|||
UPDATE src/app/app.module.ts (894 bytes)
|
||||
|
||||
|
||||
npx @angular/cli generate service marker --skip-tests
|
||||
|
||||
|
||||
npx @angular/cli generate component map --skip-tests
|
||||
|
||||
|
||||
========================================= ExtractTextPlugin ==================================================
|
||||
|
||||
|
|
@ -45,3 +52,65 @@ npm install --save-dev mini-css-extract-plugin
|
|||
|
||||
|
||||
npm install terser-webpack-plugin --save-dev
|
||||
|
||||
|
||||
======================================== DI ==============================================
|
||||
|
||||
https://github.com/leonardfactory/babel-plugin-transform-typescript-metadata
|
||||
npm install --dev --save babel-plugin-transform-typescript-metadata
|
||||
|
||||
# Polyfills for angular
|
||||
The import in polyfills.ts is not contained in a default Angular project anymore because Angular only needs it for dev environment.
|
||||
|
||||
If you need the polyfill, e.g. for modules like class-transformer, you can add it to the polyfills.ts:
|
||||
npm install --save core-js
|
||||
|
||||
import 'core-js/proposals/reflect-metadata';
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
===================================leaflet images ===========================================================
|
||||
|
||||
============================================ image bundle sames file bundler===================================
|
||||
npm install --save-dev img-loader url-loader
|
||||
|
||||
{
|
||||
test: /\.(png|jpg|gif)$/,
|
||||
loaders: [
|
||||
{
|
||||
loader: 'url-loader',
|
||||
options: {
|
||||
limit: 10000,
|
||||
name: 'images/[name].[ext]'
|
||||
}
|
||||
},
|
||||
'img-loader'
|
||||
],
|
||||
},
|
||||
|
||||
|
||||
npm install --save-dev file-loader
|
||||
|
||||
|
||||
|
||||
==============================================================================================================
|
||||
|
||||
|
||||
|
||||
tutorial: https://52north.github.io/helgoland-toolbox/additional-documentation/how-tos/integrate-a-map-component.html
|
||||
|
||||
|
||||
npm install --save @helgoland/core
|
||||
npm install --save @helgoland/map
|
||||
npm install --save @helgoland/selector
|
||||
npm install --save @helgoland/depiction
|
||||
npm install --save @angular/forms
|
||||
|
||||
|
||||
Install dependencies
|
||||
|
||||
npm i @ngx-translate/http-loader
|
||||
4655
package-lock.json
generated
4655
package-lock.json
generated
File diff suppressed because it is too large
Load diff
14
package.json
14
package.json
|
|
@ -27,19 +27,31 @@
|
|||
"babel-loader": "^8.2.2",
|
||||
"css-loader": "^6.2.0",
|
||||
"dotenv": "^10.0.0",
|
||||
"file-loader": "^6.2.0",
|
||||
"html-loader": "^2.1.2",
|
||||
"img-loader": "^4.0.0",
|
||||
"mini-css-extract-plugin": "^2.1.0",
|
||||
"raw-loader": "^4.0.2",
|
||||
"style-loader": "^3.2.1",
|
||||
"terser-webpack-plugin": "^5.1.4",
|
||||
"url-loader": "^4.1.1",
|
||||
"webpack": "^5.47.0",
|
||||
"webpack-cli": "^4.7.2",
|
||||
"webpack-dev-server": "^3.11.2"
|
||||
},
|
||||
"dependencies": {
|
||||
"@angular/core": "^12.1.4",
|
||||
"@angular/forms": "^12.1.4",
|
||||
"@angular/platform-browser": "^12.1.4",
|
||||
"@angular/platform-browser-dynamic": "^12.1.4",
|
||||
"leaflet": "^1.7.1"
|
||||
"@helgoland/core": "^12.0.0-beta.1",
|
||||
"@helgoland/depiction": "^12.0.0-beta.1",
|
||||
"@helgoland/map": "^12.0.0-beta.1",
|
||||
"@helgoland/selector": "^12.0.0-beta.1",
|
||||
"@ngx-translate/http-loader": "^6.0.0",
|
||||
"babel-plugin-transform-typescript-metadata": "^0.3.2",
|
||||
"core-js": "^3.16.0",
|
||||
"leaflet": "^1.7.1",
|
||||
"zone.js": "^0.11.4"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
<app-map></app-map>
|
||||
<!-- <span>{{ name }} app is running!</span> -->
|
||||
|
||||
|
||||
<app-map></app-map>
|
||||
<!-- <span>{{ name }} app is running!</span> -->
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- <div>
|
||||
<n52-station-map-selector [mapId]="'timeseries'" [serviceUrl]="providerUrl"
|
||||
[mapOptions]="mapOptions"></n52-station-map-selector>
|
||||
</div>
|
||||
<div>Is loading: {{loadingStations}}</div> -->
|
||||
|
|
@ -1,6 +1,22 @@
|
|||
import { Component, VERSION } from "@angular/core";
|
||||
import '../styles.css';
|
||||
import '../../node_modules/leaflet/dist/leaflet.css';
|
||||
// import '../../node_modules/leaflet/dist/leaflet.css';
|
||||
|
||||
import { ParameterFilter, Phenomenon, Station } from '@helgoland/core';
|
||||
import { GeoSearchOptions, LayerOptions } from '@helgoland/map';
|
||||
import * as L from 'leaflet';
|
||||
// optional, to adapt leaflet markers
|
||||
L.Marker.prototype.options.icon = L.icon({
|
||||
iconRetinaUrl: 'assets/img/marker-icon-2x.png',
|
||||
iconUrl: 'assets/img/marker-icon.png',
|
||||
shadowUrl: 'assets/img/marker-shadow.png',
|
||||
iconSize: [25, 41],
|
||||
iconAnchor: [12, 41],
|
||||
popupAnchor: [1, -34],
|
||||
tooltipAnchor: [16, -28],
|
||||
shadowSize: [41, 41]
|
||||
});
|
||||
|
||||
|
||||
@Component({
|
||||
selector: "app-component",
|
||||
|
|
@ -15,8 +31,29 @@ import '../../node_modules/leaflet/dist/leaflet.css';
|
|||
// styleUrls: ['./app.component.css']
|
||||
})
|
||||
export class AppComponent {
|
||||
constructor() {}
|
||||
|
||||
private name = 'Angular test ' + VERSION.major;
|
||||
constructor() { }
|
||||
|
||||
name = 'Angular test ' + VERSION.major;
|
||||
x: number = 123;
|
||||
|
||||
public providerUrl = 'https://geo.irceline.be/sos/api/v1/';
|
||||
|
||||
public fitBounds: L.LatLngBoundsExpression = [[49.5, 3.27], [51.5, 5.67]];
|
||||
// public zoomControlOptions: L.Control.ZoomOptions = { position: 'topleft' };
|
||||
public avoidZoomToSelection = false;
|
||||
public baseMaps: Map<string, LayerOptions> = new Map<string, LayerOptions>();
|
||||
public overlayMaps: Map<string, LayerOptions> = new Map<string, LayerOptions>();
|
||||
public layerControlOptions: L.Control.LayersOptions = { position: 'bottomleft' };
|
||||
public cluster = false;
|
||||
public loadingStations: boolean;
|
||||
public stationFilter: ParameterFilter = {
|
||||
// phenomenon: '8'
|
||||
};
|
||||
public statusIntervals = false;
|
||||
public mapOptions: L.MapOptions = { dragging: true, zoomControl: false };
|
||||
|
||||
public onStationSelected(station: Station) {
|
||||
console.log('Clicked station: ' + station.properties.label);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,12 +4,40 @@ import { BrowserModule } from "@angular/platform-browser";
|
|||
import { AppComponent } from './app.component';
|
||||
import { MapComponent } from './map/map.component';
|
||||
|
||||
import { HttpClientModule } from '@angular/common/http'; //for http requests
|
||||
// import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
|
||||
// import { TranslateHttpLoader } from '@ngx-translate/http-loader';
|
||||
import { MarkerService } from './marker.service';
|
||||
|
||||
// siehe https://52north.github.io/helgoland-toolbox/additional-documentation/how-tos/integrate-a-map-component.html
|
||||
// https://52north.github.io/helgoland-toolbox/components/LocateControlComponent.html#source
|
||||
// import { HelgolandMapControlModule, HelgolandMapSelectorModule } from '@helgoland/map';
|
||||
// import { HelgolandSelectorModule } from '@helgoland/selector';
|
||||
// import { HelgolandDatasetlistModule } from '@helgoland/depiction';
|
||||
// import { DatasetApiInterface, SplittedDataDatasetApiInterface } from '@helgoland/core';
|
||||
|
||||
// import 'core-js';
|
||||
|
||||
@NgModule({
|
||||
// declarations: The components, directives, and pipes that belong to this NgModule.
|
||||
declarations: [AppComponent, MapComponent],
|
||||
// imports: Other modules whose exported classes are needed by component templates declared in this NgModule.
|
||||
imports: [BrowserModule],
|
||||
providers: [],
|
||||
imports: [BrowserModule, HttpClientModule],
|
||||
// TranslateModule.forRoot({
|
||||
// loader: {
|
||||
// provide: TranslateLoader,
|
||||
// useFactory: HttpLoaderFactory,
|
||||
// deps: [HttpClient]
|
||||
// }
|
||||
// }),
|
||||
// HelgolandSelectorModule, HelgolandMapControlModule, HelgolandMapSelectorModule, HelgolandDatasetlistModule],
|
||||
providers: [
|
||||
MarkerService,
|
||||
// {
|
||||
// provide: DatasetApiInterface,
|
||||
// useClass: SplittedDataDatasetApiInterface
|
||||
// }
|
||||
],
|
||||
// bootstrap: The main application view, called the root component, which hosts all other application views.
|
||||
// Only the root NgModule should set the bootstrap property.
|
||||
bootstrap: [AppComponent],
|
||||
|
|
@ -18,4 +46,8 @@ import { MapComponent } from './map/map.component';
|
|||
constructor() {}
|
||||
}
|
||||
|
||||
// export function HttpLoaderFactory(http: HttpClient) {
|
||||
// return new TranslateHttpLoader(http);
|
||||
// }
|
||||
|
||||
// https://medium.com/@hubert.zub/using-babel-7-and-preset-typescript-to-compile-angular-6-app-448eb1880f2c
|
||||
|
|
@ -1,23 +1,46 @@
|
|||
import { Component, AfterViewInit } from '@angular/core';
|
||||
import * as L from 'leaflet';
|
||||
import { MarkerService } from '../marker.service';
|
||||
|
||||
// const iconRetinaUrl = 'assets/marker-icon-2x.png';
|
||||
// const iconUrl = 'assets/marker-icon.png';
|
||||
// const shadowUrl = 'assets/marker-shadow.png';
|
||||
// const iconDefault = L.icon({
|
||||
// iconRetinaUrl,
|
||||
// iconUrl,
|
||||
// shadowUrl,
|
||||
// iconSize: [25, 41],
|
||||
// iconAnchor: [12, 41],
|
||||
// popupAnchor: [1, -34],
|
||||
// tooltipAnchor: [16, -28],
|
||||
// shadowSize: [41, 41]
|
||||
// });
|
||||
// L.Marker.prototype.options.icon = iconDefault;
|
||||
|
||||
@Component({
|
||||
selector: 'app-map',
|
||||
templateUrl: './map.component.html',
|
||||
styleUrls: ['./map.component.css']
|
||||
styleUrls: ['./map.component.css'],
|
||||
// providers: [MarkerService]
|
||||
})
|
||||
export class MapComponent implements AfterViewInit {
|
||||
|
||||
// https://52north.github.io/helgoland-toolbox/classes/CachedMapComponent.html#source
|
||||
private map;
|
||||
// markerService: MarkerService
|
||||
|
||||
constructor() { }
|
||||
// constructor() { }
|
||||
constructor(private markerService: MarkerService) { }
|
||||
// constructor(markerService: MarkerService) {
|
||||
// this.markerService = markerService;
|
||||
// }
|
||||
|
||||
private initMap(): void {
|
||||
this.map = L.map('map', {
|
||||
center: [ 48.208174, 16.373819],
|
||||
zoom: 3
|
||||
});
|
||||
const tiles = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
||||
let tiles = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
||||
maxZoom: 18,
|
||||
minZoom: 3,
|
||||
attribution: '© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
|
||||
|
|
@ -28,6 +51,8 @@ export class MapComponent implements AfterViewInit {
|
|||
|
||||
ngAfterViewInit(): void {
|
||||
this.initMap();
|
||||
// this.markerService.makeCapitalMarkers(this.map);
|
||||
this.markerService.makeCapitalCircleMarkers(this.map);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
53
src/app/marker.service.ts
Normal file
53
src/app/marker.service.ts
Normal file
|
|
@ -0,0 +1,53 @@
|
|||
import { Injectable } from '@angular/core';
|
||||
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
import * as L from 'leaflet';
|
||||
|
||||
// @Injectable({
|
||||
// // declares that this service should be created
|
||||
// // by the root application injector.
|
||||
// providedIn: 'root'
|
||||
// })
|
||||
@Injectable()
|
||||
export class MarkerService {
|
||||
|
||||
private capitalsUrl: string = 'https://raw.githubusercontent.com/do-community/angular-leaflet-example/master/src/assets/data/usa-capitals.geojson';
|
||||
|
||||
constructor(private http: HttpClient) {
|
||||
// this.http = http;
|
||||
}
|
||||
|
||||
static scaledRadius(val: number, maxVal: number): number {
|
||||
return 20 * (val / maxVal);
|
||||
}
|
||||
|
||||
// makeCapitalMarkers(map: L.map): void {
|
||||
// this.http.get(this.capitalsUrl).subscribe((res: any) => {
|
||||
// for (const c of res.features) {
|
||||
// const lon = c.geometry.coordinates[0];
|
||||
// const lat = c.geometry.coordinates[1];
|
||||
// const marker = new L.marker([lat, lon]);
|
||||
|
||||
// marker.addTo(map);
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
|
||||
makeCapitalCircleMarkers(map: L.Map): void {
|
||||
this.http.get(this.capitalsUrl).subscribe((res: any) => {
|
||||
|
||||
let maxPop = Math.max(...res.features.map(x => x.properties.population), 0);
|
||||
|
||||
for (const c of res.features) {
|
||||
const lon = c.geometry.coordinates[0];
|
||||
const lat = c.geometry.coordinates[1];
|
||||
// const circle = L.circleMarker([lat, lon]);
|
||||
let circle = L.circleMarker([lat, lon], {
|
||||
radius: MarkerService.scaledRadius(c.properties.population, maxPop)
|
||||
});
|
||||
circle.addTo(map);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
755
src/assets/data/usa-capitals.geojson
Normal file
755
src/assets/data/usa-capitals.geojson
Normal file
|
|
@ -0,0 +1,755 @@
|
|||
{
|
||||
"type": "FeatureCollection",
|
||||
"features": [
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-86.279118,
|
||||
32.361538
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Alabama",
|
||||
"name": "Montgomery",
|
||||
"population": 199518
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-134.41974,
|
||||
58.301935
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Alaska",
|
||||
"name": "Juneau",
|
||||
"population": 32094
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-112.073844,
|
||||
33.448457
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Arizona",
|
||||
"name": "Phoenix",
|
||||
"population": 1626078
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-92.331122,
|
||||
34.736009
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Arkansas",
|
||||
"name": "Little Rock",
|
||||
"population": 198606
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-121.468926,
|
||||
38.555605
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "California",
|
||||
"name": "Sacramento",
|
||||
"population": 501901
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-104.984167,
|
||||
39.7391667
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Colorado",
|
||||
"name": "Denver",
|
||||
"population": 704621
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-72.677,
|
||||
41.767
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Connecticut",
|
||||
"name": "Hartford",
|
||||
"population": 123400
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-75.526755,
|
||||
39.161921
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Delaware",
|
||||
"name": "Dover",
|
||||
"population": 37538
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-84.27277,
|
||||
30.4518
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Florida",
|
||||
"name": "Tallahassee",
|
||||
"population": 191049
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-84.39,
|
||||
33.76
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Georgia",
|
||||
"name": "Atlanta",
|
||||
"population": 486290
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-157.826182,
|
||||
21.30895
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Hawaii",
|
||||
"name": "Honolulu",
|
||||
"population": 350395
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-116.237651,
|
||||
43.613739
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Idaho",
|
||||
"name": "Boise",
|
||||
"population": 226570
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-89.650373,
|
||||
39.78325
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Illinois",
|
||||
"name": "Springfield",
|
||||
"population": 114868
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-86.147685,
|
||||
39.790942
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Indiana",
|
||||
"name": "Indianapolis",
|
||||
"population": 863002
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-93.620866,
|
||||
41.590939
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Iowa",
|
||||
"name": "Des Moines",
|
||||
"population": 217521
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-95.69,
|
||||
39.04
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Kansas",
|
||||
"name": "Topeka",
|
||||
"population": 126587
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-84.86311,
|
||||
38.197274
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Kentucky",
|
||||
"name": "Frankfort",
|
||||
"population": 27621
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-91.140229,
|
||||
30.45809
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Louisiana",
|
||||
"name": "Baton Rouge",
|
||||
"population": 225374
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-69.765261,
|
||||
44.323535
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Maine",
|
||||
"name": "Augusta",
|
||||
"population": 18594
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-76.501157,
|
||||
38.972945
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Maryland",
|
||||
"name": "Annapolis",
|
||||
"population": 39321
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-71.0275,
|
||||
42.2352
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Massachusetts",
|
||||
"name": "Boston",
|
||||
"population": 685094
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-84.5467,
|
||||
42.7335
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Michigan",
|
||||
"name": "Lansing",
|
||||
"population": 116986
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-93.094,
|
||||
44.95
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Minnesota",
|
||||
"name": "Saint Paul",
|
||||
"population": 306621
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-90.207,
|
||||
32.32
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Mississippi",
|
||||
"name": "Jackson",
|
||||
"population": 166965
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-92.189283,
|
||||
38.572954
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Missouri",
|
||||
"name": "Jefferson City",
|
||||
"population": 42895
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-112.027031,
|
||||
46.595805
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Montana",
|
||||
"name": "Helana",
|
||||
"population": 31429
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-96.675345,
|
||||
40.809868
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Nebraska",
|
||||
"name": "Lincoln",
|
||||
"population": 284736
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-119.753877,
|
||||
39.160949
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Nevada",
|
||||
"name": "Carson City",
|
||||
"population": 54745
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-71.549127,
|
||||
43.220093
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "New Hampshire",
|
||||
"name": "Concord",
|
||||
"population": 43019
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-74.756138,
|
||||
40.221741
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "New Jersey",
|
||||
"name": "Trenton",
|
||||
"population": 84964
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-105.964575,
|
||||
35.667231
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "New Mexico",
|
||||
"name": "Santa Fe",
|
||||
"population": 83776
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-73.781339,
|
||||
42.659829
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "New York",
|
||||
"name": "Albany",
|
||||
"population": 98251
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-78.638,
|
||||
35.771
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "North Carolina",
|
||||
"name": "Raleigh",
|
||||
"population": 464758
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-100.7837,
|
||||
46.8083
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "North Dakota",
|
||||
"name": "Bismarck",
|
||||
"population": 72865
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-83.000647,
|
||||
39.962245
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Ohio",
|
||||
"name": "Columbus",
|
||||
"population": 879170
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-97.534994,
|
||||
35.482309
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Oklahoma",
|
||||
"name": "Oklahoma City",
|
||||
"population": 643648
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-123.029159,
|
||||
44.931109
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Oregon",
|
||||
"name": "Salem",
|
||||
"population": 169798
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-76.875613,
|
||||
40.269789
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Pennsylvania",
|
||||
"name": "Harrisburg",
|
||||
"population": 49192
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-71.422132,
|
||||
41.82355
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Rhode Island",
|
||||
"name": "Providence",
|
||||
"population": 180393
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-81.035,
|
||||
34
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "South Carolina",
|
||||
"name": "Columbia",
|
||||
"population": 133114
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-100.336378,
|
||||
44.367966
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "South Dakota",
|
||||
"name": "Pierre",
|
||||
"population": 14004
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-86.784,
|
||||
36.165
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Tennessee",
|
||||
"name": "Nashville",
|
||||
"population": 667560
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-97.75,
|
||||
30.266667
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Texas",
|
||||
"name": "Austin",
|
||||
"population": 950715
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-111.892622,
|
||||
40.7547
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Utah",
|
||||
"name": "Salt Lake City",
|
||||
"population": 200544
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-72.57194,
|
||||
44.26639
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Vermont",
|
||||
"name": "Montpelier",
|
||||
"population": 7484
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-77.46,
|
||||
37.54
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Virginia",
|
||||
"name": "Richmond",
|
||||
"population": 227032
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-122.893077,
|
||||
47.042418
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Washington",
|
||||
"name": "Olympia",
|
||||
"population": 51609
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-81.633294,
|
||||
38.349497
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "West Virginia",
|
||||
"name": "Charleston",
|
||||
"population": 47929
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-89.384444,
|
||||
43.074722
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Wisconsin",
|
||||
"name": "Madison",
|
||||
"population": 255214
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Feature",
|
||||
"geometry": {
|
||||
"type": "Point",
|
||||
"coordinates": [
|
||||
-104.802042,
|
||||
41.145548
|
||||
]
|
||||
},
|
||||
"properties": {
|
||||
"state": "Wyoming",
|
||||
"name": "Cheyenne",
|
||||
"population": 63624
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
BIN
src/favicon.ico
Normal file
BIN
src/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
|
|
@ -1,6 +1,9 @@
|
|||
// import 'zone.js';
|
||||
import './polyfills';
|
||||
|
||||
// import 'core-js/es/reflect';
|
||||
// require('zone.js/dist/zone');
|
||||
|
||||
import { enableProdMode } from '@angular/core';
|
||||
import { platformBrowserDynamic } from "@angular/platform-browser-dynamic";
|
||||
|
||||
|
|
|
|||
|
|
@ -54,6 +54,7 @@
|
|||
*
|
||||
*/
|
||||
|
||||
|
||||
/***************************************************************************************************
|
||||
* Zone JS is required by default for Angular itself.
|
||||
*/
|
||||
|
|
@ -63,3 +64,4 @@ import 'zone.js'; // Included with Angular CLI.
|
|||
/***************************************************************************************************
|
||||
* APPLICATION IMPORTS
|
||||
*/
|
||||
import 'core-js/proposals/reflect-metadata';
|
||||
|
|
@ -1,3 +1,4 @@
|
|||
/* You can add global styles to this file, and also import other style files */
|
||||
/* @import '../node_modules/leaflet/dist/leaflet.css'; */
|
||||
@import '~leaflet/dist/leaflet.css';
|
||||
|
||||
|
|
|
|||
|
|
@ -31,6 +31,7 @@ module.exports = {
|
|||
filename: '[name].' + fileNamePrefix + 'js',
|
||||
//filename: fileNamePrefix + '[name].js', // css loader will process all @import and url() with help of require()
|
||||
publicPath: '/dist/',
|
||||
// sourceMapFilename: "[name].js.map"
|
||||
},
|
||||
devServer: {
|
||||
contentBase: path.resolve(__dirname),
|
||||
|
|
@ -40,8 +41,43 @@ module.exports = {
|
|||
port: 8080,
|
||||
open: true,
|
||||
},
|
||||
|
||||
// resolve: {
|
||||
// alias: {
|
||||
// "./images/layers.png$": path.resolve(
|
||||
// __dirname,
|
||||
// "./node_modules/leaflet/dist/images/layers.png"
|
||||
// ),
|
||||
// "./images/layers-2x.png$": path.resolve(
|
||||
// __dirname,
|
||||
// "./node_modules/leaflet/dist/images/layers-2x.png"
|
||||
// ),
|
||||
// "./images/marker-icon.png$": path.resolve(
|
||||
// __dirname,
|
||||
// "./node_modules/leaflet/dist/images/marker-icon.png"
|
||||
// ),
|
||||
// "./images/marker-icon-2x.png$": path.resolve(
|
||||
// __dirname,
|
||||
// "./node_modules/leaflet/dist/images/marker-icon-2x.png"
|
||||
// ),
|
||||
// "./images/marker-shadow.png$": path.resolve(
|
||||
// __dirname,
|
||||
// "./node_modules/leaflet/dist/images/marker-shadow.png"
|
||||
// )
|
||||
// }
|
||||
// },
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.(png|svg|jpg|gif)$/,
|
||||
use: [{
|
||||
loader: 'file-loader',
|
||||
options: {
|
||||
name:'[name].[ext]',
|
||||
outputPath:'./assets/'
|
||||
}
|
||||
}]
|
||||
},
|
||||
|
||||
{
|
||||
// test: /\.js$/,
|
||||
|
|
@ -142,7 +178,7 @@ module.exports = {
|
|||
resolve: {
|
||||
extensions: ['*', '.js', '.jsx', '.tsx', '.ts'],
|
||||
},
|
||||
// devtool: 'inline-source-map',
|
||||
devtool: 'inline-source-map',
|
||||
stats: {
|
||||
colors: true
|
||||
},
|
||||
|
|
@ -182,11 +218,11 @@ module.exports = {
|
|||
chunkFilename: '[chunkhash].css',
|
||||
}),
|
||||
|
||||
new webpack.LoaderOptionsPlugin({
|
||||
htmlLoader: {
|
||||
minimize: false
|
||||
}
|
||||
})
|
||||
// new webpack.LoaderOptionsPlugin({
|
||||
// htmlLoader: {
|
||||
// minimize: false
|
||||
// }
|
||||
// })
|
||||
]
|
||||
};
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue