|
|
@@ -1,29 +1,17 @@
|
|
|
import {Component} from '@angular/core';
|
|
|
|
|
|
-import proj4 from 'proj4';
|
|
|
-import {GeoJSON} from 'ol/format';
|
|
|
-import {OSM, TileWMS, Vector as VectorSource} from 'ol/source';
|
|
|
-import {Tile, Vector as VectorLayer} from 'ol/layer';
|
|
|
-import {View} from 'ol';
|
|
|
-import {bbox as bboxStrategy} from 'ol/loadingstrategy';
|
|
|
-import {get as getProjection, transform} from 'ol/proj';
|
|
|
-import {register} from 'ol/proj/proj4';
|
|
|
+import {
|
|
|
+ HsConfig,
|
|
|
+ HsEventBusService,
|
|
|
+ HsLanguageService,
|
|
|
+ HsLayoutService,
|
|
|
+ HsPanelContainerService,
|
|
|
+ HsSidebarService,
|
|
|
+ HsToastService,
|
|
|
+} from 'hslayers-ng';
|
|
|
|
|
|
-import {HsConfig, HsEventBusService, HsToastService} from 'hslayers-ng';
|
|
|
-
|
|
|
-import i18n from './translations.json';
|
|
|
import {AppService} from './app.service';
|
|
|
-import {FieldService} from './calculator/field.service';
|
|
|
-
|
|
|
-proj4.defs(
|
|
|
- 'EPSG:3045',
|
|
|
- '+proj=utm +zone=33 +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs'
|
|
|
-);
|
|
|
-proj4.defs(
|
|
|
- 'EPSG:5514',
|
|
|
- '+proj=krovak +lat_0=49.5 +lon_0=24.83333333333333 +alpha=30.28813972222222 +k=0.9999 +x_0=0 +y_0=0 +ellps=bessel +towgs84=542.5,89.2,456.9,5.517,2.275,5.516,6.96 +units=m +no_defs'
|
|
|
-);
|
|
|
-register(proj4);
|
|
|
+import {CalculatorComponent} from './calculator/calculator.component';
|
|
|
|
|
|
@Component({
|
|
|
selector: 'application-root',
|
|
|
@@ -31,169 +19,39 @@ register(proj4);
|
|
|
styleUrls: ['./app.component.sass'],
|
|
|
})
|
|
|
export class AppComponent {
|
|
|
- sjtskProjection = getProjection('EPSG:5514');
|
|
|
/* You can name your app as you like or not at all */
|
|
|
title = 'hslayers-application';
|
|
|
constructor(
|
|
|
private appService: AppService,
|
|
|
- private fieldService: FieldService,
|
|
|
/* Inject here all modules from HSLayers-NG which you intend to use */
|
|
|
public hsConfig: HsConfig,
|
|
|
- private hsEventBusService: HsEventBusService,
|
|
|
+ private hsEventBus: HsEventBusService,
|
|
|
+ private hsLanguageService: HsLanguageService,
|
|
|
+ private hsLayoutService: HsLayoutService,
|
|
|
+ public hsPanelContainerService: HsPanelContainerService,
|
|
|
+ public hsSidebarService: HsSidebarService,
|
|
|
private hsToastService: HsToastService
|
|
|
) {
|
|
|
- /* Define the polygon's style using SLD */
|
|
|
- const fieldSld = `<?xml version="1.0" encoding="ISO-8859-1"?>
|
|
|
- <StyledLayerDescriptor version="1.0.0"
|
|
|
- xsi:schemaLocation="http://www.opengis.net/sld StyledLayerDescriptor.xsd"
|
|
|
- xmlns="http://www.opengis.net/sld"
|
|
|
- xmlns:ogc="http://www.opengis.net/ogc"
|
|
|
- xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
|
- xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
|
|
|
- <NamedLayer>
|
|
|
- <Name>Simple point with stroke</Name>
|
|
|
- <UserStyle>
|
|
|
- <Title>Default</Title>
|
|
|
- <FeatureTypeStyle>
|
|
|
- <Rule>
|
|
|
- <PolygonSymbolizer>
|
|
|
- <Fill>
|
|
|
- <CssParameter name="fill">#ffffff</CssParameter>
|
|
|
- <CssParameter name="fill-opacity">0.7</CssParameter>
|
|
|
- </Fill>
|
|
|
- <Stroke>
|
|
|
- <CssParameter name="stroke">#33cccc</CssParameter>
|
|
|
- <CssParameter name="stroke-opacity">1</CssParameter>
|
|
|
- <CssParameter name="stroke-width">2.0</CssParameter>
|
|
|
- </Stroke>
|
|
|
- </PolygonSymbolizer>
|
|
|
- </Rule>
|
|
|
- </FeatureTypeStyle>
|
|
|
- </UserStyle>
|
|
|
- </NamedLayer>
|
|
|
- </StyledLayerDescriptor>
|
|
|
- `;
|
|
|
- const lpisSource = new VectorSource({
|
|
|
- format: new GeoJSON({
|
|
|
- dataProjection: 'EPSG:5514',
|
|
|
- }),
|
|
|
- url: (extent) => {
|
|
|
- const kulturaKod = 1; // Doesn't seem to work
|
|
|
- // eslint-disable-next-line prettier/prettier
|
|
|
- return 'http://localhost:8085/https://gis.lesprojekt.cz/cgi-bin/mapserv?map=/home/dima/maps/foodie/lpis.map' +
|
|
|
- '&service=WFS' +
|
|
|
- '&VERSION=1.1.0' +
|
|
|
- '&REQUEST=GetFeature' +
|
|
|
- '&TYPENAME=lpis_cultures' +
|
|
|
- '&COUNT=100' +
|
|
|
- '&outputformat=geojson' +
|
|
|
- '&SRSNAME=EPSG:5514' +
|
|
|
- `&BBOX=${extent.join(',')}` +
|
|
|
- // eslint-disable-next-line prettier/prettier
|
|
|
- `&<ogc:Filter xmlns:ogc="http://www.opengis.net/ogc"><ogc:PropertyIsEqualTo><ogc:PropertyName>kulturakod</ogc:PropertyName><ogc:Literal>${kulturaKod}</ogc:Literal></ogc:PropertyIsEqualTo></ogc:Filter>`;
|
|
|
- //%3Cgml:Box%3E%3Cgml:coordinates%3E${
|
|
|
- //extent.join(',')
|
|
|
- //}%3C/gml:coordinates%3E%3C/gml:Box%3E%3C/ogc:Filter%3E`;
|
|
|
- },
|
|
|
- strategy: bboxStrategy,
|
|
|
+ /* Create new button in the sidebar */
|
|
|
+ this.hsSidebarService.buttons.push({
|
|
|
+ panel: 'calculator',
|
|
|
+ module: 'calculator',
|
|
|
+ order: 0,
|
|
|
+ title: 'Field Calculator', //() =>
|
|
|
+ //this.hsLanguageService.getTranslation('ADJUSTER.adjustFactors'),
|
|
|
+ description: 'Adjust factors for computation',
|
|
|
+ icon: 'icon-analytics-piechart',
|
|
|
});
|
|
|
- /* Define and update the HsConfig configuration object */
|
|
|
- this.hsConfig.update({
|
|
|
- datasources: [
|
|
|
- /* You need to set up Layman in order to use it. See https://github.com/LayerManager/layman */
|
|
|
- /*{
|
|
|
- title: 'Layman',
|
|
|
- url: 'http://localhost:8087',
|
|
|
- user: 'anonymous',
|
|
|
- type: 'layman',
|
|
|
- liferayProtocol: 'https',
|
|
|
- },*/
|
|
|
- {
|
|
|
- title: 'Micka',
|
|
|
- url: 'https://hub.sieusoil.eu/cat/csw',
|
|
|
- language: 'eng',
|
|
|
- type: 'micka',
|
|
|
- },
|
|
|
- ],
|
|
|
- default_view: new View({
|
|
|
- projection: this.sjtskProjection,
|
|
|
- center: transform([16.964, 49.248], 'EPSG:4326', 'EPSG:5514'),
|
|
|
- zoom: 14,
|
|
|
- }),
|
|
|
- /* Use hslayers-server if you need to proxify your requests to other services. See https://www.npmjs.com/package/hslayers-server */
|
|
|
- proxyPrefix: window.location.hostname.includes('localhost')
|
|
|
- ? `${window.location.protocol}//${window.location.hostname}:8085/`
|
|
|
- : '/proxy/',
|
|
|
- useProxy: window.location.hostname.includes('localhost') ? true : false,
|
|
|
- panelsEnabled: {
|
|
|
- composition_browser: false,
|
|
|
- info: false,
|
|
|
- saveMap: false,
|
|
|
- legend: false,
|
|
|
- tripPlanner: false,
|
|
|
- },
|
|
|
- componentsEnabled: {
|
|
|
- basemapGallery: true,
|
|
|
- },
|
|
|
- assetsPath: 'assets',
|
|
|
- symbolizerIcons: [
|
|
|
- {name: 'beach', url: '/assets/icons/beach17.svg'},
|
|
|
- {name: 'bicycles', url: '/assets/icons/bicycles.svg'},
|
|
|
- {name: 'coffee-shop', url: '/assets/icons/coffee-shop1.svg'},
|
|
|
- {name: 'mountain', url: '/assets/icons/mountain42.svg'},
|
|
|
- {name: 'warning', url: '/assets/icons/warning.svg'},
|
|
|
- ],
|
|
|
- popUpDisplay: 'none',
|
|
|
- default_layers: [
|
|
|
- /* Baselayers */
|
|
|
- new Tile({
|
|
|
- source: new OSM(),
|
|
|
- visible: true,
|
|
|
- properties: {
|
|
|
- title: 'OpenStreetMap',
|
|
|
- base: true,
|
|
|
- removable: false,
|
|
|
- },
|
|
|
- }),
|
|
|
- new Tile({
|
|
|
- properties: {
|
|
|
- title: 'Ortofoto ČÚZK',
|
|
|
- base: true,
|
|
|
- removable: false,
|
|
|
- thumbnail: 'https://www.agrihub.sk/hsl-ng/img/orto.jpg',
|
|
|
- },
|
|
|
- source: new TileWMS({
|
|
|
- url: 'https://geoportal.cuzk.cz/WMS_ORTOFOTO_PUB/WMService.aspx',
|
|
|
- params: {
|
|
|
- LAYERS: 'GR_ORTFOTORGB',
|
|
|
- },
|
|
|
- attributions: [
|
|
|
- '© <a href="geoportal.cuzk.cz" target="_blank">ČÚZK</a>',
|
|
|
- ],
|
|
|
- }),
|
|
|
- visible: false,
|
|
|
- }),
|
|
|
- /* Thematic layers */
|
|
|
- new VectorLayer({
|
|
|
- properties: {
|
|
|
- title: 'LPIS',
|
|
|
- synchronize: false,
|
|
|
- cluster: false,
|
|
|
- inlineLegend: true,
|
|
|
- editor: {
|
|
|
- editable: false,
|
|
|
- },
|
|
|
- sld: fieldSld,
|
|
|
- //path: 'User generated',
|
|
|
- },
|
|
|
- opacity: 0.7,
|
|
|
- source: lpisSource,
|
|
|
- }),
|
|
|
- ],
|
|
|
- translationOverrides: i18n,
|
|
|
+ /* Create new panel itself */
|
|
|
+ this.hsPanelContainerService.create(CalculatorComponent, {});
|
|
|
+ /* Switch language to cs */
|
|
|
+ this.hsEventBus.layoutLoads.subscribe(() => {
|
|
|
+ this.hsLanguageService.setLanguage('cs');
|
|
|
+ this.hsLayoutService.setDefaultPanel('calculator');
|
|
|
});
|
|
|
/* Now wait for the OpenLayers Map object to load */
|
|
|
- this.hsEventBusService.olMapLoads.subscribe(() => {
|
|
|
+ //TODO: Wait for the LPIS layer instead
|
|
|
+ this.hsEventBus.olMapLoads.subscribe(() => {
|
|
|
/* ...and display a simple toast message in the bottom-left corner */
|
|
|
this.hsToastService.createToastPopupMessage(
|
|
|
'READY!',
|
