diff --git a/packages/context/src/lib/context-manager/context-item/context-item.component.html b/packages/context/src/lib/context-manager/context-item/context-item.component.html
index 46e99a06a3..c97b0c8940 100644
--- a/packages/context/src/lib/context-manager/context-item/context-item.component.html
+++ b/packages/context/src/lib/context-manager/context-item/context-item.component.html
@@ -16,16 +16,13 @@
[color]="default ? 'primary' : 'default'"
(click)="favoriteClick(context)"
>
- {{
+ context.icon
+ ? context.icon
+ : context.scope === 'public'
+ ? 'public'
+ : 'star'
+ }}
![]()
{{ context.title }}
@@ -62,7 +59,7 @@
[color]="color"
(click)="save.emit(context)"
>
- save
@@ -163,7 +152,7 @@
[collapsed]="collapsed"
(click)="collapsed = !collapsed"
>
- more_horiz
diff --git a/packages/context/src/lib/context-manager/context-list/context-list.component.html b/packages/context/src/lib/context-manager/context-list/context-list.component.html
index 39b51b3092..62c182a276 100644
--- a/packages/context/src/lib/context-manager/context-list/context-list.component.html
+++ b/packages/context/src/lib/context-manager/context-list/context-list.component.html
@@ -21,35 +21,22 @@
color="warn"
(click)="clearFilter()"
>
-
-
- fitler_alt
diff --git a/packages/context/src/lib/context-manager/context-list/context-list.component.scss b/packages/context/src/lib/context-manager/context-list/context-list.component.scss
index ef17bd3b9d..4a3a9e0f0c 100644
--- a/packages/context/src/lib/context-manager/context-list/context-list.component.scss
+++ b/packages/context/src/lib/context-manager/context-list/context-list.component.scss
@@ -14,6 +14,12 @@
}
}
+.sort-alpha {
+ &.--active mat-icon {
+ color: red;
+ }
+}
+
.context-filter-min-width {
width: calc(100% - 135px);
margin: 5px;
diff --git a/packages/context/src/lib/context-manager/context-list/context-list.component.ts b/packages/context/src/lib/context-manager/context-list/context-list.component.ts
index c79ae5fb7d..7dd738dac4 100644
--- a/packages/context/src/lib/context-manager/context-list/context-list.component.ts
+++ b/packages/context/src/lib/context-manager/context-list/context-list.component.ts
@@ -206,7 +206,7 @@ export class ContextListComponent implements OnInit, OnDestroy {
title: this.languageService.translate.instant(
'igo.context.contextManager.emptyContext'
),
- icon: 'map-outline',
+ icon: 'star',
tooltip: this.languageService.translate.instant(
'igo.context.contextManager.emptyContextTooltip'
),
@@ -219,7 +219,7 @@ export class ContextListComponent implements OnInit, OnDestroy {
title: this.languageService.translate.instant(
'igo.context.contextManager.contextMap'
),
- icon: 'map-check',
+ icon: 'map',
tooltip: this.languageService.translate.instant(
'igo.context.contextManager.contextMapTooltip'
),
@@ -364,8 +364,8 @@ export class ContextListComponent implements OnInit, OnDestroy {
.toLowerCase();
}
- toggleSort(sortAlpha: boolean) {
- this.sortedAlpha = sortAlpha;
+ toggleSort() {
+ this.sortedAlpha = !this.sortedAlpha;
}
clearFilter() {
diff --git a/packages/context/src/lib/context-manager/context-permissions/context-permissions.component.html b/packages/context/src/lib/context-manager/context-permissions/context-permissions.component.html
index 19c8a9e179..b1db0521fb 100644
--- a/packages/context/src/lib/context-manager/context-permissions/context-permissions.component.html
+++ b/packages/context/src/lib/context-manager/context-permissions/context-permissions.component.html
@@ -73,7 +73,7 @@
- person
{{ permission.profilTitle }}
{{ permission.profil }}
@@ -95,7 +95,7 @@
diff --git a/packages/context/src/lib/context-map-button/bookmark-button/bookmark-button.component.html b/packages/context/src/lib/context-map-button/bookmark-button/bookmark-button.component.html
index f66bbcc723..209052ca7a 100644
--- a/packages/context/src/lib/context-map-button/bookmark-button/bookmark-button.component.html
+++ b/packages/context/src/lib/context-map-button/bookmark-button/bookmark-button.component.html
@@ -6,6 +6,6 @@
[color]="color"
(click)="createContext()"
>
- {{ 'igo.context.permission.readOnlyTitle' | translate }}
>
{{ permission.profilTitle }}
{{ permission.profil }}
@@ -95,7 +95,7 @@
color="warn"
(click)="removePermission.emit(permission)"
>
- delete
{{ activeDirection.title }}
*ngFor="let step of activeDirection.steps; let cnt = index" igoListItem > -
-
-
-
-
diff --git a/packages/geo/src/lib/draw/draw/draw-shorcuts.component.ts b/packages/geo/src/lib/draw/draw/draw-shorcuts.component.ts
index 9f199b6380..732a8cdce0 100644
--- a/packages/geo/src/lib/draw/draw/draw-shorcuts.component.ts
+++ b/packages/geo/src/lib/draw/draw/draw-shorcuts.component.ts
@@ -7,6 +7,8 @@ import {
} from '@angular/material/dialog';
import { MatIconModule } from '@angular/material/icon';
+import { IconSvg, IgoIconComponent, KEYBOARD_ESC_ICON } from '@igo2/common';
+
import { TranslateModule } from '@ngx-translate/core';
@Component({
@@ -20,7 +22,10 @@ import { TranslateModule } from '@ngx-translate/core';
MatDialogActions,
MatButtonModule,
MatDialogClose,
- TranslateModule
+ TranslateModule,
+ IgoIconComponent
]
})
-export class DrawShorcutsComponent {}
+export class DrawShorcutsComponent {
+ svgIcon: IconSvg = KEYBOARD_ESC_ICON;
+}
diff --git a/packages/geo/src/lib/draw/draw/draw.component.html b/packages/geo/src/lib/draw/draw/draw.component.html
index 8026b905c1..01c88d3a4d 100644
--- a/packages/geo/src/lib/draw/draw/draw.component.html
+++ b/packages/geo/src/lib/draw/draw/draw.component.html
@@ -109,7 +109,8 @@
"
(click)="activeDrawingLayer.visible = !activeDrawingLayer.visible"
>
-
@@ -174,11 +175,10 @@
>
+ >keyboard
@@ -194,11 +194,10 @@
aria-hidden="false"
iconPositionEnd
class="style-icon"
- svgIcon="palette"
[matBadge]="selectedFeatures$.value.length"
matBadgeColor="warn"
matBadgeSize="medium"
- >
+ >palette
diff --git a/packages/geo/src/lib/draw/draw/draw.component.ts b/packages/geo/src/lib/draw/draw/draw.component.ts
index dedaf6ca71..3ab0aee99a 100644
--- a/packages/geo/src/lib/draw/draw/draw.component.ts
+++ b/packages/geo/src/lib/draw/draw/draw.component.ts
@@ -272,7 +272,7 @@ export class DrawComponent implements OnInit, OnDestroy {
return [
{
editMode: false,
- icon: 'pencil',
+ icon: 'edit',
color: 'primary',
click: () => {
this.editLabelDrawing(feature);
diff --git a/packages/geo/src/lib/feature/feature-details/feature-details.component.html b/packages/geo/src/lib/feature/feature-details/feature-details.component.html
index edb8d3dc65..fe8fc23342 100644
--- a/packages/geo/src/lib/feature/feature-details/feature-details.component.html
+++ b/packages/geo/src/lib/feature/feature-details/feature-details.component.html
@@ -12,7 +12,7 @@
- close
@@ -208,7 +208,7 @@
[disabled]="!currentFilter.active"
(click)="clearProperty()"
>
- close
@@ -222,7 +222,7 @@
color="warn"
(click)="deleteFilter()"
>
- delete
@@ -257,7 +257,7 @@
"
(click)="currentFilter.igoSNRC = ''"
>
- {{ bundle.title }}
matTooltipClass="material-tooltip" (click)="emptySelect()" > -
{{ node.name }}
@@ -228,6 +228,6 @@
- expand_less
- pentagon
- circle
diff --git a/packages/geo/src/lib/filter/time-filter-button/time-filter-button.component.html b/packages/geo/src/lib/filter/time-filter-button/time-filter-button.component.html
index 0e992505a6..d7d9698ef5 100644
--- a/packages/geo/src/lib/filter/time-filter-button/time-filter-button.component.html
+++ b/packages/geo/src/lib/filter/time-filter-button/time-filter-button.component.html
@@ -12,8 +12,8 @@
[matBadge]="badge"
matBadgeColor="warn"
matBadgeSize="medium"
- svgIcon="history"
- >
+ >history
- {{ playIcon }}
{{ handleSliderTooltip() }}
diff --git a/packages/geo/src/lib/filter/time-filter-form/time-filter-form.component.ts b/packages/geo/src/lib/filter/time-filter-form/time-filter-form.component.ts index 6a8fef044e..8d3107ca3f 100644 --- a/packages/geo/src/lib/filter/time-filter-form/time-filter-form.component.ts +++ b/packages/geo/src/lib/filter/time-filter-form/time-filter-form.component.ts @@ -94,7 +94,7 @@ export class TimeFilterFormComponent implements OnInit { } public interval: any; - public playIcon = 'play-circle'; + public playIcon = 'play_circle'; public resetIcon = 'replay'; @Output() change: EventEmitter
-
@@ -73,12 +71,8 @@
matTooltipShowDelay="500"
(click)="toggleSelectionMode()"
>
- {{
+ selectionMode ? 'library_add_check' : 'filter_none'
+ }}
diff --git a/packages/geo/src/lib/layer/layer-list-tool/layer-list-tool.component.scss b/packages/geo/src/lib/layer/layer-list-tool/layer-list-tool.component.scss
index 40a8244918..dd685403c5 100644
--- a/packages/geo/src/lib/layer/layer-list-tool/layer-list-tool.component.scss
+++ b/packages/geo/src/lib/layer/layer-list-tool/layer-list-tool.component.scss
@@ -19,3 +19,9 @@
display: none;
}
}
+
+.sort-alpha {
+ &.--active mat-icon {
+ color: red;
+ }
+}
diff --git a/packages/geo/src/lib/layer/layer-list/layer-list.component.html b/packages/geo/src/lib/layer/layer-list/layer-list.component.html
index 9ef89f259f..1876f3f465 100644
--- a/packages/geo/src/lib/layer/layer-list/layer-list.component.html
+++ b/packages/geo/src/lib/layer/layer-list/layer-list.component.html
@@ -68,7 +68,7 @@
[matTooltip]="'igo.geo.layer.removeLayer' | translate"
(click)="removeLayers()"
>
-
- arrow_drop_down
diff --git a/packages/geo/src/lib/map/geolocate-button/geolocate-button.component.html b/packages/geo/src/lib/map/geolocate-button/geolocate-button.component.html
index 56501ed344..6b7f97f6d6 100644
--- a/packages/geo/src/lib/map/geolocate-button/geolocate-button.component.html
+++ b/packages/geo/src/lib/map/geolocate-button/geolocate-button.component.html
@@ -10,6 +10,6 @@
[color]="color"
(click)="onGeolocationClick()"
>
-
- search
diff --git a/packages/geo/src/lib/search/search-selector/search-selector.component.html b/packages/geo/src/lib/search/search-selector/search-selector.component.html
index b26d5f405a..154643bb86 100644
--- a/packages/geo/src/lib/search/search-selector/search-selector.component.html
+++ b/packages/geo/src/lib/search/search-selector/search-selector.component.html
@@ -8,7 +8,7 @@
[matTooltip]="'igo.geo.search.menu.tooltip' | translate"
[matMenuTriggerFor]="searchSelectorMenu"
>
- arrow_drop_down
- expand_more
diff --git a/packages/geo/src/lib/search/shared/search.interfaces.ts b/packages/geo/src/lib/search/shared/search.interfaces.ts
index 56a7b36956..a2b2b3eda6 100644
--- a/packages/geo/src/lib/search/shared/search.interfaces.ts
+++ b/packages/geo/src/lib/search/shared/search.interfaces.ts
@@ -1,3 +1,5 @@
+import { IconSvg } from '@igo2/common';
+
import { Observable } from 'rxjs';
import { CommonVectorStyleOptions } from '../../style/shared/vector/vector-style.interface';
@@ -16,16 +18,7 @@ export interface Research {
export interface SearchResult {
data: T;
source: SearchSource;
- meta: {
- dataType: string;
- id: string;
- title: string;
- titleHtml?: string;
- pointerSummaryTitle?: string;
- icon: string;
- score?: number;
- nextPage?: boolean;
- };
+ meta: SearchMeta;
style?: {
base?: CommonVectorStyleOptions;
selection?: CommonVectorStyleOptions;
@@ -33,6 +26,17 @@ export interface SearchResult {
};
}
+export interface SearchMeta {
+ id: string;
+ dataType: string;
+ title: string;
+ titleHtml?: string;
+ icon: string | IconSvg;
+ score?: number;
+ nextPage?: boolean;
+ pointerSummaryTitle?: string;
+}
+
/**
* Search sources that allow searching by text implement this class
*/
diff --git a/packages/geo/src/lib/search/shared/search.utils.ts b/packages/geo/src/lib/search/shared/search.utils.ts
index e6649dd38e..71546561ce 100644
--- a/packages/geo/src/lib/search/shared/search.utils.ts
+++ b/packages/geo/src/lib/search/shared/search.utils.ts
@@ -65,7 +65,7 @@ export function featureToSearchResult(
dataType: FEATURE,
id: feature.meta.id as string,
title: feature.meta.title,
- icon: feature.meta.icon || 'map-marker'
+ icon: feature.meta.icon || 'location_on'
}
};
}
diff --git a/packages/geo/src/lib/search/shared/sources/cadastre.ts b/packages/geo/src/lib/search/shared/sources/cadastre.ts
index 28ffdb2719..255288a5b5 100644
--- a/packages/geo/src/lib/search/shared/sources/cadastre.ts
+++ b/packages/geo/src/lib/search/shared/sources/cadastre.ts
@@ -139,7 +139,7 @@ export class CadastreSearchSource extends SearchSource implements TextSearch {
id,
title: numero,
score: computeTermSimilarity(term.trim(), numero),
- icon: 'map-marker'
+ icon: 'location_on'
},
data: {
type: FEATURE,
diff --git a/packages/geo/src/lib/search/shared/sources/coordinates.ts b/packages/geo/src/lib/search/shared/sources/coordinates.ts
index b2dcf8c1a5..aff082de39 100644
--- a/packages/geo/src/lib/search/shared/sources/coordinates.ts
+++ b/packages/geo/src/lib/search/shared/sources/coordinates.ts
@@ -211,7 +211,7 @@ export class CoordinatesReverseSearchSource
id: data[0].toString() + ',' + data[1].toString(),
title: roundedCoordString,
titleHtml: roundedCoordString + subtitleHtml,
- icon: 'map-marker',
+ icon: 'location_on',
score: 100 // every coord exists
}
};
diff --git a/packages/geo/src/lib/search/shared/sources/icherche-icons.ts b/packages/geo/src/lib/search/shared/sources/icherche-icons.ts
new file mode 100644
index 0000000000..caec906298
--- /dev/null
+++ b/packages/geo/src/lib/search/shared/sources/icherche-icons.ts
@@ -0,0 +1,34 @@
+import { ENGINE_ICON, IconSvg } from '@igo2/common';
+
+/**
+ * Icons mappings to be retrocompatible with iCherche
+ */
+export const ICHERCHE_ICONS: {
+ [key: string]: string | IconSvg;
+} = {
+ 'map-marker': 'location_on',
+ city: 'location_city',
+ 'flag-triangle': 'flag',
+ 'map-marker-alert': 'fmd_bad',
+ 'map-marker-radius': 'pin_drop',
+ 'map-marker-multiple': 'local_post_office',
+ 'map-legend': 'map',
+ bank: 'account_balance',
+ 'map-search': 'search_insights',
+ 'book-open-variant': 'menu_book',
+ 'office-building': 'apartment',
+ 'table-picnic': 'table_restaurant',
+ flash: 'flash_on',
+ engine: ENGINE_ICON,
+ 'road-variant': 'add_road',
+ 'baby-face-outline': 'child_care',
+ 'home-account': 'location_home',
+ hospital: 'local_hospital',
+ pharmacy: 'local_pharmacy',
+ 'police-badge-outline': 'local_police',
+ parking: 'local_parking',
+ tree: 'nature',
+ 'home-city': 'home_work',
+ terrain: 'landscape',
+ 'panorama-horizontal': 'panorama_horizontal'
+};
diff --git a/packages/geo/src/lib/search/shared/sources/icherche.ts b/packages/geo/src/lib/search/shared/sources/icherche.ts
index 161d5ba375..12113cbbee 100644
--- a/packages/geo/src/lib/search/shared/sources/icherche.ts
+++ b/packages/geo/src/lib/search/shared/sources/icherche.ts
@@ -6,6 +6,7 @@ import {
import { Inject, Injectable, Injector } from '@angular/core';
import { AuthService } from '@igo2/auth';
+import { IconSvg } from '@igo2/common';
import { LanguageService } from '@igo2/core/language';
import { StorageService } from '@igo2/core/storage';
import { ObjectUtils, customCacheHasher } from '@igo2/utils';
@@ -20,6 +21,7 @@ import { Feature } from '../../../feature/shared/feature.interfaces';
import { ReverseSearch, SearchResult, TextSearch } from '../search.interfaces';
import { computeTermSimilarity } from '../search.utils';
import { GoogleLinks } from './../../../utils/googleLinks';
+import { ICHERCHE_ICONS } from './icherche-icons';
import {
IChercheData,
IChercheResponse,
@@ -495,6 +497,11 @@ export class IChercheSearchSource extends SearchSource implements TextSearch {
? '
' + data.highlight.title3 + '' : ''; + let icon: string | IconSvg = data.icon; + if (typeof icon == 'string' && Object.keys(ICHERCHE_ICONS).includes(icon)) { + icon = ICHERCHE_ICONS[icon]; + } + return { source: this, data: { @@ -513,7 +520,7 @@ export class IChercheSearchSource extends SearchSource implements TextSearch { id, title: data.properties.nom, titleHtml: titleHtml + subtitleHtml + subtitleHtml2, - icon: data.icon || 'map-marker', + icon: icon || 'location_on', score: data.score || computeTermSimilarity(term.trim(), data.properties.nom), nextPage: @@ -927,7 +934,7 @@ export class IChercheReverseSearchSource id, title: data.properties.nom, titleHtml: titleHtml + subtitleHtml, - icon: data.icon || 'map-marker', + icon: data.icon || 'location_on', pointerSummaryTitle: this.getSubtitle(data) + ': ' + data.properties.nom } }; diff --git a/packages/geo/src/lib/search/shared/sources/nominatim.ts b/packages/geo/src/lib/search/shared/sources/nominatim.ts index a41ee82f43..69106dd13e 100644 --- a/packages/geo/src/lib/search/shared/sources/nominatim.ts +++ b/packages/geo/src/lib/search/shared/sources/nominatim.ts @@ -211,7 +211,7 @@ export class NominatimSearchSource extends SearchSource implements TextSearch { dataType: FEATURE, id, title: data.display_name, - icon: 'map-marker', + icon: 'location_on', score: computeTermSimilarity(term.trim(), data.display_name) }, data: { diff --git a/packages/geo/src/lib/search/shared/sources/storedqueries.ts b/packages/geo/src/lib/search/shared/sources/storedqueries.ts index 7868db6dfa..e965352473 100644 --- a/packages/geo/src/lib/search/shared/sources/storedqueries.ts +++ b/packages/geo/src/lib/search/shared/sources/storedqueries.ts @@ -356,7 +356,7 @@ export class StoredQueriesSearchSource id, title: data.properties.title, titleHtml: data.properties[title], - icon: 'map-marker', + icon: 'location_on', score: data.properties.title ? computeTermSimilarity(term.trim(), data.properties.title) : computeTermSimilarity(term.trim(), data.properties[title]) @@ -574,7 +574,7 @@ export class StoredQueriesReverseSearchSource dataType: FEATURE, id, title: data.properties[title], - icon: 'map-marker' + icon: 'location_on' } }; } diff --git a/packages/geo/src/lib/search/shared/sources/workspace.ts b/packages/geo/src/lib/search/shared/sources/workspace.ts index 56d5dd5198..3359bce020 100644 --- a/packages/geo/src/lib/search/shared/sources/workspace.ts +++ b/packages/geo/src/lib/search/shared/sources/workspace.ts @@ -167,7 +167,7 @@ export class WorkspaceSearchSource extends SearchSource implements TextSearch { id, title: data.feature.meta.title, titleHtml: titleHtml + subtitleHtml2, - icon: 'map-marker', + icon: 'location_on', score: data.score, nextPage: resultsCnt % +this.options.params.limit === 0 && diff --git a/packages/geo/src/lib/style/style-modal/drawing/style-modal-drawing.component.html b/packages/geo/src/lib/style/style-modal/drawing/style-modal-drawing.component.html index 5fea418172..4057a9978e 100644 --- a/packages/geo/src/lib/style/style-modal/drawing/style-modal-drawing.component.html +++ b/packages/geo/src/lib/style/style-modal/drawing/style-modal-drawing.component.html @@ -10,7 +10,7 @@
' + data.highlight.title3 + '' : ''; + let icon: string | IconSvg = data.icon; + if (typeof icon == 'string' && Object.keys(ICHERCHE_ICONS).includes(icon)) { + icon = ICHERCHE_ICONS[icon]; + } + return { source: this, data: { @@ -513,7 +520,7 @@ export class IChercheSearchSource extends SearchSource implements TextSearch { id, title: data.properties.nom, titleHtml: titleHtml + subtitleHtml + subtitleHtml2, - icon: data.icon || 'map-marker', + icon: icon || 'location_on', score: data.score || computeTermSimilarity(term.trim(), data.properties.nom), nextPage: @@ -927,7 +934,7 @@ export class IChercheReverseSearchSource id, title: data.properties.nom, titleHtml: titleHtml + subtitleHtml, - icon: data.icon || 'map-marker', + icon: data.icon || 'location_on', pointerSummaryTitle: this.getSubtitle(data) + ': ' + data.properties.nom } }; diff --git a/packages/geo/src/lib/search/shared/sources/nominatim.ts b/packages/geo/src/lib/search/shared/sources/nominatim.ts index a41ee82f43..69106dd13e 100644 --- a/packages/geo/src/lib/search/shared/sources/nominatim.ts +++ b/packages/geo/src/lib/search/shared/sources/nominatim.ts @@ -211,7 +211,7 @@ export class NominatimSearchSource extends SearchSource implements TextSearch { dataType: FEATURE, id, title: data.display_name, - icon: 'map-marker', + icon: 'location_on', score: computeTermSimilarity(term.trim(), data.display_name) }, data: { diff --git a/packages/geo/src/lib/search/shared/sources/storedqueries.ts b/packages/geo/src/lib/search/shared/sources/storedqueries.ts index 7868db6dfa..e965352473 100644 --- a/packages/geo/src/lib/search/shared/sources/storedqueries.ts +++ b/packages/geo/src/lib/search/shared/sources/storedqueries.ts @@ -356,7 +356,7 @@ export class StoredQueriesSearchSource id, title: data.properties.title, titleHtml: data.properties[title], - icon: 'map-marker', + icon: 'location_on', score: data.properties.title ? computeTermSimilarity(term.trim(), data.properties.title) : computeTermSimilarity(term.trim(), data.properties[title]) @@ -574,7 +574,7 @@ export class StoredQueriesReverseSearchSource dataType: FEATURE, id, title: data.properties[title], - icon: 'map-marker' + icon: 'location_on' } }; } diff --git a/packages/geo/src/lib/search/shared/sources/workspace.ts b/packages/geo/src/lib/search/shared/sources/workspace.ts index 56d5dd5198..3359bce020 100644 --- a/packages/geo/src/lib/search/shared/sources/workspace.ts +++ b/packages/geo/src/lib/search/shared/sources/workspace.ts @@ -167,7 +167,7 @@ export class WorkspaceSearchSource extends SearchSource implements TextSearch { id, title: data.feature.meta.title, titleHtml: titleHtml + subtitleHtml2, - icon: 'map-marker', + icon: 'location_on', score: data.score, nextPage: resultsCnt % +this.options.params.limit === 0 && diff --git a/packages/geo/src/lib/style/style-modal/drawing/style-modal-drawing.component.html b/packages/geo/src/lib/style/style-modal/drawing/style-modal-drawing.component.html index 5fea418172..4057a9978e 100644 --- a/packages/geo/src/lib/style/style-modal/drawing/style-modal-drawing.component.html +++ b/packages/geo/src/lib/style/style-modal/drawing/style-modal-drawing.component.html @@ -10,7 +10,7 @@
- format_color_fill
{{ 'igo.geo.style.fill' | translate }}
@@ -20,8 +20,7 @@
-
-
+ border_color
{{ 'igo.geo.style.stroke' | translate }}
diff --git a/packages/geo/src/lib/style/style-modal/layer-button/style-modal-layer-button.component.html b/packages/geo/src/lib/style/style-modal/layer-button/style-modal-layer-button.component.html
index bbffa3b609..889c5b9419 100644
--- a/packages/geo/src/lib/style/style-modal/layer-button/style-modal-layer-button.component.html
+++ b/packages/geo/src/lib/style/style-modal/layer-button/style-modal-layer-button.component.html
@@ -4,5 +4,5 @@
(click)="openStyleModalDialog()"
[matTooltip]="'igo.geo.style.styleModalTooltipLayer' | translate"
>
-
+ palette
diff --git a/packages/geo/src/lib/style/style-modal/layer/style-modal-layer.component.html b/packages/geo/src/lib/style/style-modal/layer/style-modal-layer.component.html
index 7e9b1c190d..c9e033f315 100644
--- a/packages/geo/src/lib/style/style-modal/layer/style-modal-layer.component.html
+++ b/packages/geo/src/lib/style/style-modal/layer/style-modal-layer.component.html
@@ -9,7 +9,7 @@
*ngIf="linestringOnly !== true"
>
- format_color_fill
{{ 'igo.geo.style.fill' | translate }}
-
-
+ border_color
{{ 'igo.geo.style.stroke' | translate }}
description
diff --git a/packages/integration/src/lib/about/about-tool/about-tool.component.ts b/packages/integration/src/lib/about/about-tool/about-tool.component.ts
index 021a53b9ea..724510f192 100644
--- a/packages/integration/src/lib/about/about-tool/about-tool.component.ts
+++ b/packages/integration/src/lib/about/about-tool/about-tool.component.ts
@@ -24,7 +24,7 @@ import { AllEnvironmentOptions } from '../../environment';
@ToolComponent({
name: 'about',
title: 'igo.integration.tools.about',
- icon: 'help-circle'
+ icon: 'help'
})
@Component({
selector: 'igo-about-tool',
diff --git a/packages/integration/src/lib/catalog/catalog-browser-tool/catalog-browser-tool.component.ts b/packages/integration/src/lib/catalog/catalog-browser-tool/catalog-browser-tool.component.ts
index 76c37ef2b2..5821707c50 100644
--- a/packages/integration/src/lib/catalog/catalog-browser-tool/catalog-browser-tool.component.ts
+++ b/packages/integration/src/lib/catalog/catalog-browser-tool/catalog-browser-tool.component.ts
@@ -30,7 +30,6 @@ import { CatalogState } from '../catalog.state';
@ToolComponent({
name: 'catalogBrowser',
title: 'igo.integration.tools.catalog',
- icon: 'photo-browser',
parent: 'catalog'
})
@Component({
diff --git a/packages/integration/src/lib/catalog/catalog-library-tool/catalog-library-tool.component.ts b/packages/integration/src/lib/catalog/catalog-library-tool/catalog-library-tool.component.ts
index 093ad3f762..3270b1847c 100644
--- a/packages/integration/src/lib/catalog/catalog-library-tool/catalog-library-tool.component.ts
+++ b/packages/integration/src/lib/catalog/catalog-library-tool/catalog-library-tool.component.ts
@@ -21,7 +21,7 @@ import { CatalogState } from '../catalog.state';
@ToolComponent({
name: 'catalog',
title: 'igo.integration.tools.catalog',
- icon: 'layers-plus'
+ icon: 'library_add'
})
@Component({
selector: 'igo-catalog-library-tool',
diff --git a/packages/integration/src/lib/context/context-share-tool/context-share-tool.component.ts b/packages/integration/src/lib/context/context-share-tool/context-share-tool.component.ts
index a81740f818..57ec7fbc7e 100644
--- a/packages/integration/src/lib/context/context-share-tool/context-share-tool.component.ts
+++ b/packages/integration/src/lib/context/context-share-tool/context-share-tool.component.ts
@@ -10,7 +10,7 @@ import { MapState } from '../../map/map.state';
@ToolComponent({
name: 'shareMap',
title: 'igo.integration.tools.shareMap',
- icon: 'share-variant'
+ icon: 'share'
})
@Component({
selector: 'igo-context-share-tool',
diff --git a/packages/integration/src/lib/draw/drawing-tool/drawing-tool.component.ts b/packages/integration/src/lib/draw/drawing-tool/drawing-tool.component.ts
index b76d00c4af..8d2e782154 100644
--- a/packages/integration/src/lib/draw/drawing-tool/drawing-tool.component.ts
+++ b/packages/integration/src/lib/draw/drawing-tool/drawing-tool.component.ts
@@ -19,7 +19,7 @@ import { DrawState } from '../draw.state';
@ToolComponent({
name: 'draw',
title: 'igo.integration.tools.draw',
- icon: 'draw'
+ icon: 'stylus_note'
})
@Component({
selector: 'igo-drawing-tool',
diff --git a/packages/integration/src/lib/filter/spatial-filter-tool/spatial-filter-tool.component.ts b/packages/integration/src/lib/filter/spatial-filter-tool/spatial-filter-tool.component.ts
index 6a07178367..b01534ad36 100644
--- a/packages/integration/src/lib/filter/spatial-filter-tool/spatial-filter-tool.component.ts
+++ b/packages/integration/src/lib/filter/spatial-filter-tool/spatial-filter-tool.component.ts
@@ -9,7 +9,12 @@ import {
} from '@angular/core';
import { MatIconRegistry } from '@angular/material/icon';
-import { EntityStore, PanelComponent, ToolComponent } from '@igo2/common';
+import {
+ EntityStore,
+ PanelComponent,
+ SELECTION_MARKER_ICON,
+ ToolComponent
+} from '@igo2/common';
import { LanguageService } from '@igo2/core/language';
import { MessageService } from '@igo2/core/message';
import {
@@ -62,7 +67,7 @@ import {
@ToolComponent({
name: 'spatialFilter',
title: 'igo.integration.tools.spatialFilter',
- icon: 'selection-marker'
+ icon: SELECTION_MARKER_ICON
})
/**
* Spatial Filter Type
diff --git a/packages/integration/src/lib/geometry-form/data-issue-reporter-tool/data-issue-reporter-tool.component.ts b/packages/integration/src/lib/geometry-form/data-issue-reporter-tool/data-issue-reporter-tool.component.ts
index a79c7a2d2e..2f18b6cd74 100644
--- a/packages/integration/src/lib/geometry-form/data-issue-reporter-tool/data-issue-reporter-tool.component.ts
+++ b/packages/integration/src/lib/geometry-form/data-issue-reporter-tool/data-issue-reporter-tool.component.ts
@@ -24,7 +24,7 @@ interface DataIssueReporterData {
@ToolComponent({
name: 'dataIssueReporter',
title: 'igo.integration.tools.dataIssueReporter',
- icon: 'message-alert'
+ icon: 'feedback'
})
@Component({
selector: 'igo-issue-reporter-tool',
diff --git a/packages/integration/src/lib/import-export/import-export-tool/import-export-tool.component.ts b/packages/integration/src/lib/import-export/import-export-tool/import-export-tool.component.ts
index 32822d67f4..eb48ca457f 100644
--- a/packages/integration/src/lib/import-export/import-export-tool/import-export-tool.component.ts
+++ b/packages/integration/src/lib/import-export/import-export-tool/import-export-tool.component.ts
@@ -31,7 +31,7 @@ import {
@ToolComponent({
name: 'importExport',
title: 'igo.integration.tools.importExport',
- icon: 'file-move'
+ icon: 'file_save'
})
@Component({
selector: 'igo-import-export-tool',
diff --git a/packages/integration/src/lib/map/advanced-map-tool/advanced-coordinates/advanced-coordinates.component.html b/packages/integration/src/lib/map/advanced-map-tool/advanced-coordinates/advanced-coordinates.component.html
index 44f4ecc03a..71089970ca 100644
--- a/packages/integration/src/lib/map/advanced-map-tool/advanced-coordinates/advanced-coordinates.component.html
+++ b/packages/integration/src/lib/map/advanced-map-tool/advanced-coordinates/advanced-coordinates.component.html
@@ -72,7 +72,7 @@
class="igo-form-button-group advanced-coordinates__copy-coordinates"
(click)="copyTextToClipboard()"
>
- content_copy
diff --git a/packages/integration/src/lib/map/advanced-map-tool/advanced-map-tool.component.ts b/packages/integration/src/lib/map/advanced-map-tool/advanced-map-tool.component.ts
index caa1cec2ac..95bd80715c 100644
--- a/packages/integration/src/lib/map/advanced-map-tool/advanced-map-tool.component.ts
+++ b/packages/integration/src/lib/map/advanced-map-tool/advanced-map-tool.component.ts
@@ -14,7 +14,7 @@ import { AdvancedSwipeComponent } from './advanced-swipe/advanced-swipe.componen
@ToolComponent({
name: 'advancedMap',
title: 'igo.integration.tools.advancedMap',
- icon: 'toolbox'
+ icon: 'home_repair_service'
})
/**
* Tool to handle the advanced map tools
diff --git a/packages/integration/src/lib/map/advanced-map-tool/advanced-swipe/advanced-swipe.component.html b/packages/integration/src/lib/map/advanced-map-tool/advanced-swipe/advanced-swipe.component.html
index 8e51c62424..1ecec452e7 100644
--- a/packages/integration/src/lib/map/advanced-map-tool/advanced-swipe/advanced-swipe.component.html
+++ b/packages/integration/src/lib/map/advanced-map-tool/advanced-swipe/advanced-swipe.component.html
@@ -46,7 +46,7 @@
}}
- search
- library_add
- star
- content_copy
{{
diff --git a/packages/integration/src/lib/map/map-proximity-tool/map-proximity-tool.component.ts b/packages/integration/src/lib/map/map-proximity-tool/map-proximity-tool.component.ts
index e23f2e081e..7e8549196e 100644
--- a/packages/integration/src/lib/map/map-proximity-tool/map-proximity-tool.component.ts
+++ b/packages/integration/src/lib/map/map-proximity-tool/map-proximity-tool.component.ts
@@ -26,7 +26,7 @@ import { MapState } from '../map.state';
@ToolComponent({
name: 'map-proximity',
title: 'igo.integration.tools.closestFeature',
- icon: 'radius'
+ icon: 'output_circle'
})
/**
* Tool to handle the advanced map tools
diff --git a/packages/integration/src/lib/measure/measurer-tool/measurer-tool.component.ts b/packages/integration/src/lib/measure/measurer-tool/measurer-tool.component.ts
index 1c2ce1d854..a54dc2364b 100644
--- a/packages/integration/src/lib/measure/measurer-tool/measurer-tool.component.ts
+++ b/packages/integration/src/lib/measure/measurer-tool/measurer-tool.component.ts
@@ -17,7 +17,7 @@ import { MeasureState } from '../measure.state';
@ToolComponent({
name: 'measurer',
title: 'igo.integration.tools.measurer',
- icon: 'ruler'
+ icon: 'square_foot'
})
@Component({
selector: 'igo-measurer-tool',
diff --git a/packages/integration/src/lib/print/print-tool/print-tool.component.ts b/packages/integration/src/lib/print/print-tool/print-tool.component.ts
index 1995ec6c51..9e0455cb58 100644
--- a/packages/integration/src/lib/print/print-tool/print-tool.component.ts
+++ b/packages/integration/src/lib/print/print-tool/print-tool.component.ts
@@ -8,7 +8,7 @@ import { MapState } from '../../map/map.state';
@ToolComponent({
name: 'print',
title: 'igo.integration.tools.print',
- icon: 'printer'
+ icon: 'print'
})
@Component({
selector: 'igo-print-tool',
diff --git a/packages/integration/src/lib/search/search-results-tool/search-results-tool.component.html b/packages/integration/src/lib/search/search-results-tool/search-results-tool.component.html
index ea40723b08..b563f7e28d 100644
--- a/packages/integration/src/lib/search/search-results-tool/search-results-tool.component.html
+++ b/packages/integration/src/lib/search/search-results-tool/search-results-tool.component.html
@@ -74,11 +74,11 @@
class="igo-icon-button"
(click)="toggleTopPanel()"
>
- {{
+ (topPanelState$ | async) === 'collapsed'
+ ? 'arrow_upward'
+ : 'arrow_downward'
+ }}
{
@@ -103,7 +103,7 @@ export function getWorkspaceActions(
},
{
id: 'featureDownload',
- icon: 'file-export',
+ icon: 'file_save',
title: 'igo.integration.workspace.download.title',
tooltip: 'igo.integration.workspace.download.tooltip',
handler: (ws: FeatureWorkspace | WfsWorkspace | EditionWorkspace) => {
@@ -129,7 +129,7 @@ export function getWorkspaceActions(
},
{
id: 'ogcFilter',
- icon: 'filter',
+ icon: 'filter_alt',
title: 'igo.integration.workspace.ogcFilter.title',
tooltip: 'igo.integration.workspace.ogcFilter.tooltip',
handler: (
@@ -179,7 +179,7 @@ export function getWorkspaceActions(
},
{
id: 'print',
- icon: 'printer',
+ icon: 'print',
title: 'igo.integration.workspace.print.title',
tooltip: 'igo.integration.workspace.print.tooltip',
handler: (ws: FeatureWorkspace | WfsWorkspace | EditionWorkspace) => {
diff --git a/packages/integration/src/lib/workspace/workspace-button/workspace-button.component.html b/packages/integration/src/lib/workspace/workspace-button/workspace-button.component.html
index af35f7b9cd..bb6432d0a1 100644
--- a/packages/integration/src/lib/workspace/workspace-button/workspace-button.component.html
+++ b/packages/integration/src/lib/workspace/workspace-button/workspace-button.component.html
@@ -7,5 +7,5 @@
[color]="color"
(click)="activateWorkspace()"
>
- table
diff --git a/packages/integration/src/locale/en.integration.json b/packages/integration/src/locale/en.integration.json
index 153e4ed39b..27db49428e 100644
--- a/packages/integration/src/locale/en.integration.json
+++ b/packages/integration/src/locale/en.integration.json
@@ -47,7 +47,7 @@
},
"aboutTool": {
"headerHtml": "",
- "html": " Features overview Search Bar Located in the upper-left portion of the interface, the Search Bar allows the user to locate an area of interest using an address, location or GPS coordinates. It can also be used to search for a layer.
It is also possible to search for a specific element using the hashtag \"#\" (for example, #municipalites québec). Accents and capital letters don't have any impact on Search Results when using a hashtag.
Contexts Contexts are used to visualize groupings of layers related to a specific theme. When a context is selected, all the layers associated with it will be added to the Map. It is then possible to add other layers to the map by using the Catalog or the Search Bar.
WARNING : If a new context is selected, all the layers displayed on the Map will be replaced by the ones associated with the newly selected context.
Map It is possible to personalize the Map by using the Catalog or the Search Bar. This space allows the user to add, delete, interrogate, filter and sort the displayed layers. It is also possible to visualize the legends associated with the layers.
Spatial Filter The Spatial Filter can be used to search for adresses or themes by specifying a predefined zone (for example, electoral districts) or by drawing an area on the map. The results can then be exported by using the Import & Export tool.
Measure This tool gives the option to either Measure distances or areas on the map.
A Drawings layer can be exported by using the Import & Export tool.
Directions It is possible to build a route and get Directions between two points by placing them on the map or by searching for addresses. It is also possible to add stops and copy the description or the link of the route to the clipboard.
Catalog The Catalog contains all the layers that can be added to the Map. Click on the + of desired layer to add it.
Import & Export It is possible to Import vector data by specifying a coordinate system or a projection.
It is possible to Export one or many layers in multiple formats.
It is also possible to Import or Export a context locally. This feature is useful to save contexts when the user is not authenticated.
Print This tool is used to Print the map displayed on-screen. Multiple options can be specified like a title, a comment, the output format, the paper size and the orientation.
Share The Share tool is used to create an URL that redirects to an exact representation of the map. This link can be shared or distributed in a document and allows the user to \"save\" the map for later use.
IGO2 is a open source geospatial solution developed by collaborators and specialists from several departments and agencies of the Government of Quebec.
Version: {{version}}
",
+ "html": " Features overview Search BarLocated in the upper-left portion of the interface, the Search Bar allows the user to locate an area of interest using an address, location or GPS coordinates. It can also be used to search for a layer.
It is also possible to search for a specific element using the hashtag \"#\" (for example, #municipalites québec). Accents and capital letters don't have any impact on Search Results when using a hashtag.
Context Contexts are used to visualize groupings of layers related to a specific theme. When a context is selected, all the layers associated with it will be added to the Map. It is then possible to add other layers to the map by using the Catalog or the Search Bar.
WARNING : If a new context is selected, all the layers displayed on the Map will be replaced by the ones associated with the newly selected context.
MapIt is possible to personalize the Map by using the Catalog or the Search Bar. This space allows the user to add, delete, interrogate, filter and sort the displayed layers. It is also possible to visualize the legends associated with the layers.
Spatial Filter The Spatial Filter can be used to search for adresses or themes by specifying a predefined zone (for example, electoral districts) or by drawing an area on the map. The results can then be exported by using the Import & Export tool.
MeasureThis tool gives the option to either Measure distances or areas on the map.
Draw The Draw tool can be used to draw points, lines, polygons or circles with labels. The color of the fill and the stroke can be set with the given selectors.
A Drawings layer can be exported by using the Import & Export tool.
Directions It is possible to build a route and get Directions between two points by placing them on the map or by searching for addresses. It is also possible to add stops and copy the description or the link of the route to the clipboard.
Catalog The Catalog contains all the layers that can be added to the Map. Click on the + of desired layer to add it.
Import & Export It is possible to Import vector data by specifying a coordinate system or a projection.
It is possible to Export one or many layers in multiple formats.
It is also possible to Import or Export a context locally. This feature is useful to save contexts when the user is not authenticated.
PrintThis tool is used to Print the map displayed on-screen. Multiple options can be specified like a title, a comment, the output format, the paper size and the orientation.
Share The Share tool is used to create an URL that redirects to an exact representation of the map. This link can be shared or distributed in a document and allows the user to \"save\" the map for later use.
IGO2 is a open source geospatial solution developed by collaborators and specialists from several departments and agencies of the Government of Quebec.
Version: {{version}}
",
"trainingGuide": "Training guide",
"trainingGuideTooltip": "Click here to access IGO2's self-training guide"
},
diff --git a/packages/integration/src/locale/fr.integration.json b/packages/integration/src/locale/fr.integration.json
index 359a8f9f61..c869c11bde 100644
--- a/packages/integration/src/locale/fr.integration.json
+++ b/packages/integration/src/locale/fr.integration.json
@@ -47,7 +47,7 @@
},
"aboutTool": {
"headerHtml": "",
- "html": " Aperçu des fonctionnalités Recherche Située dans la portion supérieure gauche de l’interface, la barre de Recherche permet de se positionner à l’aide d’une adresse, d’un lieu ou de coordonnées GPS et peut également servir à rechercher une couche.
Il est également possible de rechercher un élément par type de résultats en utilisant le hashtag « # » (par exemple, #municipalites québec). Les accents et les lettres majuscules n'importent pas lors de l'utilisation du hashtag et n'ont pas d'impact sur les Résultats de recherche.
Contextes Les Contextes permettent de visualiser des regroupements de couches faits par thème ou par contexte de travail. Lorsqu'un contexte est sélectionné, toutes les couches qu'il contient se retrouvent alors dans la Carte. Il est possible d'ajouter d’autres couches à partir du Catalogue ou de l’outil Recherche.
ATTENTION : Si un nouveau contexte est sélectionné, toutes les couches affichées dans la Carte seront remplacées par celles de ce nouveau contexte.
Carte Il est possible de personnaliser la Carte à partir du Catalogue ou de l’outil Recherche. Cet espace permet entre autres d’ajouter, de supprimer, d’interroger, de filtrer et de trier les couches présentées. Il est également possible d'afficher les légendes des couches.
Mesurer Cet outil permet de Mesurer des distances ou des superficies directement sur la carte.
Une couche Dessins peut être exportée à l'aide de l'outil Importer et exporter.
Itinéraire Il est possible de construire un Itinéraire entre deux points en sélectionnant un point de départ et un point d'arrivée dans la carte ou en recherchant des adresses. Il est ensuite possible d'ajouter des points d'arrêt intermédiaires et de copier la description ou le lien de l'itinéraire dans le presse-papier.
Catalogue Le Catalogue contient toutes les couches qui peuvent être ajoutées à la Carte. L'utilisateur doit cliquer sur + de la couche désirée afin de l’ajouter à la Carte.
Importer et exporter Il est possible d'Importer un fichier vectoriel tout en spécifiant un système de coordonnées ou une projection.
Il est possible d'Exporter une ou plusieurs couches dans plusieurs formats courants.
Il est également possible d'Importer ou d'Exporter un contexte localement. Cette dernière fonctionnalité permet ainsi de sauvegarder des contextes en mode non-authentifié ou anonyme.
Imprimer Cet outil permet d'Imprimer la carte affichée à l’écran en spécifiant plusieurs options telles qu'un titre, un commentaire, le format de sortie, le format du papier et l'orientation de l'impression.
Partager L'outil Partager permet de créer une adresse URL qui redirige vers une représentation exacte de la Carte affichée à l’écran. Ce lien peut, par exemple, être partagé ou diffusé dans un document, permettant ainsi de « sauvegarder » la carte pour une utilisation ultérieure.
IGO2 est une solution Web libre géomatique développée en mode collaboratif par des spécialistes provenant de plusieurs ministères et organismes du gouvernement du Québec.
Version: {{version}}
",
+ "html": " Aperçu des fonctionnalités Recherche Située dans la portion supérieure gauche de l’interface, la barre de Recherche permet de se positionner à l’aide d’une adresse, d’un lieu ou de coordonnées GPS et peut également servir à rechercher une couche.
Il est également possible de rechercher un élément par type de résultats en utilisant le hashtag « # » (par exemple, #municipalites québec). Les accents et les lettres majuscules n'importent pas lors de l'utilisation du hashtag et n'ont pas d'impact sur les Résultats de recherche.
Contextes Les Contextes permettent de visualiser des regroupements de couches faits par thème ou par contexte de travail. Lorsqu'un contexte est sélectionné, toutes les couches qu'il contient se retrouvent alors dans la Carte. Il est possible d'ajouter d’autres couches à partir du Catalogue ou de l’outil Recherche.
ATTENTION : Si un nouveau contexte est sélectionné, toutes les couches affichées dans la Carte seront remplacées par celles de ce nouveau contexte.
Carte Il est possible de personnaliser la Carte à partir du Catalogue ou de l’outil Recherche. Cet espace permet entre autres d’ajouter, de supprimer, d’interroger, de filtrer et de trier les couches présentées. Il est également possible d'afficher les légendes des couches.
Filtre spatial Le Filtre spatial permet de rechercher des adresses ou des thématiques selon des zones prédéfinies (par exemple, par arrondissement ou par MRC) ou selon un dessin réalisé par l'utilisateur. Les résultats du filtre peuvent être exportés à l'aide de l'outil Importer et exporter.
Mesurer Cet outil permet de Mesurer des distances ou des superficies directement sur la carte.
Dessin L'outil Dessin permet de dessiner des entités ponctuelles, linéaires, polygonales ou circulaires accompagnées ou non d'étiquettes. La couleur de remplissage et du contour des entités peuvent être choisies à l'aide des sélecteurs correspondants.
Une couche Dessins peut être exportée à l'aide de l'outil Importer et exporter.
Itinéraire Il est possible de construire un Itinéraire entre deux points en sélectionnant un point de départ et un point d'arrivée dans la carte ou en recherchant des adresses. Il est ensuite possible d'ajouter des points d'arrêt intermédiaires et de copier la description ou le lien de l'itinéraire dans le presse-papier.
Catalogue Le Catalogue contient toutes les couches qui peuvent être ajoutées à la Carte. L'utilisateur doit cliquer sur + de la couche désirée afin de l’ajouter à la Carte.
Importer et exporter Il est possible d'Importer un fichier vectoriel tout en spécifiant un système de coordonnées ou une projection.
Il est possible d'Exporter une ou plusieurs couches dans plusieurs formats courants.
Il est également possible d'Importer ou d'Exporter un contexte localement. Cette dernière fonctionnalité permet ainsi de sauvegarder des contextes en mode non-authentifié ou anonyme.
Imprimer Cet outil permet d'Imprimer la carte affichée à l’écran en spécifiant plusieurs options telles qu'un titre, un commentaire, le format de sortie, le format du papier et l'orientation de l'impression.
Partager L'outil Partager permet de créer une adresse URL qui redirige vers une représentation exacte de la Carte affichée à l’écran. Ce lien peut, par exemple, être partagé ou diffusé dans un document, permettant ainsi de « sauvegarder » la carte pour une utilisation ultérieure.
IGO2 est une solution Web libre géomatique développée en mode collaboratif par des spécialistes provenant de plusieurs ministères et organismes du gouvernement du Québec.
Version: {{version}}
",
"trainingGuide": "Guide de formation",
"trainingGuideTooltip": "Cliquez ici pour accéder au guide d'autoformation de IGO2"
},
diff --git a/projects/demo/src/app/app.component.html b/projects/demo/src/app/app.component.html
index a2fe073692..ae2c32407a 100644
--- a/projects/demo/src/app/app.component.html
+++ b/projects/demo/src/app/app.component.html
@@ -1,7 +1,7 @@
{{ title }}
{{ version.lib }}
diff --git a/projects/demo/src/app/common/action/action.component.ts b/projects/demo/src/app/common/action/action.component.ts
index b567038c7c..3a48a8053c 100644
--- a/projects/demo/src/app/common/action/action.component.ts
+++ b/projects/demo/src/app/common/action/action.component.ts
@@ -40,7 +40,7 @@ export class AppActionComponent implements OnInit, OnDestroy {
{
id: 'add',
title: 'Add',
- icon: 'plus',
+ icon: 'add',
tooltip: 'Add Tooltip',
handler: () => {
alert('Add!');
@@ -50,7 +50,7 @@ export class AppActionComponent implements OnInit, OnDestroy {
{
id: 'edit',
title: 'Edit',
- icon: 'pencil',
+ icon: 'edit',
tooltip: 'Edit Tooltip',
args: ['1'],
handler: (item: string) => {
diff --git a/projects/demo/src/app/common/common.routing.ts b/projects/demo/src/app/common/common.routing.ts
index f7635e29b0..7cb2b1f0dd 100644
--- a/projects/demo/src/app/common/common.routing.ts
+++ b/projects/demo/src/app/common/common.routing.ts
@@ -6,6 +6,7 @@ import { AppDynamicComponentComponent } from './dynamic-component/dynamic-compon
import { AppEntitySelectorComponent } from './entity-selector/entity-selector.component';
import { AppEntityTableComponent } from './entity-table/entity-table.component';
import { AppFormComponent } from './form/form.component';
+import { AppIconComponent } from './icon/icon.component';
import { AppTableComponent } from './table/table.component';
import { AppToolComponent } from './tool/tool.component';
import { AppWidgetComponent } from './widget/widget.component';
@@ -38,10 +39,15 @@ export const routes: Routes = [
component: AppEntitySelectorComponent
},
{
- title: 'form',
- path: 'Form',
+ title: 'Form',
+ path: 'form',
component: AppFormComponent
},
+ {
+ title: 'Icon',
+ path: 'icon',
+ component: AppIconComponent
+ },
{
title: 'Table',
path: 'table',
diff --git a/projects/demo/src/app/common/entity-table/entity-table.component.ts b/projects/demo/src/app/common/entity-table/entity-table.component.ts
index bb857e2826..709744c06f 100644
--- a/projects/demo/src/app/common/entity-table/entity-table.component.ts
+++ b/projects/demo/src/app/common/entity-table/entity-table.component.ts
@@ -44,8 +44,8 @@ export class AppEntityTableComponent implements OnInit, OnDestroy {
title: 'Selected',
valueAccessor: (entity: object) => {
return this.store.state.get(entity).selected
- ? 'radiobox-marked'
- : 'radiobox-blank';
+ ? 'radio_button_checked'
+ : 'radio_button_unchecked';
},
renderer: EntityTableColumnRenderer.Icon
},
diff --git a/projects/demo/src/app/common/icon/icon.component.html b/projects/demo/src/app/common/icon/icon.component.html
new file mode 100644
index 0000000000..c37c7b2da1
--- /dev/null
+++ b/projects/demo/src/app/common/icon/icon.component.html
@@ -0,0 +1,51 @@
+
+
+
+ The icon is a core concept for many packages of the IGO2
+ library. The icon system is base on
+ Google Font - Material Symbol
+ who use font ligature to configure the icon
+
+
+
+
+ Getting started
+
+ -
+ In your
+
index.html
+ file, add the variable font stylesheet request to your head tag and
+ {{exampleIndexHtml}}
+
+ -
+ Then add the current class with variable axes configuration to icons in
+ your
style.scss file.
+ {{exampleStyleVariable}}
+
+ -
+ Finally, add the icon provider configuration in your main file
+
main.ts
+ {{exampleProvider}}
+
+
+
+
+
+
+ Enter a name from the
+ Google Font - Material Symbol
+
+
+
+ Icon Name
+
+
+
+
diff --git a/projects/demo/src/app/common/icon/icon.component.scss b/projects/demo/src/app/common/icon/icon.component.scss
new file mode 100644
index 0000000000..acfae0abde
--- /dev/null
+++ b/projects/demo/src/app/common/icon/icon.component.scss
@@ -0,0 +1,4 @@
+.field-container {
+ display: flex;
+ align-items: center;
+}
diff --git a/projects/demo/src/app/common/icon/icon.component.spec.ts b/projects/demo/src/app/common/icon/icon.component.spec.ts
new file mode 100644
index 0000000000..061015a1cc
--- /dev/null
+++ b/projects/demo/src/app/common/icon/icon.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+
+import { AppIconComponent } from './icon.component';
+
+describe('AppIconComponent', () => {
+ let component: AppIconComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [AppIconComponent, NoopAnimationsModule]
+ }).compileComponents();
+
+ fixture = TestBed.createComponent(AppIconComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/projects/demo/src/app/common/icon/icon.component.ts b/projects/demo/src/app/common/icon/icon.component.ts
new file mode 100644
index 0000000000..5d67bef16a
--- /dev/null
+++ b/projects/demo/src/app/common/icon/icon.component.ts
@@ -0,0 +1,50 @@
+import { Component } from '@angular/core';
+import { FormControl, ReactiveFormsModule } from '@angular/forms';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatInputModule } from '@angular/material/input';
+
+import { IgoIconComponent } from '@igo2/common';
+
+import { DocViewerComponent } from '../../components/doc-viewer/doc-viewer.component';
+import { ExampleViewerComponent } from '../../components/example/example-viewer/example-viewer.component';
+
+@Component({
+ selector: 'app-icon',
+ standalone: true,
+ imports: [
+ DocViewerComponent,
+ ExampleViewerComponent,
+ IgoIconComponent,
+ MatFormFieldModule,
+ ReactiveFormsModule,
+ MatInputModule
+ ],
+ templateUrl: './icon.component.html',
+ styleUrl: './icon.component.scss'
+})
+export class AppIconComponent {
+ exampleIndexHtml: string = EXAMPLE_INDEX_HTML;
+ exampleStyleVariable: string = EXAMPLE_STYLE_VARIABLE;
+ exampleProvider: string = EXAMPLE_PROVIDER;
+
+ nameControl = new FormControl('shopping_cart_checkout');
+}
+
+const EXAMPLE_INDEX_HTML = ``;
+
+const EXAMPLE_STYLE_VARIABLE = `.material-symbols-outlined {
+ font-variation-settings:
+ 'FILL' 0,
+ 'wght' 400,
+ 'GRAD' 0,
+ 'opsz' 24
+}`;
+
+const EXAMPLE_PROVIDER = `import { provideIcon } from '@igo2/common';
+
+bootstrapApplication(AppComponent, {
+ providers: [
+ provideIcon(),
+ ]
+})
+`;
diff --git a/projects/demo/src/app/common/table/table.component.ts b/projects/demo/src/app/common/table/table.component.ts
index c9a1f2608d..1a9d7fda82 100644
--- a/projects/demo/src/app/common/table/table.component.ts
+++ b/projects/demo/src/app/common/table/table.component.ts
@@ -43,7 +43,7 @@ export class AppTableComponent implements OnInit {
],
actions: [
{
- icon: 'file-document',
+ icon: 'description',
color: TableActionColor.primary,
click: (row) => this.showName(row.name)
}
diff --git a/projects/demo/src/app/common/tool/tool.component.html b/projects/demo/src/app/common/tool/tool.component.html
index f150879c61..639ee92dfd 100644
--- a/projects/demo/src/app/common/tool/tool.component.html
+++ b/projects/demo/src/app/common/tool/tool.component.html
@@ -7,7 +7,7 @@
(click)="toolbox.activatePreviousTool()"
*ngIf="activeTool$ | async"
>
- arrow_back
- code-tags
- settings
diff --git a/projects/demo/src/index.html b/projects/demo/src/index.html
index 1d3f410c63..05a1b0cee1 100644
--- a/projects/demo/src/index.html
+++ b/projects/demo/src/index.html
@@ -13,6 +13,10 @@
href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;600;700&display=swap"
rel="stylesheet"
/>
+
*ngIf="linestringOnly !== true"
>
- format_color_fill
{{ 'igo.geo.style.fill' | translate }}
-
-
+ border_color
{{ 'igo.geo.style.stroke' | translate }}
description
diff --git a/packages/integration/src/lib/about/about-tool/about-tool.component.ts b/packages/integration/src/lib/about/about-tool/about-tool.component.ts
index 021a53b9ea..724510f192 100644
--- a/packages/integration/src/lib/about/about-tool/about-tool.component.ts
+++ b/packages/integration/src/lib/about/about-tool/about-tool.component.ts
@@ -24,7 +24,7 @@ import { AllEnvironmentOptions } from '../../environment';
@ToolComponent({
name: 'about',
title: 'igo.integration.tools.about',
- icon: 'help-circle'
+ icon: 'help'
})
@Component({
selector: 'igo-about-tool',
diff --git a/packages/integration/src/lib/catalog/catalog-browser-tool/catalog-browser-tool.component.ts b/packages/integration/src/lib/catalog/catalog-browser-tool/catalog-browser-tool.component.ts
index 76c37ef2b2..5821707c50 100644
--- a/packages/integration/src/lib/catalog/catalog-browser-tool/catalog-browser-tool.component.ts
+++ b/packages/integration/src/lib/catalog/catalog-browser-tool/catalog-browser-tool.component.ts
@@ -30,7 +30,6 @@ import { CatalogState } from '../catalog.state';
@ToolComponent({
name: 'catalogBrowser',
title: 'igo.integration.tools.catalog',
- icon: 'photo-browser',
parent: 'catalog'
})
@Component({
diff --git a/packages/integration/src/lib/catalog/catalog-library-tool/catalog-library-tool.component.ts b/packages/integration/src/lib/catalog/catalog-library-tool/catalog-library-tool.component.ts
index 093ad3f762..3270b1847c 100644
--- a/packages/integration/src/lib/catalog/catalog-library-tool/catalog-library-tool.component.ts
+++ b/packages/integration/src/lib/catalog/catalog-library-tool/catalog-library-tool.component.ts
@@ -21,7 +21,7 @@ import { CatalogState } from '../catalog.state';
@ToolComponent({
name: 'catalog',
title: 'igo.integration.tools.catalog',
- icon: 'layers-plus'
+ icon: 'library_add'
})
@Component({
selector: 'igo-catalog-library-tool',
diff --git a/packages/integration/src/lib/context/context-share-tool/context-share-tool.component.ts b/packages/integration/src/lib/context/context-share-tool/context-share-tool.component.ts
index a81740f818..57ec7fbc7e 100644
--- a/packages/integration/src/lib/context/context-share-tool/context-share-tool.component.ts
+++ b/packages/integration/src/lib/context/context-share-tool/context-share-tool.component.ts
@@ -10,7 +10,7 @@ import { MapState } from '../../map/map.state';
@ToolComponent({
name: 'shareMap',
title: 'igo.integration.tools.shareMap',
- icon: 'share-variant'
+ icon: 'share'
})
@Component({
selector: 'igo-context-share-tool',
diff --git a/packages/integration/src/lib/draw/drawing-tool/drawing-tool.component.ts b/packages/integration/src/lib/draw/drawing-tool/drawing-tool.component.ts
index b76d00c4af..8d2e782154 100644
--- a/packages/integration/src/lib/draw/drawing-tool/drawing-tool.component.ts
+++ b/packages/integration/src/lib/draw/drawing-tool/drawing-tool.component.ts
@@ -19,7 +19,7 @@ import { DrawState } from '../draw.state';
@ToolComponent({
name: 'draw',
title: 'igo.integration.tools.draw',
- icon: 'draw'
+ icon: 'stylus_note'
})
@Component({
selector: 'igo-drawing-tool',
diff --git a/packages/integration/src/lib/filter/spatial-filter-tool/spatial-filter-tool.component.ts b/packages/integration/src/lib/filter/spatial-filter-tool/spatial-filter-tool.component.ts
index 6a07178367..b01534ad36 100644
--- a/packages/integration/src/lib/filter/spatial-filter-tool/spatial-filter-tool.component.ts
+++ b/packages/integration/src/lib/filter/spatial-filter-tool/spatial-filter-tool.component.ts
@@ -9,7 +9,12 @@ import {
} from '@angular/core';
import { MatIconRegistry } from '@angular/material/icon';
-import { EntityStore, PanelComponent, ToolComponent } from '@igo2/common';
+import {
+ EntityStore,
+ PanelComponent,
+ SELECTION_MARKER_ICON,
+ ToolComponent
+} from '@igo2/common';
import { LanguageService } from '@igo2/core/language';
import { MessageService } from '@igo2/core/message';
import {
@@ -62,7 +67,7 @@ import {
@ToolComponent({
name: 'spatialFilter',
title: 'igo.integration.tools.spatialFilter',
- icon: 'selection-marker'
+ icon: SELECTION_MARKER_ICON
})
/**
* Spatial Filter Type
diff --git a/packages/integration/src/lib/geometry-form/data-issue-reporter-tool/data-issue-reporter-tool.component.ts b/packages/integration/src/lib/geometry-form/data-issue-reporter-tool/data-issue-reporter-tool.component.ts
index a79c7a2d2e..2f18b6cd74 100644
--- a/packages/integration/src/lib/geometry-form/data-issue-reporter-tool/data-issue-reporter-tool.component.ts
+++ b/packages/integration/src/lib/geometry-form/data-issue-reporter-tool/data-issue-reporter-tool.component.ts
@@ -24,7 +24,7 @@ interface DataIssueReporterData {
@ToolComponent({
name: 'dataIssueReporter',
title: 'igo.integration.tools.dataIssueReporter',
- icon: 'message-alert'
+ icon: 'feedback'
})
@Component({
selector: 'igo-issue-reporter-tool',
diff --git a/packages/integration/src/lib/import-export/import-export-tool/import-export-tool.component.ts b/packages/integration/src/lib/import-export/import-export-tool/import-export-tool.component.ts
index 32822d67f4..eb48ca457f 100644
--- a/packages/integration/src/lib/import-export/import-export-tool/import-export-tool.component.ts
+++ b/packages/integration/src/lib/import-export/import-export-tool/import-export-tool.component.ts
@@ -31,7 +31,7 @@ import {
@ToolComponent({
name: 'importExport',
title: 'igo.integration.tools.importExport',
- icon: 'file-move'
+ icon: 'file_save'
})
@Component({
selector: 'igo-import-export-tool',
diff --git a/packages/integration/src/lib/map/advanced-map-tool/advanced-coordinates/advanced-coordinates.component.html b/packages/integration/src/lib/map/advanced-map-tool/advanced-coordinates/advanced-coordinates.component.html
index 44f4ecc03a..71089970ca 100644
--- a/packages/integration/src/lib/map/advanced-map-tool/advanced-coordinates/advanced-coordinates.component.html
+++ b/packages/integration/src/lib/map/advanced-map-tool/advanced-coordinates/advanced-coordinates.component.html
@@ -72,7 +72,7 @@
class="igo-form-button-group advanced-coordinates__copy-coordinates"
(click)="copyTextToClipboard()"
>
- content_copy
diff --git a/packages/integration/src/lib/map/advanced-map-tool/advanced-map-tool.component.ts b/packages/integration/src/lib/map/advanced-map-tool/advanced-map-tool.component.ts
index caa1cec2ac..95bd80715c 100644
--- a/packages/integration/src/lib/map/advanced-map-tool/advanced-map-tool.component.ts
+++ b/packages/integration/src/lib/map/advanced-map-tool/advanced-map-tool.component.ts
@@ -14,7 +14,7 @@ import { AdvancedSwipeComponent } from './advanced-swipe/advanced-swipe.componen
@ToolComponent({
name: 'advancedMap',
title: 'igo.integration.tools.advancedMap',
- icon: 'toolbox'
+ icon: 'home_repair_service'
})
/**
* Tool to handle the advanced map tools
diff --git a/packages/integration/src/lib/map/advanced-map-tool/advanced-swipe/advanced-swipe.component.html b/packages/integration/src/lib/map/advanced-map-tool/advanced-swipe/advanced-swipe.component.html
index 8e51c62424..1ecec452e7 100644
--- a/packages/integration/src/lib/map/advanced-map-tool/advanced-swipe/advanced-swipe.component.html
+++ b/packages/integration/src/lib/map/advanced-map-tool/advanced-swipe/advanced-swipe.component.html
@@ -46,7 +46,7 @@
}}
- search
- library_add
- star
- content_copy
{{
diff --git a/packages/integration/src/lib/map/map-proximity-tool/map-proximity-tool.component.ts b/packages/integration/src/lib/map/map-proximity-tool/map-proximity-tool.component.ts
index e23f2e081e..7e8549196e 100644
--- a/packages/integration/src/lib/map/map-proximity-tool/map-proximity-tool.component.ts
+++ b/packages/integration/src/lib/map/map-proximity-tool/map-proximity-tool.component.ts
@@ -26,7 +26,7 @@ import { MapState } from '../map.state';
@ToolComponent({
name: 'map-proximity',
title: 'igo.integration.tools.closestFeature',
- icon: 'radius'
+ icon: 'output_circle'
})
/**
* Tool to handle the advanced map tools
diff --git a/packages/integration/src/lib/measure/measurer-tool/measurer-tool.component.ts b/packages/integration/src/lib/measure/measurer-tool/measurer-tool.component.ts
index 1c2ce1d854..a54dc2364b 100644
--- a/packages/integration/src/lib/measure/measurer-tool/measurer-tool.component.ts
+++ b/packages/integration/src/lib/measure/measurer-tool/measurer-tool.component.ts
@@ -17,7 +17,7 @@ import { MeasureState } from '../measure.state';
@ToolComponent({
name: 'measurer',
title: 'igo.integration.tools.measurer',
- icon: 'ruler'
+ icon: 'square_foot'
})
@Component({
selector: 'igo-measurer-tool',
diff --git a/packages/integration/src/lib/print/print-tool/print-tool.component.ts b/packages/integration/src/lib/print/print-tool/print-tool.component.ts
index 1995ec6c51..9e0455cb58 100644
--- a/packages/integration/src/lib/print/print-tool/print-tool.component.ts
+++ b/packages/integration/src/lib/print/print-tool/print-tool.component.ts
@@ -8,7 +8,7 @@ import { MapState } from '../../map/map.state';
@ToolComponent({
name: 'print',
title: 'igo.integration.tools.print',
- icon: 'printer'
+ icon: 'print'
})
@Component({
selector: 'igo-print-tool',
diff --git a/packages/integration/src/lib/search/search-results-tool/search-results-tool.component.html b/packages/integration/src/lib/search/search-results-tool/search-results-tool.component.html
index ea40723b08..b563f7e28d 100644
--- a/packages/integration/src/lib/search/search-results-tool/search-results-tool.component.html
+++ b/packages/integration/src/lib/search/search-results-tool/search-results-tool.component.html
@@ -74,11 +74,11 @@
class="igo-icon-button"
(click)="toggleTopPanel()"
>
- {{
+ (topPanelState$ | async) === 'collapsed'
+ ? 'arrow_upward'
+ : 'arrow_downward'
+ }}
{
@@ -103,7 +103,7 @@ export function getWorkspaceActions(
},
{
id: 'featureDownload',
- icon: 'file-export',
+ icon: 'file_save',
title: 'igo.integration.workspace.download.title',
tooltip: 'igo.integration.workspace.download.tooltip',
handler: (ws: FeatureWorkspace | WfsWorkspace | EditionWorkspace) => {
@@ -129,7 +129,7 @@ export function getWorkspaceActions(
},
{
id: 'ogcFilter',
- icon: 'filter',
+ icon: 'filter_alt',
title: 'igo.integration.workspace.ogcFilter.title',
tooltip: 'igo.integration.workspace.ogcFilter.tooltip',
handler: (
@@ -179,7 +179,7 @@ export function getWorkspaceActions(
},
{
id: 'print',
- icon: 'printer',
+ icon: 'print',
title: 'igo.integration.workspace.print.title',
tooltip: 'igo.integration.workspace.print.tooltip',
handler: (ws: FeatureWorkspace | WfsWorkspace | EditionWorkspace) => {
diff --git a/packages/integration/src/lib/workspace/workspace-button/workspace-button.component.html b/packages/integration/src/lib/workspace/workspace-button/workspace-button.component.html
index af35f7b9cd..bb6432d0a1 100644
--- a/packages/integration/src/lib/workspace/workspace-button/workspace-button.component.html
+++ b/packages/integration/src/lib/workspace/workspace-button/workspace-button.component.html
@@ -7,5 +7,5 @@
[color]="color"
(click)="activateWorkspace()"
>
- table
diff --git a/packages/integration/src/locale/en.integration.json b/packages/integration/src/locale/en.integration.json
index 153e4ed39b..27db49428e 100644
--- a/packages/integration/src/locale/en.integration.json
+++ b/packages/integration/src/locale/en.integration.json
@@ -47,7 +47,7 @@
},
"aboutTool": {
"headerHtml": "",
- "html": " Features overview Search Bar Located in the upper-left portion of the interface, the Search Bar allows the user to locate an area of interest using an address, location or GPS coordinates. It can also be used to search for a layer.
It is also possible to search for a specific element using the hashtag \"#\" (for example, #municipalites québec). Accents and capital letters don't have any impact on Search Results when using a hashtag.
Contexts Contexts are used to visualize groupings of layers related to a specific theme. When a context is selected, all the layers associated with it will be added to the Map. It is then possible to add other layers to the map by using the Catalog or the Search Bar.
WARNING : If a new context is selected, all the layers displayed on the Map will be replaced by the ones associated with the newly selected context.
Map It is possible to personalize the Map by using the Catalog or the Search Bar. This space allows the user to add, delete, interrogate, filter and sort the displayed layers. It is also possible to visualize the legends associated with the layers.
Spatial Filter The Spatial Filter can be used to search for adresses or themes by specifying a predefined zone (for example, electoral districts) or by drawing an area on the map. The results can then be exported by using the Import & Export tool.
Measure This tool gives the option to either Measure distances or areas on the map.
A Drawings layer can be exported by using the Import & Export tool.
Directions It is possible to build a route and get Directions between two points by placing them on the map or by searching for addresses. It is also possible to add stops and copy the description or the link of the route to the clipboard.
Catalog The Catalog contains all the layers that can be added to the Map. Click on the + of desired layer to add it.
Import & Export It is possible to Import vector data by specifying a coordinate system or a projection.
It is possible to Export one or many layers in multiple formats.
It is also possible to Import or Export a context locally. This feature is useful to save contexts when the user is not authenticated.
Print This tool is used to Print the map displayed on-screen. Multiple options can be specified like a title, a comment, the output format, the paper size and the orientation.
Share The Share tool is used to create an URL that redirects to an exact representation of the map. This link can be shared or distributed in a document and allows the user to \"save\" the map for later use.
IGO2 is a open source geospatial solution developed by collaborators and specialists from several departments and agencies of the Government of Quebec.
Version: {{version}}
",
+ "html": " Features overview Search BarLocated in the upper-left portion of the interface, the Search Bar allows the user to locate an area of interest using an address, location or GPS coordinates. It can also be used to search for a layer.
It is also possible to search for a specific element using the hashtag \"#\" (for example, #municipalites québec). Accents and capital letters don't have any impact on Search Results when using a hashtag.
Context Contexts are used to visualize groupings of layers related to a specific theme. When a context is selected, all the layers associated with it will be added to the Map. It is then possible to add other layers to the map by using the Catalog or the Search Bar.
WARNING : If a new context is selected, all the layers displayed on the Map will be replaced by the ones associated with the newly selected context.
MapIt is possible to personalize the Map by using the Catalog or the Search Bar. This space allows the user to add, delete, interrogate, filter and sort the displayed layers. It is also possible to visualize the legends associated with the layers.
Spatial Filter The Spatial Filter can be used to search for adresses or themes by specifying a predefined zone (for example, electoral districts) or by drawing an area on the map. The results can then be exported by using the Import & Export tool.
MeasureThis tool gives the option to either Measure distances or areas on the map.
Draw The Draw tool can be used to draw points, lines, polygons or circles with labels. The color of the fill and the stroke can be set with the given selectors.
A Drawings layer can be exported by using the Import & Export tool.
Directions It is possible to build a route and get Directions between two points by placing them on the map or by searching for addresses. It is also possible to add stops and copy the description or the link of the route to the clipboard.
Catalog The Catalog contains all the layers that can be added to the Map. Click on the + of desired layer to add it.
Import & Export It is possible to Import vector data by specifying a coordinate system or a projection.
It is possible to Export one or many layers in multiple formats.
It is also possible to Import or Export a context locally. This feature is useful to save contexts when the user is not authenticated.
PrintThis tool is used to Print the map displayed on-screen. Multiple options can be specified like a title, a comment, the output format, the paper size and the orientation.
Share The Share tool is used to create an URL that redirects to an exact representation of the map. This link can be shared or distributed in a document and allows the user to \"save\" the map for later use.
IGO2 is a open source geospatial solution developed by collaborators and specialists from several departments and agencies of the Government of Quebec.
Version: {{version}}
",
"trainingGuide": "Training guide",
"trainingGuideTooltip": "Click here to access IGO2's self-training guide"
},
diff --git a/packages/integration/src/locale/fr.integration.json b/packages/integration/src/locale/fr.integration.json
index 359a8f9f61..c869c11bde 100644
--- a/packages/integration/src/locale/fr.integration.json
+++ b/packages/integration/src/locale/fr.integration.json
@@ -47,7 +47,7 @@
},
"aboutTool": {
"headerHtml": "",
- "html": " Aperçu des fonctionnalités Recherche Située dans la portion supérieure gauche de l’interface, la barre de Recherche permet de se positionner à l’aide d’une adresse, d’un lieu ou de coordonnées GPS et peut également servir à rechercher une couche.
Il est également possible de rechercher un élément par type de résultats en utilisant le hashtag « # » (par exemple, #municipalites québec). Les accents et les lettres majuscules n'importent pas lors de l'utilisation du hashtag et n'ont pas d'impact sur les Résultats de recherche.
Contextes Les Contextes permettent de visualiser des regroupements de couches faits par thème ou par contexte de travail. Lorsqu'un contexte est sélectionné, toutes les couches qu'il contient se retrouvent alors dans la Carte. Il est possible d'ajouter d’autres couches à partir du Catalogue ou de l’outil Recherche.
ATTENTION : Si un nouveau contexte est sélectionné, toutes les couches affichées dans la Carte seront remplacées par celles de ce nouveau contexte.
Carte Il est possible de personnaliser la Carte à partir du Catalogue ou de l’outil Recherche. Cet espace permet entre autres d’ajouter, de supprimer, d’interroger, de filtrer et de trier les couches présentées. Il est également possible d'afficher les légendes des couches.
Mesurer Cet outil permet de Mesurer des distances ou des superficies directement sur la carte.
Une couche Dessins peut être exportée à l'aide de l'outil Importer et exporter.
Itinéraire Il est possible de construire un Itinéraire entre deux points en sélectionnant un point de départ et un point d'arrivée dans la carte ou en recherchant des adresses. Il est ensuite possible d'ajouter des points d'arrêt intermédiaires et de copier la description ou le lien de l'itinéraire dans le presse-papier.
Catalogue Le Catalogue contient toutes les couches qui peuvent être ajoutées à la Carte. L'utilisateur doit cliquer sur + de la couche désirée afin de l’ajouter à la Carte.
Importer et exporter Il est possible d'Importer un fichier vectoriel tout en spécifiant un système de coordonnées ou une projection.
Il est possible d'Exporter une ou plusieurs couches dans plusieurs formats courants.
Il est également possible d'Importer ou d'Exporter un contexte localement. Cette dernière fonctionnalité permet ainsi de sauvegarder des contextes en mode non-authentifié ou anonyme.
Imprimer Cet outil permet d'Imprimer la carte affichée à l’écran en spécifiant plusieurs options telles qu'un titre, un commentaire, le format de sortie, le format du papier et l'orientation de l'impression.
Partager L'outil Partager permet de créer une adresse URL qui redirige vers une représentation exacte de la Carte affichée à l’écran. Ce lien peut, par exemple, être partagé ou diffusé dans un document, permettant ainsi de « sauvegarder » la carte pour une utilisation ultérieure.
IGO2 est une solution Web libre géomatique développée en mode collaboratif par des spécialistes provenant de plusieurs ministères et organismes du gouvernement du Québec.
Version: {{version}}
",
+ "html": " Aperçu des fonctionnalités Recherche Située dans la portion supérieure gauche de l’interface, la barre de Recherche permet de se positionner à l’aide d’une adresse, d’un lieu ou de coordonnées GPS et peut également servir à rechercher une couche.
Il est également possible de rechercher un élément par type de résultats en utilisant le hashtag « # » (par exemple, #municipalites québec). Les accents et les lettres majuscules n'importent pas lors de l'utilisation du hashtag et n'ont pas d'impact sur les Résultats de recherche.
Contextes Les Contextes permettent de visualiser des regroupements de couches faits par thème ou par contexte de travail. Lorsqu'un contexte est sélectionné, toutes les couches qu'il contient se retrouvent alors dans la Carte. Il est possible d'ajouter d’autres couches à partir du Catalogue ou de l’outil Recherche.
ATTENTION : Si un nouveau contexte est sélectionné, toutes les couches affichées dans la Carte seront remplacées par celles de ce nouveau contexte.
Carte Il est possible de personnaliser la Carte à partir du Catalogue ou de l’outil Recherche. Cet espace permet entre autres d’ajouter, de supprimer, d’interroger, de filtrer et de trier les couches présentées. Il est également possible d'afficher les légendes des couches.
Filtre spatial Le Filtre spatial permet de rechercher des adresses ou des thématiques selon des zones prédéfinies (par exemple, par arrondissement ou par MRC) ou selon un dessin réalisé par l'utilisateur. Les résultats du filtre peuvent être exportés à l'aide de l'outil Importer et exporter.
Mesurer Cet outil permet de Mesurer des distances ou des superficies directement sur la carte.
Dessin L'outil Dessin permet de dessiner des entités ponctuelles, linéaires, polygonales ou circulaires accompagnées ou non d'étiquettes. La couleur de remplissage et du contour des entités peuvent être choisies à l'aide des sélecteurs correspondants.
Une couche Dessins peut être exportée à l'aide de l'outil Importer et exporter.
Itinéraire Il est possible de construire un Itinéraire entre deux points en sélectionnant un point de départ et un point d'arrivée dans la carte ou en recherchant des adresses. Il est ensuite possible d'ajouter des points d'arrêt intermédiaires et de copier la description ou le lien de l'itinéraire dans le presse-papier.
Catalogue Le Catalogue contient toutes les couches qui peuvent être ajoutées à la Carte. L'utilisateur doit cliquer sur + de la couche désirée afin de l’ajouter à la Carte.
Importer et exporter Il est possible d'Importer un fichier vectoriel tout en spécifiant un système de coordonnées ou une projection.
Il est possible d'Exporter une ou plusieurs couches dans plusieurs formats courants.
Il est également possible d'Importer ou d'Exporter un contexte localement. Cette dernière fonctionnalité permet ainsi de sauvegarder des contextes en mode non-authentifié ou anonyme.
Imprimer Cet outil permet d'Imprimer la carte affichée à l’écran en spécifiant plusieurs options telles qu'un titre, un commentaire, le format de sortie, le format du papier et l'orientation de l'impression.
Partager L'outil Partager permet de créer une adresse URL qui redirige vers une représentation exacte de la Carte affichée à l’écran. Ce lien peut, par exemple, être partagé ou diffusé dans un document, permettant ainsi de « sauvegarder » la carte pour une utilisation ultérieure.
IGO2 est une solution Web libre géomatique développée en mode collaboratif par des spécialistes provenant de plusieurs ministères et organismes du gouvernement du Québec.
Version: {{version}}
",
"trainingGuide": "Guide de formation",
"trainingGuideTooltip": "Cliquez ici pour accéder au guide d'autoformation de IGO2"
},
diff --git a/projects/demo/src/app/app.component.html b/projects/demo/src/app/app.component.html
index a2fe073692..ae2c32407a 100644
--- a/projects/demo/src/app/app.component.html
+++ b/projects/demo/src/app/app.component.html
@@ -1,7 +1,7 @@
{{ title }}
{{ version.lib }}
diff --git a/projects/demo/src/app/common/action/action.component.ts b/projects/demo/src/app/common/action/action.component.ts
index b567038c7c..3a48a8053c 100644
--- a/projects/demo/src/app/common/action/action.component.ts
+++ b/projects/demo/src/app/common/action/action.component.ts
@@ -40,7 +40,7 @@ export class AppActionComponent implements OnInit, OnDestroy {
{
id: 'add',
title: 'Add',
- icon: 'plus',
+ icon: 'add',
tooltip: 'Add Tooltip',
handler: () => {
alert('Add!');
@@ -50,7 +50,7 @@ export class AppActionComponent implements OnInit, OnDestroy {
{
id: 'edit',
title: 'Edit',
- icon: 'pencil',
+ icon: 'edit',
tooltip: 'Edit Tooltip',
args: ['1'],
handler: (item: string) => {
diff --git a/projects/demo/src/app/common/common.routing.ts b/projects/demo/src/app/common/common.routing.ts
index f7635e29b0..7cb2b1f0dd 100644
--- a/projects/demo/src/app/common/common.routing.ts
+++ b/projects/demo/src/app/common/common.routing.ts
@@ -6,6 +6,7 @@ import { AppDynamicComponentComponent } from './dynamic-component/dynamic-compon
import { AppEntitySelectorComponent } from './entity-selector/entity-selector.component';
import { AppEntityTableComponent } from './entity-table/entity-table.component';
import { AppFormComponent } from './form/form.component';
+import { AppIconComponent } from './icon/icon.component';
import { AppTableComponent } from './table/table.component';
import { AppToolComponent } from './tool/tool.component';
import { AppWidgetComponent } from './widget/widget.component';
@@ -38,10 +39,15 @@ export const routes: Routes = [
component: AppEntitySelectorComponent
},
{
- title: 'form',
- path: 'Form',
+ title: 'Form',
+ path: 'form',
component: AppFormComponent
},
+ {
+ title: 'Icon',
+ path: 'icon',
+ component: AppIconComponent
+ },
{
title: 'Table',
path: 'table',
diff --git a/projects/demo/src/app/common/entity-table/entity-table.component.ts b/projects/demo/src/app/common/entity-table/entity-table.component.ts
index bb857e2826..709744c06f 100644
--- a/projects/demo/src/app/common/entity-table/entity-table.component.ts
+++ b/projects/demo/src/app/common/entity-table/entity-table.component.ts
@@ -44,8 +44,8 @@ export class AppEntityTableComponent implements OnInit, OnDestroy {
title: 'Selected',
valueAccessor: (entity: object) => {
return this.store.state.get(entity).selected
- ? 'radiobox-marked'
- : 'radiobox-blank';
+ ? 'radio_button_checked'
+ : 'radio_button_unchecked';
},
renderer: EntityTableColumnRenderer.Icon
},
diff --git a/projects/demo/src/app/common/icon/icon.component.html b/projects/demo/src/app/common/icon/icon.component.html
new file mode 100644
index 0000000000..c37c7b2da1
--- /dev/null
+++ b/projects/demo/src/app/common/icon/icon.component.html
@@ -0,0 +1,51 @@
+
+
+
+ The icon is a core concept for many packages of the IGO2
+ library. The icon system is base on
+ Google Font - Material Symbol
+ who use font ligature to configure the icon
+
+
+
+
+ Getting started
+
+ -
+ In your
+
index.html
+ file, add the variable font stylesheet request to your head tag and
+ {{exampleIndexHtml}}
+
+ -
+ Then add the current class with variable axes configuration to icons in
+ your
style.scss file.
+ {{exampleStyleVariable}}
+
+ -
+ Finally, add the icon provider configuration in your main file
+
main.ts
+ {{exampleProvider}}
+
+
+
+
+
+
+ Enter a name from the
+ Google Font - Material Symbol
+
+
+
+ Icon Name
+
+
+
+
diff --git a/projects/demo/src/app/common/icon/icon.component.scss b/projects/demo/src/app/common/icon/icon.component.scss
new file mode 100644
index 0000000000..acfae0abde
--- /dev/null
+++ b/projects/demo/src/app/common/icon/icon.component.scss
@@ -0,0 +1,4 @@
+.field-container {
+ display: flex;
+ align-items: center;
+}
diff --git a/projects/demo/src/app/common/icon/icon.component.spec.ts b/projects/demo/src/app/common/icon/icon.component.spec.ts
new file mode 100644
index 0000000000..061015a1cc
--- /dev/null
+++ b/projects/demo/src/app/common/icon/icon.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+
+import { AppIconComponent } from './icon.component';
+
+describe('AppIconComponent', () => {
+ let component: AppIconComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [AppIconComponent, NoopAnimationsModule]
+ }).compileComponents();
+
+ fixture = TestBed.createComponent(AppIconComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/projects/demo/src/app/common/icon/icon.component.ts b/projects/demo/src/app/common/icon/icon.component.ts
new file mode 100644
index 0000000000..5d67bef16a
--- /dev/null
+++ b/projects/demo/src/app/common/icon/icon.component.ts
@@ -0,0 +1,50 @@
+import { Component } from '@angular/core';
+import { FormControl, ReactiveFormsModule } from '@angular/forms';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatInputModule } from '@angular/material/input';
+
+import { IgoIconComponent } from '@igo2/common';
+
+import { DocViewerComponent } from '../../components/doc-viewer/doc-viewer.component';
+import { ExampleViewerComponent } from '../../components/example/example-viewer/example-viewer.component';
+
+@Component({
+ selector: 'app-icon',
+ standalone: true,
+ imports: [
+ DocViewerComponent,
+ ExampleViewerComponent,
+ IgoIconComponent,
+ MatFormFieldModule,
+ ReactiveFormsModule,
+ MatInputModule
+ ],
+ templateUrl: './icon.component.html',
+ styleUrl: './icon.component.scss'
+})
+export class AppIconComponent {
+ exampleIndexHtml: string = EXAMPLE_INDEX_HTML;
+ exampleStyleVariable: string = EXAMPLE_STYLE_VARIABLE;
+ exampleProvider: string = EXAMPLE_PROVIDER;
+
+ nameControl = new FormControl('shopping_cart_checkout');
+}
+
+const EXAMPLE_INDEX_HTML = ``;
+
+const EXAMPLE_STYLE_VARIABLE = `.material-symbols-outlined {
+ font-variation-settings:
+ 'FILL' 0,
+ 'wght' 400,
+ 'GRAD' 0,
+ 'opsz' 24
+}`;
+
+const EXAMPLE_PROVIDER = `import { provideIcon } from '@igo2/common';
+
+bootstrapApplication(AppComponent, {
+ providers: [
+ provideIcon(),
+ ]
+})
+`;
diff --git a/projects/demo/src/app/common/table/table.component.ts b/projects/demo/src/app/common/table/table.component.ts
index c9a1f2608d..1a9d7fda82 100644
--- a/projects/demo/src/app/common/table/table.component.ts
+++ b/projects/demo/src/app/common/table/table.component.ts
@@ -43,7 +43,7 @@ export class AppTableComponent implements OnInit {
],
actions: [
{
- icon: 'file-document',
+ icon: 'description',
color: TableActionColor.primary,
click: (row) => this.showName(row.name)
}
diff --git a/projects/demo/src/app/common/tool/tool.component.html b/projects/demo/src/app/common/tool/tool.component.html
index f150879c61..639ee92dfd 100644
--- a/projects/demo/src/app/common/tool/tool.component.html
+++ b/projects/demo/src/app/common/tool/tool.component.html
@@ -7,7 +7,7 @@
(click)="toolbox.activatePreviousTool()"
*ngIf="activeTool$ | async"
>
- arrow_back
- code-tags
- settings
diff --git a/projects/demo/src/index.html b/projects/demo/src/index.html
index 1d3f410c63..05a1b0cee1 100644
--- a/projects/demo/src/index.html
+++ b/projects/demo/src/index.html
@@ -13,6 +13,10 @@
href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;600;700&display=swap"
rel="stylesheet"
/>
+
-
-
+ border_color
{{ 'igo.geo.style.stroke' | translate }}
description
diff --git a/packages/integration/src/lib/about/about-tool/about-tool.component.ts b/packages/integration/src/lib/about/about-tool/about-tool.component.ts
index 021a53b9ea..724510f192 100644
--- a/packages/integration/src/lib/about/about-tool/about-tool.component.ts
+++ b/packages/integration/src/lib/about/about-tool/about-tool.component.ts
@@ -24,7 +24,7 @@ import { AllEnvironmentOptions } from '../../environment';
@ToolComponent({
name: 'about',
title: 'igo.integration.tools.about',
- icon: 'help-circle'
+ icon: 'help'
})
@Component({
selector: 'igo-about-tool',
diff --git a/packages/integration/src/lib/catalog/catalog-browser-tool/catalog-browser-tool.component.ts b/packages/integration/src/lib/catalog/catalog-browser-tool/catalog-browser-tool.component.ts
index 76c37ef2b2..5821707c50 100644
--- a/packages/integration/src/lib/catalog/catalog-browser-tool/catalog-browser-tool.component.ts
+++ b/packages/integration/src/lib/catalog/catalog-browser-tool/catalog-browser-tool.component.ts
@@ -30,7 +30,6 @@ import { CatalogState } from '../catalog.state';
@ToolComponent({
name: 'catalogBrowser',
title: 'igo.integration.tools.catalog',
- icon: 'photo-browser',
parent: 'catalog'
})
@Component({
diff --git a/packages/integration/src/lib/catalog/catalog-library-tool/catalog-library-tool.component.ts b/packages/integration/src/lib/catalog/catalog-library-tool/catalog-library-tool.component.ts
index 093ad3f762..3270b1847c 100644
--- a/packages/integration/src/lib/catalog/catalog-library-tool/catalog-library-tool.component.ts
+++ b/packages/integration/src/lib/catalog/catalog-library-tool/catalog-library-tool.component.ts
@@ -21,7 +21,7 @@ import { CatalogState } from '../catalog.state';
@ToolComponent({
name: 'catalog',
title: 'igo.integration.tools.catalog',
- icon: 'layers-plus'
+ icon: 'library_add'
})
@Component({
selector: 'igo-catalog-library-tool',
diff --git a/packages/integration/src/lib/context/context-share-tool/context-share-tool.component.ts b/packages/integration/src/lib/context/context-share-tool/context-share-tool.component.ts
index a81740f818..57ec7fbc7e 100644
--- a/packages/integration/src/lib/context/context-share-tool/context-share-tool.component.ts
+++ b/packages/integration/src/lib/context/context-share-tool/context-share-tool.component.ts
@@ -10,7 +10,7 @@ import { MapState } from '../../map/map.state';
@ToolComponent({
name: 'shareMap',
title: 'igo.integration.tools.shareMap',
- icon: 'share-variant'
+ icon: 'share'
})
@Component({
selector: 'igo-context-share-tool',
diff --git a/packages/integration/src/lib/draw/drawing-tool/drawing-tool.component.ts b/packages/integration/src/lib/draw/drawing-tool/drawing-tool.component.ts
index b76d00c4af..8d2e782154 100644
--- a/packages/integration/src/lib/draw/drawing-tool/drawing-tool.component.ts
+++ b/packages/integration/src/lib/draw/drawing-tool/drawing-tool.component.ts
@@ -19,7 +19,7 @@ import { DrawState } from '../draw.state';
@ToolComponent({
name: 'draw',
title: 'igo.integration.tools.draw',
- icon: 'draw'
+ icon: 'stylus_note'
})
@Component({
selector: 'igo-drawing-tool',
diff --git a/packages/integration/src/lib/filter/spatial-filter-tool/spatial-filter-tool.component.ts b/packages/integration/src/lib/filter/spatial-filter-tool/spatial-filter-tool.component.ts
index 6a07178367..b01534ad36 100644
--- a/packages/integration/src/lib/filter/spatial-filter-tool/spatial-filter-tool.component.ts
+++ b/packages/integration/src/lib/filter/spatial-filter-tool/spatial-filter-tool.component.ts
@@ -9,7 +9,12 @@ import {
} from '@angular/core';
import { MatIconRegistry } from '@angular/material/icon';
-import { EntityStore, PanelComponent, ToolComponent } from '@igo2/common';
+import {
+ EntityStore,
+ PanelComponent,
+ SELECTION_MARKER_ICON,
+ ToolComponent
+} from '@igo2/common';
import { LanguageService } from '@igo2/core/language';
import { MessageService } from '@igo2/core/message';
import {
@@ -62,7 +67,7 @@ import {
@ToolComponent({
name: 'spatialFilter',
title: 'igo.integration.tools.spatialFilter',
- icon: 'selection-marker'
+ icon: SELECTION_MARKER_ICON
})
/**
* Spatial Filter Type
diff --git a/packages/integration/src/lib/geometry-form/data-issue-reporter-tool/data-issue-reporter-tool.component.ts b/packages/integration/src/lib/geometry-form/data-issue-reporter-tool/data-issue-reporter-tool.component.ts
index a79c7a2d2e..2f18b6cd74 100644
--- a/packages/integration/src/lib/geometry-form/data-issue-reporter-tool/data-issue-reporter-tool.component.ts
+++ b/packages/integration/src/lib/geometry-form/data-issue-reporter-tool/data-issue-reporter-tool.component.ts
@@ -24,7 +24,7 @@ interface DataIssueReporterData {
@ToolComponent({
name: 'dataIssueReporter',
title: 'igo.integration.tools.dataIssueReporter',
- icon: 'message-alert'
+ icon: 'feedback'
})
@Component({
selector: 'igo-issue-reporter-tool',
diff --git a/packages/integration/src/lib/import-export/import-export-tool/import-export-tool.component.ts b/packages/integration/src/lib/import-export/import-export-tool/import-export-tool.component.ts
index 32822d67f4..eb48ca457f 100644
--- a/packages/integration/src/lib/import-export/import-export-tool/import-export-tool.component.ts
+++ b/packages/integration/src/lib/import-export/import-export-tool/import-export-tool.component.ts
@@ -31,7 +31,7 @@ import {
@ToolComponent({
name: 'importExport',
title: 'igo.integration.tools.importExport',
- icon: 'file-move'
+ icon: 'file_save'
})
@Component({
selector: 'igo-import-export-tool',
diff --git a/packages/integration/src/lib/map/advanced-map-tool/advanced-coordinates/advanced-coordinates.component.html b/packages/integration/src/lib/map/advanced-map-tool/advanced-coordinates/advanced-coordinates.component.html
index 44f4ecc03a..71089970ca 100644
--- a/packages/integration/src/lib/map/advanced-map-tool/advanced-coordinates/advanced-coordinates.component.html
+++ b/packages/integration/src/lib/map/advanced-map-tool/advanced-coordinates/advanced-coordinates.component.html
@@ -72,7 +72,7 @@
class="igo-form-button-group advanced-coordinates__copy-coordinates"
(click)="copyTextToClipboard()"
>
- content_copy
diff --git a/packages/integration/src/lib/map/advanced-map-tool/advanced-map-tool.component.ts b/packages/integration/src/lib/map/advanced-map-tool/advanced-map-tool.component.ts
index caa1cec2ac..95bd80715c 100644
--- a/packages/integration/src/lib/map/advanced-map-tool/advanced-map-tool.component.ts
+++ b/packages/integration/src/lib/map/advanced-map-tool/advanced-map-tool.component.ts
@@ -14,7 +14,7 @@ import { AdvancedSwipeComponent } from './advanced-swipe/advanced-swipe.componen
@ToolComponent({
name: 'advancedMap',
title: 'igo.integration.tools.advancedMap',
- icon: 'toolbox'
+ icon: 'home_repair_service'
})
/**
* Tool to handle the advanced map tools
diff --git a/packages/integration/src/lib/map/advanced-map-tool/advanced-swipe/advanced-swipe.component.html b/packages/integration/src/lib/map/advanced-map-tool/advanced-swipe/advanced-swipe.component.html
index 8e51c62424..1ecec452e7 100644
--- a/packages/integration/src/lib/map/advanced-map-tool/advanced-swipe/advanced-swipe.component.html
+++ b/packages/integration/src/lib/map/advanced-map-tool/advanced-swipe/advanced-swipe.component.html
@@ -46,7 +46,7 @@
}}
class="igo-icon-button"
(click)="toggleTopPanel()"
>
- {{
+ (topPanelState$ | async) === 'collapsed'
+ ? 'arrow_upward'
+ : 'arrow_downward'
+ }}
{
@@ -103,7 +103,7 @@ export function getWorkspaceActions(
},
{
id: 'featureDownload',
- icon: 'file-export',
+ icon: 'file_save',
title: 'igo.integration.workspace.download.title',
tooltip: 'igo.integration.workspace.download.tooltip',
handler: (ws: FeatureWorkspace | WfsWorkspace | EditionWorkspace) => {
@@ -129,7 +129,7 @@ export function getWorkspaceActions(
},
{
id: 'ogcFilter',
- icon: 'filter',
+ icon: 'filter_alt',
title: 'igo.integration.workspace.ogcFilter.title',
tooltip: 'igo.integration.workspace.ogcFilter.tooltip',
handler: (
@@ -179,7 +179,7 @@ export function getWorkspaceActions(
},
{
id: 'print',
- icon: 'printer',
+ icon: 'print',
title: 'igo.integration.workspace.print.title',
tooltip: 'igo.integration.workspace.print.tooltip',
handler: (ws: FeatureWorkspace | WfsWorkspace | EditionWorkspace) => {
diff --git a/packages/integration/src/lib/workspace/workspace-button/workspace-button.component.html b/packages/integration/src/lib/workspace/workspace-button/workspace-button.component.html
index af35f7b9cd..bb6432d0a1 100644
--- a/packages/integration/src/lib/workspace/workspace-button/workspace-button.component.html
+++ b/packages/integration/src/lib/workspace/workspace-button/workspace-button.component.html
@@ -7,5 +7,5 @@
[color]="color"
(click)="activateWorkspace()"
>
- table
diff --git a/packages/integration/src/locale/en.integration.json b/packages/integration/src/locale/en.integration.json
index 153e4ed39b..27db49428e 100644
--- a/packages/integration/src/locale/en.integration.json
+++ b/packages/integration/src/locale/en.integration.json
@@ -47,7 +47,7 @@
},
"aboutTool": {
"headerHtml": "",
- "html": " Features overview Search Bar Located in the upper-left portion of the interface, the Search Bar allows the user to locate an area of interest using an address, location or GPS coordinates. It can also be used to search for a layer.
It is also possible to search for a specific element using the hashtag \"#\" (for example, #municipalites québec). Accents and capital letters don't have any impact on Search Results when using a hashtag.
Contexts Contexts are used to visualize groupings of layers related to a specific theme. When a context is selected, all the layers associated with it will be added to the Map. It is then possible to add other layers to the map by using the Catalog or the Search Bar.
WARNING : If a new context is selected, all the layers displayed on the Map will be replaced by the ones associated with the newly selected context.
Map It is possible to personalize the Map by using the Catalog or the Search Bar. This space allows the user to add, delete, interrogate, filter and sort the displayed layers. It is also possible to visualize the legends associated with the layers.
Spatial Filter The Spatial Filter can be used to search for adresses or themes by specifying a predefined zone (for example, electoral districts) or by drawing an area on the map. The results can then be exported by using the Import & Export tool.
Measure This tool gives the option to either Measure distances or areas on the map.
A Drawings layer can be exported by using the Import & Export tool.
Directions It is possible to build a route and get Directions between two points by placing them on the map or by searching for addresses. It is also possible to add stops and copy the description or the link of the route to the clipboard.
Catalog The Catalog contains all the layers that can be added to the Map. Click on the + of desired layer to add it.
Import & Export It is possible to Import vector data by specifying a coordinate system or a projection.
It is possible to Export one or many layers in multiple formats.
It is also possible to Import or Export a context locally. This feature is useful to save contexts when the user is not authenticated.
Print This tool is used to Print the map displayed on-screen. Multiple options can be specified like a title, a comment, the output format, the paper size and the orientation.
Share The Share tool is used to create an URL that redirects to an exact representation of the map. This link can be shared or distributed in a document and allows the user to \"save\" the map for later use.
IGO2 is a open source geospatial solution developed by collaborators and specialists from several departments and agencies of the Government of Quebec.
Version: {{version}}
",
+ "html": " Features overview Search BarLocated in the upper-left portion of the interface, the Search Bar allows the user to locate an area of interest using an address, location or GPS coordinates. It can also be used to search for a layer.
It is also possible to search for a specific element using the hashtag \"#\" (for example, #municipalites québec). Accents and capital letters don't have any impact on Search Results when using a hashtag.
Context Contexts are used to visualize groupings of layers related to a specific theme. When a context is selected, all the layers associated with it will be added to the Map. It is then possible to add other layers to the map by using the Catalog or the Search Bar.
WARNING : If a new context is selected, all the layers displayed on the Map will be replaced by the ones associated with the newly selected context.
MapIt is possible to personalize the Map by using the Catalog or the Search Bar. This space allows the user to add, delete, interrogate, filter and sort the displayed layers. It is also possible to visualize the legends associated with the layers.
Spatial Filter The Spatial Filter can be used to search for adresses or themes by specifying a predefined zone (for example, electoral districts) or by drawing an area on the map. The results can then be exported by using the Import & Export tool.
MeasureThis tool gives the option to either Measure distances or areas on the map.
Draw The Draw tool can be used to draw points, lines, polygons or circles with labels. The color of the fill and the stroke can be set with the given selectors.
A Drawings layer can be exported by using the Import & Export tool.
Directions It is possible to build a route and get Directions between two points by placing them on the map or by searching for addresses. It is also possible to add stops and copy the description or the link of the route to the clipboard.
Catalog The Catalog contains all the layers that can be added to the Map. Click on the + of desired layer to add it.
Import & Export It is possible to Import vector data by specifying a coordinate system or a projection.
It is possible to Export one or many layers in multiple formats.
It is also possible to Import or Export a context locally. This feature is useful to save contexts when the user is not authenticated.
PrintThis tool is used to Print the map displayed on-screen. Multiple options can be specified like a title, a comment, the output format, the paper size and the orientation.
Share The Share tool is used to create an URL that redirects to an exact representation of the map. This link can be shared or distributed in a document and allows the user to \"save\" the map for later use.
IGO2 is a open source geospatial solution developed by collaborators and specialists from several departments and agencies of the Government of Quebec.
Version: {{version}}
",
"trainingGuide": "Training guide",
"trainingGuideTooltip": "Click here to access IGO2's self-training guide"
},
diff --git a/packages/integration/src/locale/fr.integration.json b/packages/integration/src/locale/fr.integration.json
index 359a8f9f61..c869c11bde 100644
--- a/packages/integration/src/locale/fr.integration.json
+++ b/packages/integration/src/locale/fr.integration.json
@@ -47,7 +47,7 @@
},
"aboutTool": {
"headerHtml": "",
- "html": " Aperçu des fonctionnalités Recherche Située dans la portion supérieure gauche de l’interface, la barre de Recherche permet de se positionner à l’aide d’une adresse, d’un lieu ou de coordonnées GPS et peut également servir à rechercher une couche.
Il est également possible de rechercher un élément par type de résultats en utilisant le hashtag « # » (par exemple, #municipalites québec). Les accents et les lettres majuscules n'importent pas lors de l'utilisation du hashtag et n'ont pas d'impact sur les Résultats de recherche.
Contextes Les Contextes permettent de visualiser des regroupements de couches faits par thème ou par contexte de travail. Lorsqu'un contexte est sélectionné, toutes les couches qu'il contient se retrouvent alors dans la Carte. Il est possible d'ajouter d’autres couches à partir du Catalogue ou de l’outil Recherche.
ATTENTION : Si un nouveau contexte est sélectionné, toutes les couches affichées dans la Carte seront remplacées par celles de ce nouveau contexte.
Carte Il est possible de personnaliser la Carte à partir du Catalogue ou de l’outil Recherche. Cet espace permet entre autres d’ajouter, de supprimer, d’interroger, de filtrer et de trier les couches présentées. Il est également possible d'afficher les légendes des couches.
Mesurer Cet outil permet de Mesurer des distances ou des superficies directement sur la carte.
Une couche Dessins peut être exportée à l'aide de l'outil Importer et exporter.
Itinéraire Il est possible de construire un Itinéraire entre deux points en sélectionnant un point de départ et un point d'arrivée dans la carte ou en recherchant des adresses. Il est ensuite possible d'ajouter des points d'arrêt intermédiaires et de copier la description ou le lien de l'itinéraire dans le presse-papier.
Catalogue Le Catalogue contient toutes les couches qui peuvent être ajoutées à la Carte. L'utilisateur doit cliquer sur + de la couche désirée afin de l’ajouter à la Carte.
Importer et exporter Il est possible d'Importer un fichier vectoriel tout en spécifiant un système de coordonnées ou une projection.
Il est possible d'Exporter une ou plusieurs couches dans plusieurs formats courants.
Il est également possible d'Importer ou d'Exporter un contexte localement. Cette dernière fonctionnalité permet ainsi de sauvegarder des contextes en mode non-authentifié ou anonyme.
Imprimer Cet outil permet d'Imprimer la carte affichée à l’écran en spécifiant plusieurs options telles qu'un titre, un commentaire, le format de sortie, le format du papier et l'orientation de l'impression.
Partager L'outil Partager permet de créer une adresse URL qui redirige vers une représentation exacte de la Carte affichée à l’écran. Ce lien peut, par exemple, être partagé ou diffusé dans un document, permettant ainsi de « sauvegarder » la carte pour une utilisation ultérieure.
IGO2 est une solution Web libre géomatique développée en mode collaboratif par des spécialistes provenant de plusieurs ministères et organismes du gouvernement du Québec.
Version: {{version}}
",
+ "html": " Aperçu des fonctionnalités Recherche Située dans la portion supérieure gauche de l’interface, la barre de Recherche permet de se positionner à l’aide d’une adresse, d’un lieu ou de coordonnées GPS et peut également servir à rechercher une couche.
Il est également possible de rechercher un élément par type de résultats en utilisant le hashtag « # » (par exemple, #municipalites québec). Les accents et les lettres majuscules n'importent pas lors de l'utilisation du hashtag et n'ont pas d'impact sur les Résultats de recherche.
Contextes Les Contextes permettent de visualiser des regroupements de couches faits par thème ou par contexte de travail. Lorsqu'un contexte est sélectionné, toutes les couches qu'il contient se retrouvent alors dans la Carte. Il est possible d'ajouter d’autres couches à partir du Catalogue ou de l’outil Recherche.
ATTENTION : Si un nouveau contexte est sélectionné, toutes les couches affichées dans la Carte seront remplacées par celles de ce nouveau contexte.
Carte Il est possible de personnaliser la Carte à partir du Catalogue ou de l’outil Recherche. Cet espace permet entre autres d’ajouter, de supprimer, d’interroger, de filtrer et de trier les couches présentées. Il est également possible d'afficher les légendes des couches.
Filtre spatial Le Filtre spatial permet de rechercher des adresses ou des thématiques selon des zones prédéfinies (par exemple, par arrondissement ou par MRC) ou selon un dessin réalisé par l'utilisateur. Les résultats du filtre peuvent être exportés à l'aide de l'outil Importer et exporter.
Mesurer Cet outil permet de Mesurer des distances ou des superficies directement sur la carte.
Dessin L'outil Dessin permet de dessiner des entités ponctuelles, linéaires, polygonales ou circulaires accompagnées ou non d'étiquettes. La couleur de remplissage et du contour des entités peuvent être choisies à l'aide des sélecteurs correspondants.
Une couche Dessins peut être exportée à l'aide de l'outil Importer et exporter.
Itinéraire Il est possible de construire un Itinéraire entre deux points en sélectionnant un point de départ et un point d'arrivée dans la carte ou en recherchant des adresses. Il est ensuite possible d'ajouter des points d'arrêt intermédiaires et de copier la description ou le lien de l'itinéraire dans le presse-papier.
Catalogue Le Catalogue contient toutes les couches qui peuvent être ajoutées à la Carte. L'utilisateur doit cliquer sur + de la couche désirée afin de l’ajouter à la Carte.
Importer et exporter Il est possible d'Importer un fichier vectoriel tout en spécifiant un système de coordonnées ou une projection.
Il est possible d'Exporter une ou plusieurs couches dans plusieurs formats courants.
Il est également possible d'Importer ou d'Exporter un contexte localement. Cette dernière fonctionnalité permet ainsi de sauvegarder des contextes en mode non-authentifié ou anonyme.
Imprimer Cet outil permet d'Imprimer la carte affichée à l’écran en spécifiant plusieurs options telles qu'un titre, un commentaire, le format de sortie, le format du papier et l'orientation de l'impression.
Partager L'outil Partager permet de créer une adresse URL qui redirige vers une représentation exacte de la Carte affichée à l’écran. Ce lien peut, par exemple, être partagé ou diffusé dans un document, permettant ainsi de « sauvegarder » la carte pour une utilisation ultérieure.
IGO2 est une solution Web libre géomatique développée en mode collaboratif par des spécialistes provenant de plusieurs ministères et organismes du gouvernement du Québec.
Version: {{version}}
",
"trainingGuide": "Guide de formation",
"trainingGuideTooltip": "Cliquez ici pour accéder au guide d'autoformation de IGO2"
},
diff --git a/projects/demo/src/app/app.component.html b/projects/demo/src/app/app.component.html
index a2fe073692..ae2c32407a 100644
--- a/projects/demo/src/app/app.component.html
+++ b/projects/demo/src/app/app.component.html
@@ -1,7 +1,7 @@
{{ title }}
{{ version.lib }}
diff --git a/projects/demo/src/app/common/action/action.component.ts b/projects/demo/src/app/common/action/action.component.ts
index b567038c7c..3a48a8053c 100644
--- a/projects/demo/src/app/common/action/action.component.ts
+++ b/projects/demo/src/app/common/action/action.component.ts
@@ -40,7 +40,7 @@ export class AppActionComponent implements OnInit, OnDestroy {
{
id: 'add',
title: 'Add',
- icon: 'plus',
+ icon: 'add',
tooltip: 'Add Tooltip',
handler: () => {
alert('Add!');
@@ -50,7 +50,7 @@ export class AppActionComponent implements OnInit, OnDestroy {
{
id: 'edit',
title: 'Edit',
- icon: 'pencil',
+ icon: 'edit',
tooltip: 'Edit Tooltip',
args: ['1'],
handler: (item: string) => {
diff --git a/projects/demo/src/app/common/common.routing.ts b/projects/demo/src/app/common/common.routing.ts
index f7635e29b0..7cb2b1f0dd 100644
--- a/projects/demo/src/app/common/common.routing.ts
+++ b/projects/demo/src/app/common/common.routing.ts
@@ -6,6 +6,7 @@ import { AppDynamicComponentComponent } from './dynamic-component/dynamic-compon
import { AppEntitySelectorComponent } from './entity-selector/entity-selector.component';
import { AppEntityTableComponent } from './entity-table/entity-table.component';
import { AppFormComponent } from './form/form.component';
+import { AppIconComponent } from './icon/icon.component';
import { AppTableComponent } from './table/table.component';
import { AppToolComponent } from './tool/tool.component';
import { AppWidgetComponent } from './widget/widget.component';
@@ -38,10 +39,15 @@ export const routes: Routes = [
component: AppEntitySelectorComponent
},
{
- title: 'form',
- path: 'Form',
+ title: 'Form',
+ path: 'form',
component: AppFormComponent
},
+ {
+ title: 'Icon',
+ path: 'icon',
+ component: AppIconComponent
+ },
{
title: 'Table',
path: 'table',
diff --git a/projects/demo/src/app/common/entity-table/entity-table.component.ts b/projects/demo/src/app/common/entity-table/entity-table.component.ts
index bb857e2826..709744c06f 100644
--- a/projects/demo/src/app/common/entity-table/entity-table.component.ts
+++ b/projects/demo/src/app/common/entity-table/entity-table.component.ts
@@ -44,8 +44,8 @@ export class AppEntityTableComponent implements OnInit, OnDestroy {
title: 'Selected',
valueAccessor: (entity: object) => {
return this.store.state.get(entity).selected
- ? 'radiobox-marked'
- : 'radiobox-blank';
+ ? 'radio_button_checked'
+ : 'radio_button_unchecked';
},
renderer: EntityTableColumnRenderer.Icon
},
diff --git a/projects/demo/src/app/common/icon/icon.component.html b/projects/demo/src/app/common/icon/icon.component.html
new file mode 100644
index 0000000000..c37c7b2da1
--- /dev/null
+++ b/projects/demo/src/app/common/icon/icon.component.html
@@ -0,0 +1,51 @@
+
+
+
+ The icon is a core concept for many packages of the IGO2
+ library. The icon system is base on
+ Google Font - Material Symbol
+ who use font ligature to configure the icon
+
+
+
+
+ Getting started
+
+ -
+ In your
+
index.html
+ file, add the variable font stylesheet request to your head tag and
+ {{exampleIndexHtml}}
+
+ -
+ Then add the current class with variable axes configuration to icons in
+ your
style.scss file.
+ {{exampleStyleVariable}}
+
+ -
+ Finally, add the icon provider configuration in your main file
+
main.ts
+ {{exampleProvider}}
+
+
+
+
+
+
+ Enter a name from the
+ Google Font - Material Symbol
+
+
+
+ Icon Name
+
+
+
+
diff --git a/projects/demo/src/app/common/icon/icon.component.scss b/projects/demo/src/app/common/icon/icon.component.scss
new file mode 100644
index 0000000000..acfae0abde
--- /dev/null
+++ b/projects/demo/src/app/common/icon/icon.component.scss
@@ -0,0 +1,4 @@
+.field-container {
+ display: flex;
+ align-items: center;
+}
diff --git a/projects/demo/src/app/common/icon/icon.component.spec.ts b/projects/demo/src/app/common/icon/icon.component.spec.ts
new file mode 100644
index 0000000000..061015a1cc
--- /dev/null
+++ b/projects/demo/src/app/common/icon/icon.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+
+import { AppIconComponent } from './icon.component';
+
+describe('AppIconComponent', () => {
+ let component: AppIconComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [AppIconComponent, NoopAnimationsModule]
+ }).compileComponents();
+
+ fixture = TestBed.createComponent(AppIconComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/projects/demo/src/app/common/icon/icon.component.ts b/projects/demo/src/app/common/icon/icon.component.ts
new file mode 100644
index 0000000000..5d67bef16a
--- /dev/null
+++ b/projects/demo/src/app/common/icon/icon.component.ts
@@ -0,0 +1,50 @@
+import { Component } from '@angular/core';
+import { FormControl, ReactiveFormsModule } from '@angular/forms';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatInputModule } from '@angular/material/input';
+
+import { IgoIconComponent } from '@igo2/common';
+
+import { DocViewerComponent } from '../../components/doc-viewer/doc-viewer.component';
+import { ExampleViewerComponent } from '../../components/example/example-viewer/example-viewer.component';
+
+@Component({
+ selector: 'app-icon',
+ standalone: true,
+ imports: [
+ DocViewerComponent,
+ ExampleViewerComponent,
+ IgoIconComponent,
+ MatFormFieldModule,
+ ReactiveFormsModule,
+ MatInputModule
+ ],
+ templateUrl: './icon.component.html',
+ styleUrl: './icon.component.scss'
+})
+export class AppIconComponent {
+ exampleIndexHtml: string = EXAMPLE_INDEX_HTML;
+ exampleStyleVariable: string = EXAMPLE_STYLE_VARIABLE;
+ exampleProvider: string = EXAMPLE_PROVIDER;
+
+ nameControl = new FormControl('shopping_cart_checkout');
+}
+
+const EXAMPLE_INDEX_HTML = ``;
+
+const EXAMPLE_STYLE_VARIABLE = `.material-symbols-outlined {
+ font-variation-settings:
+ 'FILL' 0,
+ 'wght' 400,
+ 'GRAD' 0,
+ 'opsz' 24
+}`;
+
+const EXAMPLE_PROVIDER = `import { provideIcon } from '@igo2/common';
+
+bootstrapApplication(AppComponent, {
+ providers: [
+ provideIcon(),
+ ]
+})
+`;
diff --git a/projects/demo/src/app/common/table/table.component.ts b/projects/demo/src/app/common/table/table.component.ts
index c9a1f2608d..1a9d7fda82 100644
--- a/projects/demo/src/app/common/table/table.component.ts
+++ b/projects/demo/src/app/common/table/table.component.ts
@@ -43,7 +43,7 @@ export class AppTableComponent implements OnInit {
],
actions: [
{
- icon: 'file-document',
+ icon: 'description',
color: TableActionColor.primary,
click: (row) => this.showName(row.name)
}
diff --git a/projects/demo/src/app/common/tool/tool.component.html b/projects/demo/src/app/common/tool/tool.component.html
index f150879c61..639ee92dfd 100644
--- a/projects/demo/src/app/common/tool/tool.component.html
+++ b/projects/demo/src/app/common/tool/tool.component.html
@@ -7,7 +7,7 @@
(click)="toolbox.activatePreviousTool()"
*ngIf="activeTool$ | async"
>
- arrow_back
- code-tags
- settings
diff --git a/projects/demo/src/index.html b/projects/demo/src/index.html
index 1d3f410c63..05a1b0cee1 100644
--- a/projects/demo/src/index.html
+++ b/projects/demo/src/index.html
@@ -13,6 +13,10 @@
href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;600;700&display=swap"
rel="stylesheet"
/>
+
Features overview
Located in the upper-left portion of the interface, the Search Bar allows the user to locate an area of interest using an address, location or GPS coordinates. It can also be used to search for a layer.
It is also possible to search for a specific element using the hashtag \"#\" (for example, #municipalites québec). Accents and capital letters don't have any impact on Search Results when using a hashtag.
It is also possible to search for a specific element using the hashtag \"#\" (for example, #municipalites québec). Accents and capital letters don't have any impact on Search Results when using a hashtag.
Contexts are used to visualize groupings of layers related to a specific theme. When a context is selected, all the layers associated with it will be added to the Map. It is then possible to add other layers to the map by using the Catalog or the Search Bar.
Map
Spatial Filter
Measure
Directions
Catalog
Import & Export
Print
Share
",
+ "html": "
WARNING : If a new context is selected, all the layers displayed on the Map will be replaced by the ones associated with the newly selected context.
It is possible to personalize the Map by using the Catalog or the Search Bar. This space allows the user to add, delete, interrogate, filter and sort the displayed layers. It is also possible to visualize the legends associated with the layers.
The Spatial Filter can be used to search for adresses or themes by specifying a predefined zone (for example, electoral districts) or by drawing an area on the map. The results can then be exported by using the Import & Export tool.
This tool gives the option to either Measure distances or areas on the map.
The Draw tool can be used to draw points, lines, polygons or circles with labels. The color of the fill and the stroke can be set with the given selectors.
A Drawings layer can be exported by using the Import & Export tool.
A Drawings layer can be exported by using the Import & Export tool.
It is possible to build a route and get Directions between two points by placing them on the map or by searching for addresses. It is also possible to add stops and copy the description or the link of the route to the clipboard.
The Catalog contains all the layers that can be added to the Map. Click on the + of desired layer to add it.
It is possible to Import vector data by specifying a coordinate system or a projection.
It is possible to Export one or many layers in multiple formats.
It is also possible to Import or Export a context locally. This feature is useful to save contexts when the user is not authenticated.
It is possible to Export one or many layers in multiple formats.
It is also possible to Import or Export a context locally. This feature is useful to save contexts when the user is not authenticated.
This tool is used to Print the map displayed on-screen. Multiple options can be specified like a title, a comment, the output format, the paper size and the orientation.
The Share tool is used to create an URL that redirects to an exact representation of the map. This link can be shared or distributed in a document and allows the user to \"save\" the map for later use.
IGO2 is a open source geospatial solution developed by collaborators and specialists from several departments and agencies of the Government of Quebec.
Version: {{version}}
Features overview
Search Bar
Located in the upper-left portion of the interface, the Search Bar allows the user to locate an area of interest using an address, location or GPS coordinates. It can also be used to search for a layer.
It is also possible to search for a specific element using the hashtag \"#\" (for example, #municipalites québec). Accents and capital letters don't have any impact on Search Results when using a hashtag.
It is also possible to search for a specific element using the hashtag \"#\" (for example, #municipalites québec). Accents and capital letters don't have any impact on Search Results when using a hashtag.
Context
Contexts are used to visualize groupings of layers related to a specific theme. When a context is selected, all the layers associated with it will be added to the Map. It is then possible to add other layers to the map by using the Catalog or the Search Bar.
",
"trainingGuide": "Training guide",
"trainingGuideTooltip": "Click here to access IGO2's self-training guide"
},
diff --git a/packages/integration/src/locale/fr.integration.json b/packages/integration/src/locale/fr.integration.json
index 359a8f9f61..c869c11bde 100644
--- a/packages/integration/src/locale/fr.integration.json
+++ b/packages/integration/src/locale/fr.integration.json
@@ -47,7 +47,7 @@
},
"aboutTool": {
"headerHtml": "",
- "html": " Recherche
Contextes
Carte
Mesurer
Itinéraire
Catalogue
Importer et exporter
Imprimer
Partager
",
+ "html": "
",
"trainingGuide": "Guide de formation",
"trainingGuideTooltip": "Cliquez ici pour accéder au guide d'autoformation de IGO2"
},
diff --git a/projects/demo/src/app/app.component.html b/projects/demo/src/app/app.component.html
index a2fe073692..ae2c32407a 100644
--- a/projects/demo/src/app/app.component.html
+++ b/projects/demo/src/app/app.component.html
@@ -1,7 +1,7 @@
+
+
+
+
+
+
+
+
+
diff --git a/projects/demo/src/app/common/icon/icon.component.scss b/projects/demo/src/app/common/icon/icon.component.scss
new file mode 100644
index 0000000000..acfae0abde
--- /dev/null
+++ b/projects/demo/src/app/common/icon/icon.component.scss
@@ -0,0 +1,4 @@
+.field-container {
+ display: flex;
+ align-items: center;
+}
diff --git a/projects/demo/src/app/common/icon/icon.component.spec.ts b/projects/demo/src/app/common/icon/icon.component.spec.ts
new file mode 100644
index 0000000000..061015a1cc
--- /dev/null
+++ b/projects/demo/src/app/common/icon/icon.component.spec.ts
@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+
+import { AppIconComponent } from './icon.component';
+
+describe('AppIconComponent', () => {
+ let component: AppIconComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [AppIconComponent, NoopAnimationsModule]
+ }).compileComponents();
+
+ fixture = TestBed.createComponent(AppIconComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/projects/demo/src/app/common/icon/icon.component.ts b/projects/demo/src/app/common/icon/icon.component.ts
new file mode 100644
index 0000000000..5d67bef16a
--- /dev/null
+++ b/projects/demo/src/app/common/icon/icon.component.ts
@@ -0,0 +1,50 @@
+import { Component } from '@angular/core';
+import { FormControl, ReactiveFormsModule } from '@angular/forms';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatInputModule } from '@angular/material/input';
+
+import { IgoIconComponent } from '@igo2/common';
+
+import { DocViewerComponent } from '../../components/doc-viewer/doc-viewer.component';
+import { ExampleViewerComponent } from '../../components/example/example-viewer/example-viewer.component';
+
+@Component({
+ selector: 'app-icon',
+ standalone: true,
+ imports: [
+ DocViewerComponent,
+ ExampleViewerComponent,
+ IgoIconComponent,
+ MatFormFieldModule,
+ ReactiveFormsModule,
+ MatInputModule
+ ],
+ templateUrl: './icon.component.html',
+ styleUrl: './icon.component.scss'
+})
+export class AppIconComponent {
+ exampleIndexHtml: string = EXAMPLE_INDEX_HTML;
+ exampleStyleVariable: string = EXAMPLE_STYLE_VARIABLE;
+ exampleProvider: string = EXAMPLE_PROVIDER;
+
+ nameControl = new FormControl('shopping_cart_checkout');
+}
+
+const EXAMPLE_INDEX_HTML = ``;
+
+const EXAMPLE_STYLE_VARIABLE = `.material-symbols-outlined {
+ font-variation-settings:
+ 'FILL' 0,
+ 'wght' 400,
+ 'GRAD' 0,
+ 'opsz' 24
+}`;
+
+const EXAMPLE_PROVIDER = `import { provideIcon } from '@igo2/common';
+
+bootstrapApplication(AppComponent, {
+ providers: [
+ provideIcon(),
+ ]
+})
+`;
diff --git a/projects/demo/src/app/common/table/table.component.ts b/projects/demo/src/app/common/table/table.component.ts
index c9a1f2608d..1a9d7fda82 100644
--- a/projects/demo/src/app/common/table/table.component.ts
+++ b/projects/demo/src/app/common/table/table.component.ts
@@ -43,7 +43,7 @@ export class AppTableComponent implements OnInit {
],
actions: [
{
- icon: 'file-document',
+ icon: 'description',
color: TableActionColor.primary,
click: (row) => this.showName(row.name)
}
diff --git a/projects/demo/src/app/common/tool/tool.component.html b/projects/demo/src/app/common/tool/tool.component.html
index f150879c61..639ee92dfd 100644
--- a/projects/demo/src/app/common/tool/tool.component.html
+++ b/projects/demo/src/app/common/tool/tool.component.html
@@ -7,7 +7,7 @@
(click)="toolbox.activatePreviousTool()"
*ngIf="activeTool$ | async"
>
- arrow_back
- code-tags
- settings
diff --git a/projects/demo/src/index.html b/projects/demo/src/index.html
index 1d3f410c63..05a1b0cee1 100644
--- a/projects/demo/src/index.html
+++ b/projects/demo/src/index.html
@@ -13,6 +13,10 @@
href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;600;700&display=swap"
rel="stylesheet"
/>
+
WARNING : If a new context is selected, all the layers displayed on the Map will be replaced by the ones associated with the newly selected context.
Map
It is possible to personalize the Map by using the Catalog or the Search Bar. This space allows the user to add, delete, interrogate, filter and sort the displayed layers. It is also possible to visualize the legends associated with the layers.
Spatial Filter
The Spatial Filter can be used to search for adresses or themes by specifying a predefined zone (for example, electoral districts) or by drawing an area on the map. The results can then be exported by using the Import & Export tool.
Measure
This tool gives the option to either Measure distances or areas on the map.
Draw
The Draw tool can be used to draw points, lines, polygons or circles with labels. The color of the fill and the stroke can be set with the given selectors.
A Drawings layer can be exported by using the Import & Export tool.
A Drawings layer can be exported by using the Import & Export tool.
Directions
It is possible to build a route and get Directions between two points by placing them on the map or by searching for addresses. It is also possible to add stops and copy the description or the link of the route to the clipboard.
Catalog
The Catalog contains all the layers that can be added to the Map. Click on the + of desired layer to add it.
Import & Export
It is possible to Import vector data by specifying a coordinate system or a projection.
It is possible to Export one or many layers in multiple formats.
It is also possible to Import or Export a context locally. This feature is useful to save contexts when the user is not authenticated.
It is possible to Export one or many layers in multiple formats.
It is also possible to Import or Export a context locally. This feature is useful to save contexts when the user is not authenticated.
Print
This tool is used to Print the map displayed on-screen. Multiple options can be specified like a title, a comment, the output format, the paper size and the orientation.
Share
The Share tool is used to create an URL that redirects to an exact representation of the map. This link can be shared or distributed in a document and allows the user to \"save\" the map for later use.
IGO2 is a open source geospatial solution developed by collaborators and specialists from several departments and agencies of the Government of Quebec.
Version: {{version}}
Aperçu des fonctionnalités
Située dans la portion supérieure gauche de l’interface, la barre de Recherche permet de se positionner à l’aide d’une adresse, d’un lieu ou de coordonnées GPS et peut également servir à rechercher une couche.
Il est également possible de rechercher un élément par type de résultats en utilisant le hashtag « # » (par exemple, #municipalites québec). Les accents et les lettres majuscules n'importent pas lors de l'utilisation du hashtag et n'ont pas d'impact sur les Résultats de recherche.
Il est également possible de rechercher un élément par type de résultats en utilisant le hashtag « # » (par exemple, #municipalites québec). Les accents et les lettres majuscules n'importent pas lors de l'utilisation du hashtag et n'ont pas d'impact sur les Résultats de recherche.
Les Contextes permettent de visualiser des regroupements de couches faits par thème ou par contexte de travail. Lorsqu'un contexte est sélectionné, toutes les couches qu'il contient se retrouvent alors dans la Carte. Il est possible d'ajouter d’autres couches à partir du Catalogue ou de l’outil Recherche.
ATTENTION : Si un nouveau contexte est sélectionné, toutes les couches affichées dans la Carte seront remplacées par celles de ce nouveau contexte.
Il est possible de personnaliser la Carte à partir du Catalogue ou de l’outil Recherche. Cet espace permet entre autres d’ajouter, de supprimer, d’interroger, de filtrer et de trier les couches présentées. Il est également possible d'afficher les légendes des couches.
Le Filtre spatial permet de rechercher des adresses ou des thématiques selon des zones prédéfinies (par exemple, par arrondissement ou par MRC) ou selon un dessin réalisé par l'utilisateur. Les résultats du filtre peuvent être exportés à l'aide de l'outil Importer et exporter.
Cet outil permet de Mesurer des distances ou des superficies directement sur la carte.
L'outil Dessin permet de dessiner des entités ponctuelles, linéaires, polygonales ou circulaires accompagnées ou non d'étiquettes. La couleur de remplissage et du contour des entités peuvent être choisies à l'aide des sélecteurs correspondants.
Une couche Dessins peut être exportée à l'aide de l'outil Importer et exporter.
Une couche Dessins peut être exportée à l'aide de l'outil Importer et exporter.
Il est possible de construire un Itinéraire entre deux points en sélectionnant un point de départ et un point d'arrivée dans la carte ou en recherchant des adresses. Il est ensuite possible d'ajouter des points d'arrêt intermédiaires et de copier la description ou le lien de l'itinéraire dans le presse-papier.
Le Catalogue contient toutes les couches qui peuvent être ajoutées à la Carte. L'utilisateur doit cliquer sur + de la couche désirée afin de l’ajouter à la Carte.
Il est possible d'Importer un fichier vectoriel tout en spécifiant un système de coordonnées ou une projection.
Il est possible d'Exporter une ou plusieurs couches dans plusieurs formats courants.
Il est également possible d'Importer ou d'Exporter un contexte localement. Cette dernière fonctionnalité permet ainsi de sauvegarder des contextes en mode non-authentifié ou anonyme.
Il est possible d'Exporter une ou plusieurs couches dans plusieurs formats courants.
Il est également possible d'Importer ou d'Exporter un contexte localement. Cette dernière fonctionnalité permet ainsi de sauvegarder des contextes en mode non-authentifié ou anonyme.
Cet outil permet d'Imprimer la carte affichée à l’écran en spécifiant plusieurs options telles qu'un titre, un commentaire, le format de sortie, le format du papier et l'orientation de l'impression.
L'outil Partager permet de créer une adresse URL qui redirige vers une représentation exacte de la Carte affichée à l’écran. Ce lien peut, par exemple, être partagé ou diffusé dans un document, permettant ainsi de « sauvegarder » la carte pour une utilisation ultérieure.
IGO2 est une solution Web libre géomatique développée en mode collaboratif par des spécialistes provenant de plusieurs ministères et organismes du gouvernement du Québec.
Version: {{version}}
Aperçu des fonctionnalités
Recherche
Située dans la portion supérieure gauche de l’interface, la barre de Recherche permet de se positionner à l’aide d’une adresse, d’un lieu ou de coordonnées GPS et peut également servir à rechercher une couche.
Il est également possible de rechercher un élément par type de résultats en utilisant le hashtag « # » (par exemple, #municipalites québec). Les accents et les lettres majuscules n'importent pas lors de l'utilisation du hashtag et n'ont pas d'impact sur les Résultats de recherche.
Il est également possible de rechercher un élément par type de résultats en utilisant le hashtag « # » (par exemple, #municipalites québec). Les accents et les lettres majuscules n'importent pas lors de l'utilisation du hashtag et n'ont pas d'impact sur les Résultats de recherche.
Contextes
Les Contextes permettent de visualiser des regroupements de couches faits par thème ou par contexte de travail. Lorsqu'un contexte est sélectionné, toutes les couches qu'il contient se retrouvent alors dans la Carte. Il est possible d'ajouter d’autres couches à partir du Catalogue ou de l’outil Recherche.
ATTENTION : Si un nouveau contexte est sélectionné, toutes les couches affichées dans la Carte seront remplacées par celles de ce nouveau contexte.
Carte
Il est possible de personnaliser la Carte à partir du Catalogue ou de l’outil Recherche. Cet espace permet entre autres d’ajouter, de supprimer, d’interroger, de filtrer et de trier les couches présentées. Il est également possible d'afficher les légendes des couches.
Filtre spatial
Le Filtre spatial permet de rechercher des adresses ou des thématiques selon des zones prédéfinies (par exemple, par arrondissement ou par MRC) ou selon un dessin réalisé par l'utilisateur. Les résultats du filtre peuvent être exportés à l'aide de l'outil Importer et exporter.
Mesurer
Cet outil permet de Mesurer des distances ou des superficies directement sur la carte.
Dessin
L'outil Dessin permet de dessiner des entités ponctuelles, linéaires, polygonales ou circulaires accompagnées ou non d'étiquettes. La couleur de remplissage et du contour des entités peuvent être choisies à l'aide des sélecteurs correspondants.
Une couche Dessins peut être exportée à l'aide de l'outil Importer et exporter.
Une couche Dessins peut être exportée à l'aide de l'outil Importer et exporter.
Itinéraire
Il est possible de construire un Itinéraire entre deux points en sélectionnant un point de départ et un point d'arrivée dans la carte ou en recherchant des adresses. Il est ensuite possible d'ajouter des points d'arrêt intermédiaires et de copier la description ou le lien de l'itinéraire dans le presse-papier.
Catalogue
Le Catalogue contient toutes les couches qui peuvent être ajoutées à la Carte. L'utilisateur doit cliquer sur + de la couche désirée afin de l’ajouter à la Carte.
Importer et exporter
Il est possible d'Importer un fichier vectoriel tout en spécifiant un système de coordonnées ou une projection.
Il est possible d'Exporter une ou plusieurs couches dans plusieurs formats courants.
Il est également possible d'Importer ou d'Exporter un contexte localement. Cette dernière fonctionnalité permet ainsi de sauvegarder des contextes en mode non-authentifié ou anonyme.
Il est possible d'Exporter une ou plusieurs couches dans plusieurs formats courants.
Il est également possible d'Importer ou d'Exporter un contexte localement. Cette dernière fonctionnalité permet ainsi de sauvegarder des contextes en mode non-authentifié ou anonyme.
Imprimer
Cet outil permet d'Imprimer la carte affichée à l’écran en spécifiant plusieurs options telles qu'un titre, un commentaire, le format de sortie, le format du papier et l'orientation de l'impression.
Partager
L'outil Partager permet de créer une adresse URL qui redirige vers une représentation exacte de la Carte affichée à l’écran. Ce lien peut, par exemple, être partagé ou diffusé dans un document, permettant ainsi de « sauvegarder » la carte pour une utilisation ultérieure.
IGO2 est une solution Web libre géomatique développée en mode collaboratif par des spécialistes provenant de plusieurs ministères et organismes du gouvernement du Québec.
Version: {{version}}
{{ title }}
{{ version.lib }}
diff --git a/projects/demo/src/app/common/action/action.component.ts b/projects/demo/src/app/common/action/action.component.ts index b567038c7c..3a48a8053c 100644 --- a/projects/demo/src/app/common/action/action.component.ts +++ b/projects/demo/src/app/common/action/action.component.ts @@ -40,7 +40,7 @@ export class AppActionComponent implements OnInit, OnDestroy { { id: 'add', title: 'Add', - icon: 'plus', + icon: 'add', tooltip: 'Add Tooltip', handler: () => { alert('Add!'); @@ -50,7 +50,7 @@ export class AppActionComponent implements OnInit, OnDestroy { { id: 'edit', title: 'Edit', - icon: 'pencil', + icon: 'edit', tooltip: 'Edit Tooltip', args: ['1'], handler: (item: string) => { diff --git a/projects/demo/src/app/common/common.routing.ts b/projects/demo/src/app/common/common.routing.ts index f7635e29b0..7cb2b1f0dd 100644 --- a/projects/demo/src/app/common/common.routing.ts +++ b/projects/demo/src/app/common/common.routing.ts @@ -6,6 +6,7 @@ import { AppDynamicComponentComponent } from './dynamic-component/dynamic-compon import { AppEntitySelectorComponent } from './entity-selector/entity-selector.component'; import { AppEntityTableComponent } from './entity-table/entity-table.component'; import { AppFormComponent } from './form/form.component'; +import { AppIconComponent } from './icon/icon.component'; import { AppTableComponent } from './table/table.component'; import { AppToolComponent } from './tool/tool.component'; import { AppWidgetComponent } from './widget/widget.component'; @@ -38,10 +39,15 @@ export const routes: Routes = [ component: AppEntitySelectorComponent }, { - title: 'form', - path: 'Form', + title: 'Form', + path: 'form', component: AppFormComponent }, + { + title: 'Icon', + path: 'icon', + component: AppIconComponent + }, { title: 'Table', path: 'table', diff --git a/projects/demo/src/app/common/entity-table/entity-table.component.ts b/projects/demo/src/app/common/entity-table/entity-table.component.ts index bb857e2826..709744c06f 100644 --- a/projects/demo/src/app/common/entity-table/entity-table.component.ts +++ b/projects/demo/src/app/common/entity-table/entity-table.component.ts @@ -44,8 +44,8 @@ export class AppEntityTableComponent implements OnInit, OnDestroy { title: 'Selected', valueAccessor: (entity: object) => { return this.store.state.get(entity).selected - ? 'radiobox-marked' - : 'radiobox-blank'; + ? 'radio_button_checked' + : 'radio_button_unchecked'; }, renderer: EntityTableColumnRenderer.Icon }, diff --git a/projects/demo/src/app/common/icon/icon.component.html b/projects/demo/src/app/common/icon/icon.component.html new file mode 100644 index 0000000000..c37c7b2da1 --- /dev/null +++ b/projects/demo/src/app/common/icon/icon.component.html @@ -0,0 +1,51 @@ +
+ The icon is a core concept for many packages of the IGO2
+ library. The icon system is base on
+ Google Font - Material Symbol
+ who use font ligature to configure the icon
+
Getting started
+-
+
-
+ In your
+
index.html+ file, add the variable font stylesheet request to your head tag and +
+{{exampleIndexHtml}}
+ -
+ Then add the current class with variable axes configuration to icons in
+ your
style.scssfile. +
+{{exampleStyleVariable}}
+ -
+ Finally, add the icon provider configuration in your main file
+
main.ts+
+{{exampleProvider}}
+
+ Enter a name from the + Google Font - Material Symbol +
+
+
+ Icon Name
+
+
+
+