UI: Map - improve marker shape/icons.

ui-ngx/src/app/modules/home/components/widget/lib/maps/data-layer/markers-data-layer.ts

@@ -73,8 +73,7 @@ export class MarkerDataProcessor<S extends MarkersDataLayerSettings = MarkersDat
   constructor(public dataLayer: TbMapDataLayer,
               private settings: S,
               public markerOffset: L.LatLngTuple,
-              public tooltipOffset: L.LatLngTuple,
+              public tooltipOffset: L.LatLngTuple) {
-              private trip = false) {
   }
 
   public setup(): Observable<any> {
@@ -171,7 +170,7 @@ export class MarkerDataProcessor<S extends MarkersDataLayerSettings = MarkersDat
   public createColoredMarkerIcon(iconContainer: MarkerIconContainer,
                                  icon: string, color: tinycolor.Instance, rotationAngle = 0, size = 34): Observable<MarkerIconInfo> {
     return createColorMarkerIconElement(this.dataLayer.getCtx().$injector.get(MatIconRegistry), this.dataLayer.getCtx().$injector.get(DomSanitizer),
-      iconContainer, icon, color, this.trip).pipe(
+      iconContainer, icon, color).pipe(
       map((element) => {
         if (rotationAngle !== 0) {
           element.style.transform = `rotate(${rotationAngle}deg)`;

ui-ngx/src/app/modules/home/components/widget/lib/maps/data-layer/trips-data-layer.ts

@@ -553,7 +553,7 @@ export class TbTripsDataLayer extends TbMapDataLayer<TripsDataLayerSettings, TbT
       isDefined(this.settings.tooltip?.offsetX) ? this.settings.tooltip?.offsetX : 0,
       isDefined(this.settings.tooltip?.offsetY) ? this.settings.tooltip?.offsetY : -0.5,
     ];
-    this.dataProcessor = new MarkerDataProcessor(this, this.settings, this.markerOffset, this.tooltipOffset, true);
+    this.dataProcessor = new MarkerDataProcessor(this, this.settings, this.markerOffset, this.tooltipOffset);
     const setup$: Observable<void>[] = [this.dataProcessor.setup()];
     if (this.settings.showPath) {
       this.pathStrokeColorProcessor = new DataLayerColorProcessor(this, this.settings.pathStrokeColor);

ui-ngx/src/app/modules/home/components/widget/lib/maps/map.ts

@@ -171,6 +171,7 @@ export abstract class TbMap<S extends BaseMapSettings> {
   }
 
   private setupControls(): Observable<any> {
+    //L.control.scale().addTo(this.map);
     if (this.map.zoomControl) {
       this.map.zoomControl.setPosition(this.settings.controlsPosition);
     }

ui-ngx/src/app/modules/home/components/widget/lib/settings/common/map/marker-icon-shapes.component.ts

@@ -115,7 +115,7 @@ export class MarkerIconShapesComponent extends PageComponent implements OnInit {
     this.iconContainers = containersList.map((iconContainer) => {
       return {
         iconContainer,
-        html$: createColorMarkerIconElement(this.iconRegistry, this.domSanitizer, iconContainer, this.icon, tinycolor(this.color), this.trip).pipe(
+        html$: createColorMarkerIconElement(this.iconRegistry, this.domSanitizer, iconContainer, this.icon, tinycolor(this.color)).pipe(
           map((element) => {
             return this.domSanitizer.bypassSecurityTrustHtml(element.outerHTML);
           }),

ui-ngx/src/app/modules/home/components/widget/lib/settings/common/map/marker-shape-settings.component.ts

@@ -208,7 +208,7 @@ export class MarkerShapeSettingsComponent implements ControlValueAccessor, OnIni
     } else if (this.markerType === MarkerType.icon) {
       const iconContainer = (this.modelValue as MarkerIconSettings).iconContainer;
       const icon = (this.modelValue as MarkerIconSettings).icon;
-      this.iconPreview$ = createColorMarkerIconElement(this.iconRegistry, this.domSanitizer, iconContainer, icon, tinycolor(color), this.trip).pipe(
+      this.iconPreview$ = createColorMarkerIconElement(this.iconRegistry, this.domSanitizer, iconContainer, icon, tinycolor(color)).pipe(
         map((element) => {
           return this.domSanitizer.bypassSecurityTrustHtml(element.outerHTML);
         }),

ui-ngx/src/app/shared/models/widget/maps/marker-shape.models.ts

@@ -21,6 +21,7 @@ import { Observable, of, shareReplay, switchMap } from 'rxjs';
 import { catchError, map, take } from 'rxjs/operators';
 import { isSvgIcon, splitIconName } from '@shared/models/icon.models';
 import { Element, G, SVG, Text } from '@svgdotjs/svg.js';
+import { guid } from '@core/utils';
 
 export enum MarkerShape {
   markerShape1 = 'markerShape1',
@@ -47,10 +48,14 @@ export enum MarkerShape {
 
 export enum MarkerIconContainer {
   iconContainer1 = 'iconContainer1',
-  tripIconContainer1 = 'tripIconContainer1'
+  iconContainer2 = 'iconContainer2',
+  iconContainer3 = 'iconContainer3',
+  tripIconContainer1 = 'tripIconContainer1',
+  tripIconContainer2 = 'tripIconContainer2',
+  tripIconContainer3 = 'tripIconContainer3'
 }
 
-export const markerShapeMap = new Map<MarkerShape, string>(
+const markerShapeMap = new Map<MarkerShape, string>(
   [
     [MarkerShape.markerShape1, '/assets/markers/shape1.svg'],
     [MarkerShape.markerShape2, '/assets/markers/shape2.svg'],
@@ -75,10 +80,69 @@ export const markerShapeMap = new Map<MarkerShape, string>(
   ]
 );
 
-export const markerIconContainerMap = new Map<MarkerIconContainer, string>(
+const markerIconContainerMap = new Map<MarkerIconContainer, string>(
   [
     [MarkerIconContainer.iconContainer1, '/assets/markers/iconContainer1.svg'],
-    [MarkerIconContainer.tripIconContainer1, '/assets/markers/tripIconContainer1.svg']
+    [MarkerIconContainer.iconContainer2, '/assets/markers/iconContainer2.svg'],
+    [MarkerIconContainer.iconContainer3, '/assets/markers/iconContainer3.svg'],
+    [MarkerIconContainer.tripIconContainer1, '/assets/markers/tripIconContainer1.svg'],
+    [MarkerIconContainer.tripIconContainer2, '/assets/markers/tripIconContainer2.svg'],
+    [MarkerIconContainer.tripIconContainer3, '/assets/markers/tripIconContainer3.svg']
+  ]
+);
+
+interface MarkerIconContainerDefinition {
+  iconSize: number;
+  iconColor: (color: tinycolor.Instance) => tinycolor.Instance;
+  iconAlpha: (color: tinycolor.Instance) => number;
+  appendIcon?: (svgElement: SVGElement, iconElement: Element) => void;
+}
+
+const emptyIconContainerDefinition: MarkerIconContainerDefinition = {
+  iconSize: 24,
+  iconColor: (color) => color,
+  iconAlpha: color => color.getAlpha()
+}
+
+const defaultIconContainerDefinition: MarkerIconContainerDefinition = {
+  iconSize: 12,
+  iconColor: (color) => tinycolor.mix(color.clone().setAlpha(1), tinycolor('rgba(0,0,0,0.38)')),
+  iconAlpha: color => color.getAlpha()
+}
+
+const defaultTripIconContainerDefinition: MarkerIconContainerDefinition = {
+  iconSize: 24,
+  iconColor: () => tinycolor('#000'),
+  iconAlpha: () => 1,
+  appendIcon: (svgElement, iconElement) => {
+    const box = iconElement.bbox();
+    let elements = svgElement.getElementsByClassName('icon-mask-exclude');
+    if (elements.length) {
+      elements = elements[0].getElementsByClassName('marker-icon-container');
+      if (elements.length) {
+        const iconContainer = new G(elements[0] as SVGGElement);
+        iconContainer.add(iconElement.clone().fill('#000').translate(-box.cx, -box.cy));
+      }
+    }
+    elements = svgElement.getElementsByClassName('icon-mask-overlay');
+    if (elements.length) {
+      elements = elements[0].getElementsByClassName('marker-icon-container');
+      if (elements.length) {
+        const iconContainer = new G(elements[0] as SVGGElement);
+        iconContainer.add(iconElement.clone().fill('#fff').translate(-box.cx, -box.cy));
+      }
+    }
+  }
+}
+
+const markerIconContainerDefinitionMap = new Map<MarkerIconContainer, MarkerIconContainerDefinition>(
+  [
+    [MarkerIconContainer.iconContainer1, defaultIconContainerDefinition],
+    [MarkerIconContainer.iconContainer2, defaultIconContainerDefinition],
+    [MarkerIconContainer.iconContainer3, defaultIconContainerDefinition],
+    [MarkerIconContainer.tripIconContainer1, defaultTripIconContainerDefinition],
+    [MarkerIconContainer.tripIconContainer2, {...defaultTripIconContainerDefinition, iconSize: 16}],
+    [MarkerIconContainer.tripIconContainer3, {...defaultTripIconContainerDefinition, iconSize: 16}]
   ]
 );
 
@@ -108,8 +172,45 @@ export const tripMarkerShapes = [
   MarkerShape.tripMarkerShape10
 ];
 
-export const markerIconContainers = [ MarkerIconContainer.iconContainer1 ];
+export const markerIconContainers = [
-export const tripMarkerIconContainers = [ MarkerIconContainer.tripIconContainer1 ];
+  MarkerIconContainer.iconContainer1,
+  MarkerIconContainer.iconContainer2,
+  MarkerIconContainer.iconContainer3
+];
+
+export const tripMarkerIconContainers = [
+  MarkerIconContainer.tripIconContainer1,
+  MarkerIconContainer.tripIconContainer2,
+  MarkerIconContainer.tripIconContainer3
+];
+
+const generateElementId = () => {
+  const id = guid();
+  const firstChar = id.charAt(0);
+  if (firstChar >= '0' && firstChar <= '9') {
+    return 'a' + id;
+  } else {
+    return id;
+  }
+};
+
+const prepareSvgIds = (element: SVGElement): SVGElement => {
+  let svgContent = element.outerHTML;
+  const regexp = /\sid="([^"]*)"[\s>]/g;
+  const unique_id_suffix = '_' + generateElementId();
+  const ids: string[] = [];
+  let match = regexp.exec(svgContent);
+  while (match !== null) {
+    ids.push(match[1]);
+    match = regexp.exec(svgContent);
+  }
+  for (const id of ids) {
+    const newId = id + unique_id_suffix;
+    svgContent = svgContent.replace(new RegExp('id="'+id+'"', 'g'), 'id="'+newId+'"');
+    svgContent = svgContent.replace(new RegExp('url\\(#'+id+'\\)', 'g'), 'url(#'+newId+')');
+  }
+  return SVG(svgContent).node;
+};
 
 const createColorMarkerShape = (iconRegistry: MatIconRegistry, domSanitizer: DomSanitizer, assetUrl: string, color: tinycolor.Instance): Observable<SVGElement> => {
   const safeUrl = domSanitizer.bypassSecurityTrustResourceUrl(assetUrl);
@@ -131,7 +232,14 @@ const createColorMarkerShape = (iconRegistry: MatIconRegistry, domSanitizer: Dom
         el.setAttribute('stroke', '#'+color.toHex());
         el.setAttribute('stroke-opacity', `${color.getAlpha()}`);
       });
-      return svgElement;
+      const opacityElements = Array.from(svgElement.getElementsByClassName('marker-opacity'));
+      if (svgElement.classList.contains('marker-opacity')) {
+        opacityElements.push(svgElement);
+      }
+      opacityElements.forEach(el => {
+        el.setAttribute('opacity', `${color.getAlpha()}`);
+      });
+      return prepareSvgIds(svgElement);
     })
   );
 }
@@ -147,10 +255,8 @@ export const createColorMarkerShapeURI = (iconRegistry: MatIconRegistry, domSani
   );
 }
 
-const createIconElement = (iconRegistry: MatIconRegistry, icon: string, size: number, color: tinycolor.Instance, trip = false): Observable<Element> => {
+const createIconElement = (iconRegistry: MatIconRegistry, icon: string, size: number, iconColor: tinycolor.Instance, iconAlpha: number): Observable<Element> => {
   const isSvg = isSvgIcon(icon);
-  const iconAlpha = color.getAlpha();
-  const iconColor = trip ? color : tinycolor.mix(color.clone().setAlpha(1), tinycolor('rgba(0,0,0,0.38)'));
   if (isSvg) {
     const [namespace, iconName] = splitIconName(icon);
     return iconRegistry
@@ -190,24 +296,30 @@ const createIconElement = (iconRegistry: MatIconRegistry, icon: string, size: nu
 }
 
 export const createColorMarkerIconElement = (iconRegistry: MatIconRegistry, domSanitizer: DomSanitizer,
-                                             iconContainer: MarkerIconContainer, icon: string, color: tinycolor.Instance,
+                                             iconContainer: MarkerIconContainer, icon: string, color: tinycolor.Instance): Observable<SVGElement> => {
-                                             trip = false): Observable<SVGElement> => {
   const markerShape$: Observable<SVGElement> = iconContainer ?
     createColorMarkerShape(iconRegistry, domSanitizer, markerIconContainerMap.get(iconContainer), color) : of(null);
   return markerShape$.pipe(
     switchMap((svgElement) => {
-      const iconSize = svgElement ? (trip ? 24 : 12) : 24;
+      const definition = iconContainer ? markerIconContainerDefinitionMap.get(iconContainer) : emptyIconContainerDefinition;
-      const iconColor = svgElement ? (trip ? tinycolor('#fff') : color) : color;
+      const iconSize = definition.iconSize;
-      return createIconElement(iconRegistry, icon, iconSize, iconColor, trip || !svgElement).pipe(
+      const iconColor = definition.iconColor(color);
+      const iconAlpha = definition.iconAlpha(color);
+      return createIconElement(iconRegistry, icon, iconSize, iconColor, iconAlpha).pipe(
         map((iconElement) => {
           if (svgElement) {
-            const elements = svgElement.getElementsByClassName('marker-icon-container');
+            if (iconElement) {
-            if (iconElement && elements.length) {
+              if (definition.appendIcon) {
-              const iconContainer = new G(elements[0] as SVGGElement);
+                definition.appendIcon(svgElement, iconElement);
-              iconContainer.clear();
+              } else {
-              iconContainer.add(iconElement);
+                const elements = svgElement.getElementsByClassName('marker-icon-container');
-              const box = iconElement.bbox();
+                if (elements.length) {
-              iconElement.translate(-box.cx, -box.cy);
+                  const iconContainer = new G(elements[0] as SVGGElement);
+                  iconContainer.add(iconElement);
+                  const box = iconElement.bbox();
+                  iconElement.translate(-box.cx, -box.cy);
+                }
+              }
             }
             return svgElement;
           } else {

ui-ngx/src/assets/markers/iconContainer1.svg

@@ -1,22 +1,25 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" class="marker-color" fill="#307FE5">
-  <g filter="url(#filter0_bf_8817_262071)">
+  <g filter="url(#shadow-filter)">
-    <path d="M19 24.5C17.4075 27.4125 17 33 17 33C17 33 27.0858 32.1955 30.9992 27.4998C34 23.8992 31.9992 19 27.9992 19C23.9993 19 21.1929 20.4894 19 24.5Z" fill="black" fill-opacity="0.24"/>
+    <path class="marker-opacity" d="M19 24.5C17.4075 27.4125 17 33 17 33C17 33 27.0858 32.1955 30.9992 27.4998C34 23.8992 31.9992 19 27.9992 19C23.9993 19 21.1929 20.4894 19 24.5Z" fill="black" fill-opacity="0.24"/>
   </g>
-  <mask id="path-2-inside-1_8817_262071" fill="white">
+  <circle cx="17" cy="13" r="13" fill="white"/>
-    <path fill-rule="evenodd" clip-rule="evenodd" d="M30 12.9625C30 6.39011 25.6157 0 17 0C8.38434 0 4 6.39011 4 12.9625C4 25 17 34 17 34C17 34 30 25 30 12.9625ZM26 13C26 17.9706 21.9706 22 17 22C12.0294 22 8 17.9706 8 13C8 8.02944 12.0294 4 17 4C21.9706 4 26 8.02944 26 13Z"/>
-  </mask>
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M30 12.9625C30 6.39011 25.6157 0 17 0C8.38434 0 4 6.39011 4 12.9625C4 25 17 34 17 34C17 34 30 25 30 12.9625ZM26 13C26 17.9706 21.9706 22 17 22C12.0294 22 8 17.9706 8 13C8 8.02944 12.0294 4 17 4C21.9706 4 26 8.02944 26 13Z"/>
-  <path d="M17 34L16.3952 34.8736L17 35.2923L17.6048 34.8736L17 34ZM17 1.0625C21.024 1.0625 23.9805 2.54472 25.9405 4.72663C27.9167 6.92661 28.9375 9.90415 28.9375 12.9625H31.0625C31.0625 9.44846 29.8911 5.94475 27.5213 3.30657C25.1352 0.650333 21.5917 -1.0625 17 -1.0625V1.0625ZM5.0625 12.9625C5.0625 9.90415 6.08332 6.92661 8.05955 4.72663C10.0195 2.54472 12.976 1.0625 17 1.0625V-1.0625C12.4083 -1.0625 8.86479 0.650333 6.47871 3.30657C4.10885 5.94475 2.9375 9.44846 2.9375 12.9625H5.0625ZM17 34C17.6048 33.1264 17.605 33.1266 17.6052 33.1267C17.6052 33.1267 17.6053 33.1268 17.6053 33.1268C17.6052 33.1267 17.605 33.1266 17.6046 33.1263C17.6037 33.1257 17.6021 33.1245 17.5997 33.1229C17.5949 33.1195 17.587 33.114 17.5762 33.1063C17.5546 33.091 17.5211 33.0672 17.4766 33.035C17.3876 32.9706 17.2545 32.8729 17.0835 32.7432C16.7414 32.4838 16.2486 32.0971 15.6553 31.5948C14.4672 30.5889 12.884 29.126 11.3033 27.2999C8.11939 23.6215 5.0625 18.605 5.0625 12.9625H2.9375C2.9375 19.3575 6.38061 24.8597 9.69665 28.6907C11.366 30.6193 13.0328 32.1588 14.2822 33.2166C14.9077 33.7461 15.4305 34.1565 15.7993 34.4363C15.9838 34.5763 16.13 34.6836 16.2314 34.7569C16.2821 34.7936 16.3216 34.8218 16.3492 34.8413C16.363 34.851 16.3738 34.8586 16.3815 34.864C16.3853 34.8667 16.3884 34.8688 16.3907 34.8704C16.3918 34.8712 16.3928 34.8719 16.3935 34.8724C16.3939 34.8727 16.3943 34.873 16.3945 34.8731C16.3949 34.8734 16.3952 34.8736 17 34ZM28.9375 12.9625C28.9375 18.605 25.8806 23.6215 22.6966 27.2999C21.116 29.126 19.5328 30.5889 18.3447 31.5948C17.7514 32.0971 17.2586 32.4838 16.9165 32.7432C16.7455 32.8729 16.6124 32.9706 16.5234 33.035C16.4789 33.0672 16.4454 33.091 16.4238 33.1063C16.413 33.114 16.4051 33.1195 16.4003 33.1229C16.3979 33.1245 16.3963 33.1257 16.3954 33.1263C16.395 33.1266 16.3948 33.1267 16.3947 33.1268C16.3947 33.1268 16.3948 33.1267 16.3948 33.1267C16.395 33.1266 16.3952 33.1264 17 34C17.6048 34.8736 17.6051 34.8734 17.6055 34.8731C17.6057 34.873 17.6061 34.8727 17.6065 34.8724C17.6072 34.8719 17.6082 34.8712 17.6093 34.8704C17.6116 34.8688 17.6147 34.8667 17.6185 34.864C17.6262 34.8586 17.637 34.851 17.6508 34.8413C17.6784 34.8218 17.7179 34.7936 17.7686 34.7569C17.87 34.6836 18.0162 34.5763 18.2007 34.4363C18.5695 34.1565 19.0923 33.7461 19.7178 33.2166C20.9672 32.1588 22.634 30.6193 24.3034 28.6907C27.6194 24.8597 31.0625 19.3575 31.0625 12.9625H28.9375ZM17 23.0625C22.5574 23.0625 27.0625 18.5574 27.0625 13H24.9375C24.9375 17.3838 21.3838 20.9375 17 20.9375V23.0625ZM6.9375 13C6.9375 18.5574 11.4426 23.0625 17 23.0625V20.9375C12.6162 20.9375 9.0625 17.3838 9.0625 13H6.9375ZM17 2.9375C11.4426 2.9375 6.9375 7.44263 6.9375 13H9.0625C9.0625 8.61624 12.6162 5.0625 17 5.0625V2.9375ZM27.0625 13C27.0625 7.44263 22.5574 2.9375 17 2.9375V5.0625C21.3838 5.0625 24.9375 8.61624 24.9375 13H27.0625Z" fill="black" fill-opacity="0.38" mask="url(#path-2-inside-1_8817_262071)"/>
-  <circle cx="17" cy="13" r="9" fill="#fff"></circle>
   <g class="marker-icon-container" transform="translate(17,13)">
   </g>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M 30,12.9625 C 30,6.39011 25.6157,0 17,0 8.38434,0 4,6.39011 4,12.9625 4,25 17,34 17,34 17,34 30,25 30,12.9625 Z M 26,13 c 0,4.9706 -4.0294,9 -9,9 -4.9706,0 -9,-4.0294 -9,-9 0,-4.97056 4.0294,-9 9,-9 4.9706,0 9,4.02944 9,9 z" />
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M 25.9405,4.72663 C 23.9805,2.54472 21.024,1.0625 17,1.0625 12.976,1.0625 10.0195,2.54472 8.05955,4.72663 6.08332,6.92661 5.0625,9.90415 5.0625,12.9625 c 0,5.6425 3.05689,10.659 6.2408,14.3374 1.5807,1.8261 3.1639,3.289 4.352,4.2949 0.5466,0.4628 1.008,0.8274 1.3447,1.0849 0.3367,-0.2575 0.7981,-0.6221 1.3447,-1.0849 1.1881,-1.0059 2.7713,-2.4688 4.3519,-4.2949 3.184,-3.6784 6.2409,-8.6949 6.2409,-14.3374 0,-3.05835 -1.0208,-6.03589 -2.997,-8.23587 z M 17,34 C 17,34 4,25 4,12.9625 4,6.39011 8.38434,0 17,0 25.6157,0 30,6.39011 30,12.9625 30,25 17,34 17,34 Z M 27.0625,13 C 27.0625,18.5574 22.5574,23.0625 17,23.0625 11.4426,23.0625 6.9375,18.5574 6.9375,13 6.9375,7.44263 11.4426,2.9375 17,2.9375 22.5574,2.9375 27.0625,7.44263 27.0625,13 Z M 17,22 c 4.9706,0 9,-4.0294 9,-9 0,-4.97056 -4.0294,-9 -9,-9 -4.9706,0 -9,4.02944 -9,9 0,4.9706 4.0294,9 9,9 z" style="filter:url(#stroke-filter)" />
   <defs>
-    <filter id="filter0_bf_8817_262071" x="12.75" y="14.75" width="23.9434" height="22.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+    <filter id="shadow-filter" x="12.75" y="14.75" width="23.9434" height="22.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
       <feFlood flood-opacity="0" result="BackgroundImageFix"/>
       <feGaussianBlur in="BackgroundImageFix" stdDeviation="2.125"/>
       <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_8817_262071"/>
       <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_8817_262071" result="shape"/>
       <feGaussianBlur stdDeviation="0.5" result="effect2_foregroundBlur_8817_262071"/>
     </filter>
+    <filter
+      id="stroke-filter"
+      style="color-interpolation-filters:sRGB"
+      x="0" y="0" width="1" height="1">
+      <feColorMatrix values="0.6 0 0 0 0 0 0.6 0 0 0 0 0 0.6 0 0 0 0 0 1 0" />
+    </filter>
   </defs>
 </svg>

ui-ngx/src/assets/markers/iconContainer2.svg

@@ -0,0 +1,26 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" class="marker-color" fill="#307FE5">
+  <g filter="url(#shadow-filter)">
+    <path class="marker-opacity" d="M19 24.5C17.4075 27.4125 17 33 17 33C17 33 27.0858 32.1955 30.9992 27.4998C34 23.8992 31.9992 19 27.9992 19C23.9993 19 21.1929 20.4894 19 24.5Z" fill="black" fill-opacity="0.24"/>
+  </g>
+  <circle cx="17" cy="13" r="13" fill="white"/>
+  <g class="marker-icon-container" transform="translate(17,13)">
+  </g>
+  <path d="M9 25L17 34L25 25C25 25 23 27 17 27C11 27 9 25 9 25Z" style="filter:url(#stroke-filter)"/>
+  <path d="M30 13C30 20.1797 24.1797 26 17 26C9.8203 26 4 20.1797 4 13C4 5.8203 9.8203 0 17 0C24.1797 0 30 5.8203 30 13ZM7.9989 13C7.9989 17.9712 12.0288 22.0011 17 22.0011C21.9712 22.0011 26.0011 17.9712 26.0011 13C26.0011 8.02883 21.9712 3.9989 17 3.9989C12.0288 3.9989 7.9989 8.02883 7.9989 13Z" />
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M17 25C23.6274 25 29 19.6274 29 13C29 6.37258 23.6274 1 17 1C10.3726 1 5 6.37258 5 13C5 19.6274 10.3726 25 17 25ZM17 23.0011C11.4765 23.0011 6.9989 18.5235 6.9989 13C6.9989 7.47654 11.4765 2.9989 17 2.9989C22.5235 2.9989 27.0011 7.47654 27.0011 13C27.0011 18.5235 22.5235 23.0011 17 23.0011ZM17 26C24.1797 26 30 20.1797 30 13C30 5.8203 24.1797 0 17 0C9.8203 0 4 5.8203 4 13C4 20.1797 9.8203 26 17 26ZM17 22.0011C12.0288 22.0011 7.9989 17.9712 7.9989 13C7.9989 8.02883 12.0288 3.9989 17 3.9989C21.9712 3.9989 26.0011 8.02883 26.0011 13C26.0011 17.9712 21.9712 22.0011 17 22.0011Z" style="filter:url(#stroke-filter)" />
+  <defs>
+    <filter id="shadow-filter" x="12.75" y="14.75" width="23.9434" height="22.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+      <feFlood flood-opacity="0" result="BackgroundImageFix"/>
+      <feGaussianBlur in="BackgroundImageFix" stdDeviation="2.125"/>
+      <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_8817_262071"/>
+      <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_8817_262071" result="shape"/>
+      <feGaussianBlur stdDeviation="0.5" result="effect2_foregroundBlur_8817_262071"/>
+    </filter>
+    <filter
+      id="stroke-filter"
+      style="color-interpolation-filters:sRGB"
+      x="0" y="0" width="1" height="1">
+      <feColorMatrix values="0.6 0 0 0 0 0 0.6 0 0 0 0 0 0.6 0 0 0 0 0 1 0" />
+    </filter>
+  </defs>
+</svg>

ui-ngx/src/assets/markers/iconContainer3.svg

@@ -0,0 +1,16 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" class="marker-color" fill="#307FE5">
+  <circle cx="17" cy="13" r="13" fill="white"/>
+  <g class="marker-icon-container" transform="translate(17,13)">
+  </g>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M 30,12.9625 C 30,6.39011 25.6157,0 17,0 8.38434,0 4,6.39011 4,12.9625 4,23 17,31 17,31 17,31 30,23 30,12.9625 Z M 26,13 c 0,4.9706 -4.0294,9 -9,9 -4.9706,0 -9,-4.0294 -9,-9 0,-4.97056 4.0294,-9 9,-9 4.9706,0 9,4.02944 9,9 z" />
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M 25.9405,4.72663 C 23.9805,2.54472 21.024,1.0625 17,1.0625 12.976,1.0625 10.0195,2.54472 8.05955,4.72663 6.08332,6.92661 5.0625,9.90415 5.0625,12.9625 c 0,4.5792 2.98827,8.8264 6.1893,12.0321 1.5789,1.5811 3.1617,2.8611 4.3512,3.7461 0.575,0.4279 1.0559,0.7618 1.397,0.9912 0.3411,-0.2294 0.822,-0.5633 1.397,-0.9912 1.1895,-0.885 2.7723,-2.165 4.3512,-3.7461 3.201,-3.2057 6.1893,-7.4529 6.1893,-12.0321 0,-3.05835 -1.0208,-6.03589 -2.997,-8.23587 z M 17,31 C 17,31 4,23 4,12.9625 4,6.39011 8.38434,0 17,0 25.6157,0 30,6.39011 30,12.9625 30,23 17,31 17,31 Z M 27.0625,13 C 27.0625,18.5574 22.5574,23.0625 17,23.0625 11.4426,23.0625 6.9375,18.5574 6.9375,13 6.9375,7.44263 11.4426,2.9375 17,2.9375 22.5574,2.9375 27.0625,7.44263 27.0625,13 Z M 17,22 c 4.9706,0 9,-4.0294 9,-9 0,-4.97056 -4.0294,-9 -9,-9 -4.9706,0 -9,4.02944 -9,9 0,4.9706 4.0294,9 9,9 z" style="filter:url(#stroke-filter)" />
+  <path d="m 22.8354,28.0406 c 1.4074,0.4506 2.4115,1.0531 2.8759,1.7258 0.4644,0.6727 0.3667,1.3828 -0.28,2.0338 -0.6467,0.651 -1.811,1.2114 -3.3345,1.605 -1.5236,0.3935 -3.3325,0.6011 -5.181,0.5947 C 15.0674,33.9934 13.2691,33.773 11.7654,33.3688 10.2617,32.9646 9.12552,32.3962 8.51132,31.7407 7.89712,31.0852 7.83469,30.3746 8.3325,29.7053 8.83031,29.036 9.86422,28.4406 11.2937,28 L 12.5,29 c -0.5,0 -1.4662,0.4623 -1.8298,0.9511 -0.3635,0.4887 -0.3179,1.0077 0.1306,1.4864 0.4486,0.4787 1.2783,0.8938 2.3764,1.189 1.0982,0.2952 2.4114,0.4561 3.7613,0.4608 1.3499,0.0048 2.671,-0.1469 3.7836,-0.4343 1.1126,-0.2874 1.9629,-0.6966 2.4352,-1.1721 0.4722,-0.4754 0.5436,-0.994 0.2045,-1.4852 C 23.0226,29.5044 22,29 21.5,29 Z" style="filter:url(#stroke-filter)" />
+  <defs>
+    <filter
+      id="stroke-filter"
+      style="color-interpolation-filters:sRGB"
+      x="0" y="0" width="1" height="1">
+        <feColorMatrix values="0.6 0 0 0 0 0 0.6 0 0 0 0 0 0.6 0 0 0 0 0 1 0" />
+    </filter>
+  </defs>
+</svg>

ui-ngx/src/assets/markers/shape1.svg

@@ -1,19 +1,22 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" class="marker-color" fill="#307FE5">
-  <g filter="url(#filter0_bf_8816_263887)">
+  <g filter="url(#shadow-filter)">
-    <path d="M19 24.5C17.4075 27.4125 17 33 17 33C17 33 27.0858 32.1955 30.9992 27.4998C34 23.8992 31.9992 19 27.9992 19C23.9993 19 21.1929 20.4894 19 24.5Z" fill="black" fill-opacity="0.24"/>
+    <path class="marker-opacity" d="M19 24.5C17.4075 27.4125 17 33 17 33C17 33 27.0858 32.1955 30.9992 27.4998C34 23.8992 31.9992 19 27.9992 19C23.9993 19 21.1929 20.4894 19 24.5Z" fill="black" fill-opacity="0.24"/>
   </g>
-  <mask id="path-2-inside-1_8816_263887" fill="white">
-    <path fill-rule="evenodd" clip-rule="evenodd" d="M28 11.9C28.0037 5.32761 24.2902 0 17 0C9.70983 0 5.9963 5.32761 6 11.9C6.00473 20.2937 17 34 17 34C17 34 27.9953 20.2937 28 11.9ZM21.25 10.625C21.25 12.9722 19.3472 14.875 17 14.875C14.6528 14.875 12.75 12.9722 12.75 10.625C12.75 8.27779 14.6528 6.375 17 6.375C19.3472 6.375 21.25 8.27779 21.25 10.625Z"/>
-  </mask>
   <path fill-rule="evenodd" clip-rule="evenodd" d="M28 11.9C28.0037 5.32761 24.2902 0 17 0C9.70983 0 5.9963 5.32761 6 11.9C6.00473 20.2937 17 34 17 34C17 34 27.9953 20.2937 28 11.9ZM21.25 10.625C21.25 12.9722 19.3472 14.875 17 14.875C14.6528 14.875 12.75 12.9722 12.75 10.625C12.75 8.27779 14.6528 6.375 17 6.375C19.3472 6.375 21.25 8.27779 21.25 10.625Z"/>
-  <path d="M28 11.9L29.0625 11.9006L28 11.9ZM6 11.9L7.0625 11.8994L6 11.9ZM17 34L16.1712 34.6649L17 35.698L17.8288 34.6649L17 34ZM17 1.0625C20.3641 1.0625 22.8085 2.28006 24.4273 4.17539C26.0652 6.09323 26.9392 8.80331 26.9375 11.8994L29.0625 11.9006C29.0644 8.4243 28.0835 5.18438 26.0431 2.79532C23.9835 0.383742 20.9261 -1.0625 17 -1.0625V1.0625ZM7.0625 11.8994C7.06076 8.80331 7.93477 6.09323 9.57274 4.17539C11.1915 2.28006 13.6359 1.0625 17 1.0625V-1.0625C13.0739 -1.0625 10.0165 0.383741 7.95686 2.79532C5.91645 5.18438 4.93555 8.4243 4.9375 11.9006L7.0625 11.8994ZM17 34C17.8288 33.3351 17.8288 33.3352 17.8288 33.3352C17.8288 33.3352 17.8288 33.3351 17.8287 33.335C17.8285 33.3348 17.8281 33.3343 17.8276 33.3336C17.8265 33.3323 17.8248 33.3301 17.8224 33.3271C17.8176 33.3212 17.8103 33.312 17.8004 33.2995C17.7807 33.2747 17.7509 33.2371 17.7118 33.1874C17.6335 33.0878 17.5178 32.9395 17.37 32.7472C17.0742 32.3624 16.6503 31.8017 16.1409 31.1019C15.1214 29.7014 13.7634 27.7495 12.4071 25.5415C11.049 23.3306 9.70388 20.8813 8.70091 18.4841C7.69109 16.0706 7.06357 13.7921 7.0625 11.8994L4.9375 11.9006C4.9388 14.2048 5.68746 16.7873 6.74058 19.3043C7.80055 21.8378 9.20516 24.3889 10.5964 26.6538C11.9895 28.9216 13.3807 30.9209 14.4229 32.3526C14.9444 33.0689 15.3795 33.6446 15.6851 34.0422C15.8379 34.241 15.9584 34.3954 16.0412 34.5007C16.0826 34.5534 16.1146 34.5938 16.1365 34.6213C16.1474 34.6351 16.1559 34.6456 16.1617 34.6529C16.1646 34.6566 16.1668 34.6594 16.1684 34.6614C16.1692 34.6624 16.1699 34.6632 16.1703 34.6637C16.1706 34.664 16.1708 34.6643 16.1709 34.6645C16.1711 34.6647 16.1712 34.6649 17 34ZM26.9375 11.8994C26.9364 13.7921 26.3089 16.0706 25.2991 18.4841C24.2961 20.8813 22.951 23.3306 21.5929 25.5415C20.2366 27.7495 18.8786 29.7014 17.8591 31.1019C17.3497 31.8017 16.9258 32.3624 16.63 32.7472C16.4822 32.9395 16.3665 33.0878 16.2882 33.1874C16.2491 33.2371 16.2193 33.2747 16.1996 33.2995C16.1897 33.312 16.1824 33.3212 16.1776 33.3271C16.1752 33.3301 16.1735 33.3323 16.1724 33.3336C16.1719 33.3343 16.1715 33.3348 16.1713 33.335C16.1712 33.3351 16.1712 33.3352 16.1712 33.3352C16.1712 33.3352 16.1712 33.3351 17 34C17.8288 34.6649 17.8289 34.6647 17.8291 34.6645C17.8292 34.6643 17.8294 34.664 17.8297 34.6637C17.8301 34.6632 17.8308 34.6624 17.8316 34.6614C17.8332 34.6594 17.8354 34.6566 17.8383 34.6529C17.8441 34.6456 17.8526 34.6351 17.8635 34.6213C17.8854 34.5938 17.9174 34.5534 17.9588 34.5007C18.0416 34.3954 18.1621 34.241 18.3149 34.0422C18.6205 33.6446 19.0556 33.0689 19.5771 32.3526C20.6193 30.9209 22.0105 28.9216 23.4036 26.6538C24.7948 24.3889 26.1995 21.8378 27.2594 19.3043C28.3125 16.7873 29.0612 14.2048 29.0625 11.9006L26.9375 11.8994ZM17 15.9375C19.934 15.9375 22.3125 13.559 22.3125 10.625H20.1875C20.1875 12.3854 18.7604 13.8125 17 13.8125V15.9375ZM11.6875 10.625C11.6875 13.559 14.066 15.9375 17 15.9375V13.8125C15.2396 13.8125 13.8125 12.3854 13.8125 10.625H11.6875ZM17 5.3125C14.066 5.3125 11.6875 7.69099 11.6875 10.625H13.8125C13.8125 8.86459 15.2396 7.4375 17 7.4375V5.3125ZM22.3125 10.625C22.3125 7.69099 19.934 5.3125 17 5.3125V7.4375C18.7604 7.4375 20.1875 8.86459 20.1875 10.625H22.3125Z" fill="black" fill-opacity="0.38" mask="url(#path-2-inside-1_8816_263887)"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M 24.4273,4.17539 C 22.8085,2.28006 20.3641,1.0625 17,1.0625 c -3.3641,0 -5.8085,1.21756 -7.42726,3.11289 -1.63797,1.91784 -2.51198,4.62792 -2.51024,7.72401 0.00107,1.8927 0.62859,4.1712 1.63841,6.5847 1.00297,2.3972 2.34809,4.8465 3.70619,7.0574 1.3563,2.208 2.7143,4.1599 3.7338,5.5604 0.3248,0.4462 0.6149,0.8359 0.8591,1.1594 0.2442,-0.3235 0.5343,-0.7132 0.8591,-1.1594 1.0195,-1.4005 2.3775,-3.3524 3.7338,-5.5604 1.3581,-2.2109 2.7032,-4.6602 3.7062,-7.0574 1.0098,-2.4135 1.6373,-4.692 1.6384,-6.5847 C 26.9392,8.80331 26.0652,6.09323 24.4273,4.17539 Z M 17.6709,33.1352 C 20.0577,29.9988 27.996,19.0318 28,11.9 28.0037,5.32761 24.2902,0 17,0 9.70983,0 5.9963,5.32761 6,11.9 6.00402,19.0318 13.9423,29.9988 16.3291,33.1352 16.7515,33.6902 17,34 17,34 c 0,0 0.2485,-0.3098 0.6709,-0.8648 z M 22.3125,10.625 c 0,2.934 -2.3785,5.3125 -5.3125,5.3125 -2.934,0 -5.3125,-2.3785 -5.3125,-5.3125 0,-2.93401 2.3785,-5.3125 5.3125,-5.3125 2.934,0 5.3125,2.37849 5.3125,5.3125 z M 17,14.875 c 2.3472,0 4.25,-1.9028 4.25,-4.25 0,-2.34721 -1.9028,-4.25 -4.25,-4.25 -2.3472,0 -4.25,1.90279 -4.25,4.25 0,2.3472 1.9028,4.25 4.25,4.25 z" style="filter:url(#stroke-filter)" />
   <defs>
-    <filter id="filter0_bf_8816_263887" x="12.75" y="14.75" width="23.9434" height="22.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+    <filter id="shadow-filter" x="12.75" y="14.75" width="23.9434" height="22.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
       <feFlood flood-opacity="0" result="BackgroundImageFix"/>
       <feGaussianBlur in="BackgroundImageFix" stdDeviation="2.125"/>
-      <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_8816_263887"/>
+      <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_8817_262071"/>
-      <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_8816_263887" result="shape"/>
+      <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_8817_262071" result="shape"/>
-      <feGaussianBlur stdDeviation="0.5" result="effect2_foregroundBlur_8816_263887"/>
+      <feGaussianBlur stdDeviation="0.5" result="effect2_foregroundBlur_8817_262071"/>
+    </filter>
+    <filter
+      id="stroke-filter"
+      style="color-interpolation-filters:sRGB"
+      x="0" y="0" width="1" height="1">
+      <feColorMatrix values="0.6 0 0 0 0 0 0.6 0 0 0 0 0 0.6 0 0 0 0 0 1 0" />
     </filter>
   </defs>
 </svg>

ui-ngx/src/assets/markers/shape10.svg

@@ -1,11 +1,11 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="34" height="35" viewBox="0 0 34 35" fill="none">
+<svg xmlns="http://www.w3.org/2000/svg" width="34" height="35" viewBox="0 0 34 35" class="marker-color" fill="#307FE5">
-  <g filter="url(#filter0_bf_8825_264681)">
+  <g filter="url(#shadow-filter)">
-    <path d="M11.6613 30.2966C10.8905 30.3394 10.7464 31.4155 11.4788 31.6596L17 33.5L22.5212 31.6596C23.2536 31.4155 23.1095 30.3394 22.3387 30.2966L17 30L11.6613 30.2966Z" fill="black" fill-opacity="0.24"/>
+    <path class="marker-opacity" d="M11.6613 30.2966C10.8905 30.3394 10.7464 31.4155 11.4788 31.6596L17 33.5L22.5212 31.6596C23.2536 31.4155 23.1095 30.3394 22.3387 30.2966L17 30L11.6613 30.2966Z" fill="black" fill-opacity="0.24"/>
   </g>
   <rect x="16" width="2" height="34" fill="#575757"/>
-  <path class="marker-color" d="M18.5 0H32.7925C33.2379 0 33.461 0.538571 33.146 0.853553L26.9996 7L33.146 13.1464C33.461 13.4614 33.2379 14 32.7925 14H18.5V0Z" fill="#307FE5"/>
+  <path d="M18.5 0H32.7925C33.2379 0 33.461 0.538571 33.146 0.853553L26.9996 7L33.146 13.1464C33.461 13.4614 33.2379 14 32.7925 14H18.5V0Z"/>
   <defs>
-    <filter id="filter0_bf_8825_264681" x="7" y="26" width="20" height="11.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+    <filter id="shadow-filter" x="7" y="26" width="20" height="11.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
       <feFlood flood-opacity="0" result="BackgroundImageFix"/>
       <feGaussianBlur in="BackgroundImageFix" stdDeviation="2"/>
       <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_8825_264681"/>

ui-ngx/src/assets/markers/shape2.svg

@@ -1,17 +1,23 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" class="marker-color" fill="#307FE5">
-  <g filter="url(#filter0_bf_8816_263882)">
+  <g filter="url(#shadow-filter)">
-    <path d="M19 24.5C17.4075 27.4125 17 33 17 33C17 33 27.0858 32.1955 30.9992 27.4998C34 23.8992 31.9992 19 27.9992 19C23.9993 19 21.1929 20.4894 19 24.5Z" fill="black" fill-opacity="0.24"/>
+    <path class="marker-opacity" d="M19 24.5C17.4075 27.4125 17 33 17 33C17 33 27.0858 32.1955 30.9992 27.4998C34 23.8992 31.9992 19 27.9992 19C23.9993 19 21.1929 20.4894 19 24.5Z" fill="black" fill-opacity="0.24"/>
   </g>
-  <path d="M16.8812 33.8865C16.8452 33.7872 16.6641 33.1184 16.4788 32.4005C15.8927 30.1293 14.8789 27.6872 13.5032 25.2321C12.7133 23.8226 12.5705 23.598 10.2629 20.135C6.53418 14.5396 5.8789 12.9684 6.01669 9.95493C6.14303 7.19334 7.10838 5.12431 9.20388 3.12359C10.9433 1.46297 12.8739 0.5051 15.2223 0.13773C21.0423 -0.772682 26.6886 2.92621 27.8326 8.39854C28.0993 9.67434 28.0401 11.87 27.7068 13.0629C27.3412 14.3714 25.8745 17.0188 23.8016 20.1115C20.0603 25.6936 18.6436 28.4817 17.5828 32.3508C17.1722 33.8487 17.0023 34.2205 16.8812 33.8865Z"/>
+  <path d="M 17,34 C 15,29 13,24 10,20 7,16 6.01823,14.0001 6.01758,9.95494 6.01758,7.00007 7,4.90955 9,3 c 2,-1.90955 5,-3 8,-3 3,0 6,1 8,3 2,2 3.0015,4 3.0009,6.95514 C 28,14 26.9254,16.0995 24,20 c -3,4 -5,9 -7,14 z" />
-  <path d="M10.2663 20.1328L10.705 19.8404C13.012 23.3025 13.1655 23.5428 13.9666 24.9724L13.5032 25.2321L13.9666 24.9724C15.3604 27.4598 16.3936 29.9445 16.9932 32.2677C17.0031 32.3062 17.013 32.3445 17.0229 32.3826C17.0383 32.3272 17.0542 32.2698 17.0705 32.2103C18.1532 28.2612 19.6055 25.4179 23.3603 19.8157L23.8016 20.1115L23.3604 19.8157C24.3907 18.2785 25.2672 16.8565 25.9298 15.6607C26.5985 14.4537 27.0302 13.5105 27.1952 12.9199C27.3454 12.3823 27.4411 11.5835 27.4636 10.7475C27.4861 9.91291 27.4344 9.08999 27.3126 8.50725C26.2313 3.33526 20.8692 -0.207891 15.3044 0.662597C13.0643 1.01301 11.2327 1.92108 9.57073 3.50784M10.2663 20.1328L6.54738 9.97919C6.66715 7.36131 7.56888 5.41915 9.57073 3.50784M10.2663 20.1328L10.705 19.8404C8.83761 17.0382 7.77024 15.287 7.18016 13.8723M10.2663 20.1328L7.18016 13.8723M9.57073 3.50784L9.20388 3.12359L9.57073 3.50784ZM7.18016 13.8723C6.60389 12.4906 6.48125 11.4256 6.54738 9.97921L7.18016 13.8723Z" stroke="black" stroke-opacity="0.38" stroke-width="1.0625"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="m 7.86637,14.5895 c 0.56577,1.3728 1.49038,2.782 2.98363,4.773 2.592,3.4559 4.4489,7.6155 6.15,11.7912 1.7011,-4.1757 3.558,-8.3353 6.15,-11.7912 1.4554,-1.9406 2.3865,-3.352 2.9668,-4.7405 0.5684,-1.36 0.8212,-2.7509 0.8216,-4.6671 C 26.939,7.32272 26.0804,5.58305 24.2487,3.7513 22.493,1.99565 19.7891,1.0625 17,1.0625 14.2338,1.0625 11.5092,2.07329 9.73372,3.76848 7.93379,5.487 7.08011,7.30378 7.08008,9.95477 M 17.5726,32.5716 C 19.3902,28.0562 21.2859,23.6189 24,20 26.9254,16.0995 28,14 28.0009,9.95514 28.0015,7 27,5 25,3 23,1 20,0 17,0 14,0 11,1.09045 9,3 7,4.90955 6.01758,7.00007 6.01758,9.95494 6.01823,14.0001 7,16 10,20 c 2.7141,3.6189 4.6098,8.0562 6.4274,12.5716 0.1914,0.4755 0.382,0.952 0.5726,1.4284 0.1906,-0.4764 0.3812,-0.9529 0.5726,-1.4284 z M 7.86637,14.5895 C 7.3128,13.2463 7.0804,11.8807 7.08008,9.95477 Z" style="filter:url(#stroke-filter)" />
-  <path d="M20 11C20 12.6568 18.6569 14 17 14C15.3432 14 14 12.6568 14 11C14 9.3431 15.3431 8 17 8C18.6569 8 20 9.3431 20 11Z" fill="black" fill-opacity="0.38"/>
+  <path d="m 20,11 c 0,1.6568 -1.3431,3 -3,3 -1.6568,0 -3,-1.3432 -3,-3 0,-1.6569 1.3431,-3 3,-3 1.6569,0 3,1.3431 3,3 z" style="filter:url(#stroke-filter)" />
   <defs>
-    <filter id="filter0_bf_8816_263882" x="12.75" y="14.75" width="23.9434" height="22.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+    <filter id="shadow-filter" x="12.75" y="14.75" width="23.9434" height="22.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
       <feFlood flood-opacity="0" result="BackgroundImageFix"/>
       <feGaussianBlur in="BackgroundImageFix" stdDeviation="2.125"/>
-      <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_8816_263882"/>
+      <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_8817_262071"/>
-      <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_8816_263882" result="shape"/>
+      <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_8817_262071" result="shape"/>
-      <feGaussianBlur stdDeviation="0.5" result="effect2_foregroundBlur_8816_263882"/>
+      <feGaussianBlur stdDeviation="0.5" result="effect2_foregroundBlur_8817_262071"/>
+    </filter>
+    <filter
+      id="stroke-filter"
+      style="color-interpolation-filters:sRGB"
+      x="0" y="0" width="1" height="1">
+      <feColorMatrix values="0.6 0 0 0 0 0 0.6 0 0 0 0 0 0.6 0 0 0 0 0 1 0" />
     </filter>
   </defs>
 </svg>

ui-ngx/src/assets/markers/shape3.svg

@@ -1,19 +1,22 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" fill="none">
+<svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" class="marker-color" fill="#307FE5">
-  <g filter="url(#filter0_bf_8816_263884)">
+  <g filter="url(#shadow-filter)">
-    <path d="M19 24.5C17.4075 27.4125 17 33 17 33C17 33 27.0858 32.1955 30.9992 27.4998C34 23.8992 31.9992 19 27.9992 19C23.9993 19 21.1929 20.4894 19 24.5Z" fill="black" fill-opacity="0.24"/>
+    <path class="marker-opacity" d="M19 24.5C17.4075 27.4125 17 33 17 33C17 33 27.0858 32.1955 30.9992 27.4998C34 23.8992 31.9992 19 27.9992 19C23.9993 19 21.1929 20.4894 19 24.5Z" fill="black" fill-opacity="0.24"/>
   </g>
-  <mask id="path-2-inside-1_8816_263884" fill="white">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M30 12.9625C30 6.39011 25.6157 0 17 0C8.38434 0 4 6.39011 4 12.9625C4 20.1875 17 34 17 34C17 34 30 20.1875 30 12.9625ZM21.25 12.75C21.25 15.0972 19.3472 17 17 17C14.6528 17 12.75 15.0972 12.75 12.75C12.75 10.4028 14.6528 8.5 17 8.5C19.3472 8.5 21.25 10.4028 21.25 12.75Z"/>
-    <path fill-rule="evenodd" clip-rule="evenodd" d="M30 12.9625C30 6.39011 25.6157 0 17 0C8.38434 0 4 6.39011 4 12.9625C4 20.1875 17 34 17 34C17 34 30 20.1875 30 12.9625ZM21.25 12.75C21.25 15.0972 19.3472 17 17 17C14.6528 17 12.75 15.0972 12.75 12.75C12.75 10.4028 14.6528 8.5 17 8.5C19.3472 8.5 21.25 10.4028 21.25 12.75Z"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M 25.9404,4.72663 C 23.9804,2.54472 21.024,1.0625 17,1.0625 12.976,1.0625 10.0195,2.54472 8.05955,4.72663 6.08332,6.92661 5.0625,9.90415 5.0625,12.9625 c 0,1.5374 0.70869,3.5644 1.90856,5.8395 1.18295,2.2431 2.77245,4.5978 4.38054,6.7533 1.6052,2.1516 3.2128,4.0832 4.4204,5.4782 0.4826,0.5574 0.9006,1.0283 1.228,1.3922 0.3274,-0.3639 0.7454,-0.8348 1.2279,-1.3922 1.2076,-1.395 2.8153,-3.3266 4.4205,-5.4782 1.6081,-2.1555 3.1976,-4.5102 4.3805,-6.7533 1.1999,-2.2751 1.9086,-4.3021 1.9086,-5.8395 0,-3.05835 -1.0208,-6.03589 -2.9971,-8.23587 z M 17.7198,33.2141 C 20.4483,30.1888 30,19.1556 30,12.9625 30,6.39011 25.6157,0 17,0 8.38434,0 4,6.39011 4,12.9625 4,19.1556 13.5517,30.1888 16.2802,33.2141 16.7348,33.7182 17,34 17,34 c 0,0 0.2652,-0.2818 0.7198,-0.7859 z M 22.3125,12.75 c 0,2.934 -2.3785,5.3125 -5.3125,5.3125 -2.934,0 -5.3125,-2.3785 -5.3125,-5.3125 0,-2.93401 2.3785,-5.3125 5.3125,-5.3125 2.934,0 5.3125,2.37849 5.3125,5.3125 z M 17,17 c 2.3472,0 4.25,-1.9028 4.25,-4.25 0,-2.3472 -1.9028,-4.25 -4.25,-4.25 -2.3472,0 -4.25,1.9028 -4.25,4.25 0,2.3472 1.9028,4.25 4.25,4.25 z" style="filter:url(#stroke-filter)" />
-  </mask>
-  <path class="marker-color" fill-rule="evenodd" clip-rule="evenodd" d="M30 12.9625C30 6.39011 25.6157 0 17 0C8.38434 0 4 6.39011 4 12.9625C4 20.1875 17 34 17 34C17 34 30 20.1875 30 12.9625ZM21.25 12.75C21.25 15.0972 19.3472 17 17 17C14.6528 17 12.75 15.0972 12.75 12.75C12.75 10.4028 14.6528 8.5 17 8.5C19.3472 8.5 21.25 10.4028 21.25 12.75Z" fill="#307FE5"/>
-  <path d="M17 34L16.2263 34.7282L17 35.5503L17.7737 34.7282L17 34ZM17 1.0625C21.024 1.0625 23.9804 2.54472 25.9404 4.72663C27.9167 6.92661 28.9375 9.90415 28.9375 12.9625H31.0625C31.0625 9.44846 29.8911 5.94475 27.5213 3.30657C25.1352 0.650333 21.5917 -1.0625 17 -1.0625V1.0625ZM5.0625 12.9625C5.0625 9.90415 6.08332 6.92661 8.05955 4.72663C10.0195 2.54472 12.976 1.0625 17 1.0625V-1.0625C12.4083 -1.0625 8.86479 0.650333 6.47871 3.30657C4.10885 5.94475 2.9375 9.44846 2.9375 12.9625H5.0625ZM17 34C17.7737 33.2718 17.7738 33.2718 17.7737 33.2718C17.7737 33.2718 17.7736 33.2717 17.7735 33.2716C17.7732 33.2713 17.7728 33.2708 17.7721 33.2701C17.7708 33.2687 17.7687 33.2664 17.7658 33.2634C17.76 33.2572 17.7512 33.2478 17.7395 33.2352C17.7159 33.21 17.6805 33.1719 17.634 33.1216C17.5409 33.021 17.4036 32.8717 17.2283 32.6784C16.8776 32.292 16.3754 31.7304 15.772 31.0335C14.5644 29.6385 12.9568 27.7069 11.3516 25.5553C9.74351 23.3998 8.15401 21.0451 6.97106 18.802C5.77119 16.5269 5.0625 14.4999 5.0625 12.9625H2.9375C2.9375 15.0376 3.85381 17.4466 5.09144 19.7933C6.34599 22.1721 8.00649 24.6252 9.64839 26.826C11.2932 29.0306 12.9355 31.0036 14.1654 32.4243C14.7809 33.1352 15.2942 33.7092 15.6545 34.1063C15.8347 34.3049 15.9766 34.4593 16.074 34.5646C16.1227 34.6173 16.1603 34.6576 16.1859 34.6851C16.1988 34.6988 16.2086 34.7094 16.2154 34.7166C16.2187 34.7202 16.2213 34.7229 16.2232 34.7249C16.2241 34.7259 16.2248 34.7266 16.2253 34.7272C16.2256 34.7274 16.2258 34.7277 16.226 34.7278C16.2261 34.7281 16.2263 34.7282 17 34ZM28.9375 12.9625C28.9375 14.4999 28.2288 16.5269 27.0289 18.802C25.846 21.0451 24.2565 23.3998 22.6484 25.5553C21.0432 27.7069 19.4355 29.6385 18.2279 31.0335C17.6246 31.7304 17.1224 32.292 16.7717 32.6784C16.5964 32.8717 16.4591 33.021 16.366 33.1216C16.3195 33.1719 16.2841 33.21 16.2605 33.2352C16.2488 33.2478 16.2399 33.2572 16.2342 33.2634C16.2313 33.2664 16.2292 33.2687 16.2279 33.2701C16.2272 33.2708 16.2268 33.2713 16.2265 33.2716C16.2264 33.2717 16.2263 33.2718 16.2262 33.2718C16.2262 33.2718 16.2263 33.2718 17 34C17.7737 34.7282 17.7739 34.7281 17.774 34.7278C17.7742 34.7277 17.7744 34.7274 17.7747 34.7272C17.7752 34.7266 17.7759 34.7259 17.7768 34.7249C17.7787 34.7229 17.7813 34.7202 17.7846 34.7166C17.7914 34.7094 17.8012 34.6988 17.814 34.6851C17.8397 34.6576 17.8773 34.6173 17.926 34.5646C18.0234 34.4593 18.1653 34.3049 18.3455 34.1063C18.7058 33.7092 19.2191 33.1352 19.8345 32.4243C21.0644 31.0036 22.7068 29.0306 24.3516 26.826C25.9935 24.6252 27.654 22.1721 28.9086 19.7933C30.1462 17.4466 31.0625 15.0376 31.0625 12.9625H28.9375ZM17 18.0625C19.934 18.0625 22.3125 15.684 22.3125 12.75H20.1875C20.1875 14.5104 18.7604 15.9375 17 15.9375V18.0625ZM11.6875 12.75C11.6875 15.684 14.066 18.0625 17 18.0625V15.9375C15.2396 15.9375 13.8125 14.5104 13.8125 12.75H11.6875ZM17 7.4375C14.066 7.4375 11.6875 9.81599 11.6875 12.75H13.8125C13.8125 10.9896 15.2396 9.5625 17 9.5625V7.4375ZM22.3125 12.75C22.3125 9.81599 19.934 7.4375 17 7.4375V9.5625C18.7604 9.5625 20.1875 10.9896 20.1875 12.75H22.3125Z" fill="black" fill-opacity="0.38" mask="url(#path-2-inside-1_8816_263884)"/>
   <defs>
-    <filter id="filter0_bf_8816_263884" x="12.75" y="14.75" width="23.9434" height="22.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+    <filter id="shadow-filter" x="12.75" y="14.75" width="23.9434" height="22.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
       <feFlood flood-opacity="0" result="BackgroundImageFix"/>
       <feGaussianBlur in="BackgroundImageFix" stdDeviation="2.125"/>
-      <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_8816_263884"/>
+      <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_8817_262071"/>
-      <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_8816_263884" result="shape"/>
+      <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_8817_262071" result="shape"/>
-      <feGaussianBlur stdDeviation="0.5" result="effect2_foregroundBlur_8816_263884"/>
+      <feGaussianBlur stdDeviation="0.5" result="effect2_foregroundBlur_8817_262071"/>
+    </filter>
+    <filter
+      id="stroke-filter"
+      style="color-interpolation-filters:sRGB"
+      x="0" y="0" width="1" height="1">
+      <feColorMatrix values="0.6 0 0 0 0 0 0.6 0 0 0 0 0 0.6 0 0 0 0 0 1 0" />
     </filter>
   </defs>
 </svg>

ui-ngx/src/assets/markers/shape4.svg

@@ -1,21 +1,24 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" fill="none">
+<svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" class="marker-color" fill="#307FE5">
-  <g filter="url(#filter0_bf_8816_263886)">
+  <g filter="url(#shadow-filter)">
-    <path d="M19 24.5C17.4075 27.4125 17 33 17 33C17 33 27.0858 32.1955 30.9992 27.4998C34 23.8992 31.9992 19 27.9992 19C23.9993 19 21.1929 20.4894 19 24.5Z" fill="black" fill-opacity="0.24"/>
+    <path class="marker-opacity" d="M19 24.5C17.4075 27.4125 17 33 17 33C17 33 27.0858 32.1955 30.9992 27.4998C34 23.8992 31.9992 19 27.9992 19C23.9993 19 21.1929 20.4894 19 24.5Z" fill="black" fill-opacity="0.24"/>
   </g>
-  <mask id="path-2-inside-1_8816_263886" fill="white">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M30 12.9625C30 6.39011 25.6157 0 17 0C8.38434 0 4 6.39011 4 12.9625C4 20.1875 17 34 17 34C17 34 30 20.1875 30 12.9625ZM24 13C24 16.866 20.866 20 17 20C13.134 20 10 16.866 10 13C10 9.13401 13.134 6 17 6C20.866 6 24 9.13401 24 13Z" />
-    <path fill-rule="evenodd" clip-rule="evenodd" d="M30 12.9625C30 6.39011 25.6157 0 17 0C8.38434 0 4 6.39011 4 12.9625C4 20.1875 17 34 17 34C17 34 30 20.1875 30 12.9625ZM24 13C24 16.866 20.866 20 17 20C13.134 20 10 16.866 10 13C10 9.13401 13.134 6 17 6C20.866 6 24 9.13401 24 13Z"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M 25.9404,4.72663 C 23.9804,2.54472 21.024,1.0625 17,1.0625 12.976,1.0625 10.0195,2.54472 8.05955,4.72663 6.08332,6.92661 5.0625,9.90415 5.0625,12.9625 c 0,1.5374 0.70869,3.5644 1.90856,5.8395 1.18295,2.2431 2.77245,4.5978 4.38054,6.7533 1.6052,2.1516 3.2128,4.0832 4.4204,5.4782 0.4826,0.5574 0.9006,1.0283 1.228,1.3922 0.3274,-0.3639 0.7454,-0.8348 1.2279,-1.3922 1.2076,-1.395 2.8153,-3.3266 4.4205,-5.4782 1.6081,-2.1555 3.1976,-4.5102 4.3805,-6.7533 1.1999,-2.2751 1.9086,-4.3021 1.9086,-5.8395 0,-3.05835 -1.0208,-6.03589 -2.9971,-8.23587 z M 17.7198,33.2141 C 20.4483,30.1888 30,19.1556 30,12.9625 30,6.39011 25.6157,0 17,0 8.38434,0 4,6.39011 4,12.9625 4,19.1556 13.5517,30.1888 16.2802,33.2141 16.7348,33.7182 17,34 17,34 c 0,0 0.2652,-0.2818 0.7198,-0.7859 z M 25.0625,13 c 0,4.4528 -3.6097,8.0625 -8.0625,8.0625 -4.4528,0 -8.0625,-3.6097 -8.0625,-8.0625 0,-4.4528 3.6097,-8.0625 8.0625,-8.0625 4.4528,0 8.0625,3.6097 8.0625,8.0625 z M 17,20 c 3.866,0 7,-3.134 7,-7 0,-3.86599 -3.134,-7 -7,-7 -3.866,0 -7,3.13401 -7,7 0,3.866 3.134,7 7,7 z" style="filter:url(#stroke-filter)" />
-  </mask>
+  <path d="M17 19C20.3137 19 23 16.3137 23 13C23 9.68629 20.3137 7 17 7C13.6863 7 11 9.68629 11 13C11 16.3137 13.6863 19 17 19Z" />
-  <path class="marker-color" fill-rule="evenodd" clip-rule="evenodd" d="M30 12.9625C30 6.39011 25.6157 0 17 0C8.38434 0 4 6.39011 4 12.9625C4 20.1875 17 34 17 34C17 34 30 20.1875 30 12.9625ZM24 13C24 16.866 20.866 20 17 20C13.134 20 10 16.866 10 13C10 9.13401 13.134 6 17 6C20.866 6 24 9.13401 24 13Z" fill="#307FE5"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="m 17,18 c 2.7614,0 5,-2.2386 5,-5 0,-2.7614 -2.2386,-5 -5,-5 -2.7614,0 -5,2.2386 -5,5 0,2.7614 2.2386,5 5,5 z m 6,-5 c 0,3.3137 -2.6863,6 -6,6 -3.3137,0 -6,-2.6863 -6,-6 0,-3.31371 2.6863,-6 6,-6 3.3137,0 6,2.68629 6,6 z" style="filter:url(#stroke-filter)" />
-  <path d="M17 34L16.2263 34.7282L17 35.5503L17.7737 34.7282L17 34ZM17 1.0625C21.024 1.0625 23.9804 2.54472 25.9404 4.72663C27.9167 6.92661 28.9375 9.90415 28.9375 12.9625H31.0625C31.0625 9.44846 29.8911 5.94475 27.5213 3.30657C25.1352 0.650333 21.5917 -1.0625 17 -1.0625V1.0625ZM5.0625 12.9625C5.0625 9.90415 6.08332 6.92661 8.05955 4.72663C10.0195 2.54472 12.976 1.0625 17 1.0625V-1.0625C12.4083 -1.0625 8.86479 0.650333 6.47871 3.30657C4.10885 5.94475 2.9375 9.44846 2.9375 12.9625H5.0625ZM17 34C17.7737 33.2718 17.7738 33.2718 17.7737 33.2718C17.7737 33.2718 17.7736 33.2717 17.7735 33.2716C17.7732 33.2713 17.7728 33.2708 17.7721 33.2701C17.7708 33.2687 17.7687 33.2664 17.7658 33.2634C17.76 33.2572 17.7512 33.2478 17.7395 33.2352C17.7159 33.21 17.6805 33.1719 17.634 33.1216C17.5409 33.021 17.4036 32.8717 17.2283 32.6784C16.8776 32.292 16.3754 31.7304 15.772 31.0335C14.5644 29.6385 12.9568 27.7069 11.3516 25.5553C9.74351 23.3998 8.15401 21.0451 6.97106 18.802C5.77119 16.5269 5.0625 14.4999 5.0625 12.9625H2.9375C2.9375 15.0376 3.85381 17.4466 5.09144 19.7933C6.34599 22.1721 8.00649 24.6252 9.64839 26.826C11.2932 29.0306 12.9355 31.0036 14.1654 32.4243C14.7809 33.1352 15.2942 33.7092 15.6545 34.1063C15.8347 34.3049 15.9766 34.4593 16.074 34.5646C16.1227 34.6173 16.1603 34.6576 16.1859 34.6851C16.1988 34.6988 16.2086 34.7094 16.2154 34.7166C16.2187 34.7202 16.2213 34.7229 16.2232 34.7249C16.2241 34.7259 16.2248 34.7266 16.2253 34.7272C16.2256 34.7274 16.2258 34.7277 16.226 34.7278C16.2261 34.7281 16.2263 34.7282 17 34ZM28.9375 12.9625C28.9375 14.4999 28.2288 16.5269 27.0289 18.802C25.846 21.0451 24.2565 23.3998 22.6484 25.5553C21.0432 27.7069 19.4355 29.6385 18.2279 31.0335C17.6246 31.7304 17.1224 32.292 16.7717 32.6784C16.5964 32.8717 16.4591 33.021 16.366 33.1216C16.3195 33.1719 16.2841 33.21 16.2605 33.2352C16.2488 33.2478 16.2399 33.2572 16.2342 33.2634C16.2313 33.2664 16.2292 33.2687 16.2279 33.2701C16.2272 33.2708 16.2268 33.2713 16.2265 33.2716C16.2264 33.2717 16.2263 33.2718 16.2262 33.2718C16.2262 33.2718 16.2263 33.2718 17 34C17.7737 34.7282 17.7739 34.7281 17.774 34.7278C17.7742 34.7277 17.7744 34.7274 17.7747 34.7272C17.7752 34.7266 17.7759 34.7259 17.7768 34.7249C17.7787 34.7229 17.7813 34.7202 17.7846 34.7166C17.7914 34.7094 17.8012 34.6988 17.814 34.6851C17.8397 34.6576 17.8773 34.6173 17.926 34.5646C18.0234 34.4593 18.1653 34.3049 18.3455 34.1063C18.7058 33.7092 19.2191 33.1352 19.8345 32.4243C21.0644 31.0036 22.7068 29.0306 24.3516 26.826C25.9935 24.6252 27.654 22.1721 28.9086 19.7933C30.1462 17.4466 31.0625 15.0376 31.0625 12.9625H28.9375ZM17 21.0625C21.4528 21.0625 25.0625 17.4528 25.0625 13H22.9375C22.9375 16.2792 20.2792 18.9375 17 18.9375V21.0625ZM8.9375 13C8.9375 17.4528 12.5472 21.0625 17 21.0625V18.9375C13.7208 18.9375 11.0625 16.2792 11.0625 13H8.9375ZM17 4.9375C12.5472 4.9375 8.9375 8.5472 8.9375 13H11.0625C11.0625 9.72081 13.7208 7.0625 17 7.0625V4.9375ZM25.0625 13C25.0625 8.5472 21.4528 4.9375 17 4.9375V7.0625C20.2792 7.0625 22.9375 9.72081 22.9375 13H25.0625Z" fill="black" fill-opacity="0.38" mask="url(#path-2-inside-1_8816_263886)"/>
-  <path class="marker-color" d="M17 19C20.3137 19 23 16.3137 23 13C23 9.68629 20.3137 7 17 7C13.6863 7 11 9.68629 11 13C11 16.3137 13.6863 19 17 19Z" fill="#307FE5"/>
-  <path d="M22.5278 13C22.5278 16.0529 20.0529 18.5278 17 18.5278C13.9471 18.5278 11.4722 16.0529 11.4722 13C11.4722 9.94709 13.9471 7.47222 17 7.47222C20.0529 7.47222 22.5278 9.94709 22.5278 13Z" stroke="black" stroke-opacity="0.38" stroke-width="0.944444"/>
   <defs>
-    <filter id="filter0_bf_8816_263886" x="12.75" y="14.75" width="23.9434" height="22.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+    <filter id="shadow-filter" x="12.75" y="14.75" width="23.9434" height="22.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
       <feFlood flood-opacity="0" result="BackgroundImageFix"/>
       <feGaussianBlur in="BackgroundImageFix" stdDeviation="2.125"/>
-      <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_8816_263886"/>
+      <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_8817_262071"/>
-      <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_8816_263886" result="shape"/>
+      <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_8817_262071" result="shape"/>
-      <feGaussianBlur stdDeviation="0.5" result="effect2_foregroundBlur_8816_263886"/>
+      <feGaussianBlur stdDeviation="0.5" result="effect2_foregroundBlur_8817_262071"/>
+    </filter>
+    <filter
+      id="stroke-filter"
+      style="color-interpolation-filters:sRGB"
+      x="0" y="0" width="1" height="1">
+      <feColorMatrix values="0.6 0 0 0 0 0 0.6 0 0 0 0 0 0.6 0 0 0 0 0 1 0" />
     </filter>
   </defs>
 </svg>

ui-ngx/src/assets/markers/shape5.svg

@@ -1,20 +1,23 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" fill="none">
+<svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" class="marker-color" fill="#307FE5">
-  <g filter="url(#filter0_bf_8826_264716)">
+  <g filter="url(#shadow-filter)">
-    <path d="M19 24.5C17.4075 27.4125 17 33 17 33C17 33 27.0858 32.1955 30.9992 27.4998C34 23.8992 31.9992 19 27.9992 19C23.9993 19 21.1929 20.4894 19 24.5Z" fill="black" fill-opacity="0.24"/>
+    <path class="marker-opacity" d="M19 24.5C17.4075 27.4125 17 33 17 33C17 33 27.0858 32.1955 30.9992 27.4998C34 23.8992 31.9992 19 27.9992 19C23.9993 19 21.1929 20.4894 19 24.5Z" fill="black" fill-opacity="0.24"/>
   </g>
-  <path class="marker-color" d="M9 25L17 34L25 25C25 25 23 27 17 27C11 27 9 25 9 25Z" fill="#307FE5"/>
+  <path d="M9 25L17 34L25 25C25 25 23 27 17 27C11 27 9 25 9 25Z" style="filter:url(#stroke-filter)" />
-  <path d="M9 25L17 34L25 25C25 25 23 27 17 27C11 27 9 25 9 25Z" fill="black" fill-opacity="0.38"/>
+  <path d="M 30,13 C 30,20.1797 24.1797,26 17,26 9.8203,26 4,20.1797 4,13 4,5.8203 9.8203,0 17,0 24.1797,0 30,5.8203 30,13 Z M 9.99998,13 c 0,3.866 3.13402,7 7.00002,7 3.866,0 7,-3.134 7,-7 C 24,9.13399 20.866,5.99998 17,5.99998 13.134,5.99998 9.99998,9.13399 9.99998,13 Z" />
-  <mask id="path-3-inside-1_8826_264716" fill="white">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M 17,25 C 23.6274,25 29,19.6274 29,13 29,6.37258 23.6274,1 17,1 10.3726,1 5,6.37258 5,13 c 0,6.6274 5.3726,12 12,12 z m 0,-4 C 12.5817,21 8.99998,17.4183 8.99998,13 8.99998,8.58171 12.5817,4.99998 17,4.99998 c 4.4183,0 8,3.58173 8,8.00002 0,4.4183 -3.5817,8 -8,8 z m 0,5 C 24.1797,26 30,20.1797 30,13 30,5.8203 24.1797,0 17,0 9.8203,0 4,5.8203 4,13 4,20.1797 9.8203,26 17,26 Z m 0,-6 C 13.134,20 9.99998,16.866 9.99998,13 9.99998,9.13399 13.134,5.99998 17,5.99998 c 3.866,0 7,3.13401 7,7.00002 0,3.866 -3.134,7 -7,7 z" style="filter:url(#stroke-filter)" />
-    <path d="M30 13C30 20.1797 24.1797 26 17 26C9.8203 26 4 20.1797 4 13C4 5.8203 9.8203 0 17 0C24.1797 0 30 5.8203 30 13ZM9.99998 13C9.99998 16.866 13.134 20 17 20C20.866 20 24 16.866 24 13C24 9.13399 20.866 5.99998 17 5.99998C13.134 5.99998 9.99998 9.13399 9.99998 13Z"/>
-  </mask>
-  <path class="marker-color" d="M30 13C30 20.1797 24.1797 26 17 26C9.8203 26 4 20.1797 4 13C4 5.8203 9.8203 0 17 0C24.1797 0 30 5.8203 30 13ZM9.99998 13C9.99998 16.866 13.134 20 17 20C20.866 20 24 16.866 24 13C24 9.13399 20.866 5.99998 17 5.99998C13.134 5.99998 9.99998 9.13399 9.99998 13Z" fill="#307FE5" stroke="black" stroke-opacity="0.38" stroke-width="2" mask="url(#path-3-inside-1_8826_264716)"/>
   <defs>
-    <filter id="filter0_bf_8826_264716" x="12.75" y="14.75" width="23.9434" height="22.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+    <filter id="shadow-filter" x="12.75" y="14.75" width="23.9434" height="22.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
       <feFlood flood-opacity="0" result="BackgroundImageFix"/>
       <feGaussianBlur in="BackgroundImageFix" stdDeviation="2.125"/>
-      <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_8826_264716"/>
+      <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_8817_262071"/>
-      <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_8826_264716" result="shape"/>
+      <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_8817_262071" result="shape"/>
-      <feGaussianBlur stdDeviation="0.5" result="effect2_foregroundBlur_8826_264716"/>
+      <feGaussianBlur stdDeviation="0.5" result="effect2_foregroundBlur_8817_262071"/>
+    </filter>
+    <filter
+      id="stroke-filter"
+      style="color-interpolation-filters:sRGB"
+      x="0" y="0" width="1" height="1">
+      <feColorMatrix values="0.6 0 0 0 0 0 0.6 0 0 0 0 0 0.6 0 0 0 0 0 1 0" />
     </filter>
   </defs>
 </svg>

ui-ngx/src/assets/markers/shape6.svg

@@ -1,19 +1,22 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" class="marker-color" fill="#307FE5">
-  <g filter="url(#filter0_bf_8817_262071)">
+  <g filter="url(#shadow-filter)">
-    <path d="M19 24.5C17.4075 27.4125 17 33 17 33C17 33 27.0858 32.1955 30.9992 27.4998C34 23.8992 31.9992 19 27.9992 19C23.9993 19 21.1929 20.4894 19 24.5Z" fill="black" fill-opacity="0.24"/>
+    <path class="marker-opacity" d="M19 24.5C17.4075 27.4125 17 33 17 33C17 33 27.0858 32.1955 30.9992 27.4998C34 23.8992 31.9992 19 27.9992 19C23.9993 19 21.1929 20.4894 19 24.5Z" fill="black" fill-opacity="0.24"/>
   </g>
-  <mask id="path-2-inside-1_8817_262071" fill="white">
-    <path fill-rule="evenodd" clip-rule="evenodd" d="M30 12.9625C30 6.39011 25.6157 0 17 0C8.38434 0 4 6.39011 4 12.9625C4 25 17 34 17 34C17 34 30 25 30 12.9625ZM26 13C26 17.9706 21.9706 22 17 22C12.0294 22 8 17.9706 8 13C8 8.02944 12.0294 4 17 4C21.9706 4 26 8.02944 26 13Z"/>
-  </mask>
   <path fill-rule="evenodd" clip-rule="evenodd" d="M30 12.9625C30 6.39011 25.6157 0 17 0C8.38434 0 4 6.39011 4 12.9625C4 25 17 34 17 34C17 34 30 25 30 12.9625ZM26 13C26 17.9706 21.9706 22 17 22C12.0294 22 8 17.9706 8 13C8 8.02944 12.0294 4 17 4C21.9706 4 26 8.02944 26 13Z"/>
-  <path d="M17 34L16.3952 34.8736L17 35.2923L17.6048 34.8736L17 34ZM17 1.0625C21.024 1.0625 23.9805 2.54472 25.9405 4.72663C27.9167 6.92661 28.9375 9.90415 28.9375 12.9625H31.0625C31.0625 9.44846 29.8911 5.94475 27.5213 3.30657C25.1352 0.650333 21.5917 -1.0625 17 -1.0625V1.0625ZM5.0625 12.9625C5.0625 9.90415 6.08332 6.92661 8.05955 4.72663C10.0195 2.54472 12.976 1.0625 17 1.0625V-1.0625C12.4083 -1.0625 8.86479 0.650333 6.47871 3.30657C4.10885 5.94475 2.9375 9.44846 2.9375 12.9625H5.0625ZM17 34C17.6048 33.1264 17.605 33.1266 17.6052 33.1267C17.6052 33.1267 17.6053 33.1268 17.6053 33.1268C17.6052 33.1267 17.605 33.1266 17.6046 33.1263C17.6037 33.1257 17.6021 33.1245 17.5997 33.1229C17.5949 33.1195 17.587 33.114 17.5762 33.1063C17.5546 33.091 17.5211 33.0672 17.4766 33.035C17.3876 32.9706 17.2545 32.8729 17.0835 32.7432C16.7414 32.4838 16.2486 32.0971 15.6553 31.5948C14.4672 30.5889 12.884 29.126 11.3033 27.2999C8.11939 23.6215 5.0625 18.605 5.0625 12.9625H2.9375C2.9375 19.3575 6.38061 24.8597 9.69665 28.6907C11.366 30.6193 13.0328 32.1588 14.2822 33.2166C14.9077 33.7461 15.4305 34.1565 15.7993 34.4363C15.9838 34.5763 16.13 34.6836 16.2314 34.7569C16.2821 34.7936 16.3216 34.8218 16.3492 34.8413C16.363 34.851 16.3738 34.8586 16.3815 34.864C16.3853 34.8667 16.3884 34.8688 16.3907 34.8704C16.3918 34.8712 16.3928 34.8719 16.3935 34.8724C16.3939 34.8727 16.3943 34.873 16.3945 34.8731C16.3949 34.8734 16.3952 34.8736 17 34ZM28.9375 12.9625C28.9375 18.605 25.8806 23.6215 22.6966 27.2999C21.116 29.126 19.5328 30.5889 18.3447 31.5948C17.7514 32.0971 17.2586 32.4838 16.9165 32.7432C16.7455 32.8729 16.6124 32.9706 16.5234 33.035C16.4789 33.0672 16.4454 33.091 16.4238 33.1063C16.413 33.114 16.4051 33.1195 16.4003 33.1229C16.3979 33.1245 16.3963 33.1257 16.3954 33.1263C16.395 33.1266 16.3948 33.1267 16.3947 33.1268C16.3947 33.1268 16.3948 33.1267 16.3948 33.1267C16.395 33.1266 16.3952 33.1264 17 34C17.6048 34.8736 17.6051 34.8734 17.6055 34.8731C17.6057 34.873 17.6061 34.8727 17.6065 34.8724C17.6072 34.8719 17.6082 34.8712 17.6093 34.8704C17.6116 34.8688 17.6147 34.8667 17.6185 34.864C17.6262 34.8586 17.637 34.851 17.6508 34.8413C17.6784 34.8218 17.7179 34.7936 17.7686 34.7569C17.87 34.6836 18.0162 34.5763 18.2007 34.4363C18.5695 34.1565 19.0923 33.7461 19.7178 33.2166C20.9672 32.1588 22.634 30.6193 24.3034 28.6907C27.6194 24.8597 31.0625 19.3575 31.0625 12.9625H28.9375ZM17 23.0625C22.5574 23.0625 27.0625 18.5574 27.0625 13H24.9375C24.9375 17.3838 21.3838 20.9375 17 20.9375V23.0625ZM6.9375 13C6.9375 18.5574 11.4426 23.0625 17 23.0625V20.9375C12.6162 20.9375 9.0625 17.3838 9.0625 13H6.9375ZM17 2.9375C11.4426 2.9375 6.9375 7.44263 6.9375 13H9.0625C9.0625 8.61624 12.6162 5.0625 17 5.0625V2.9375ZM27.0625 13C27.0625 7.44263 22.5574 2.9375 17 2.9375V5.0625C21.3838 5.0625 24.9375 8.61624 24.9375 13H27.0625Z" fill="black" fill-opacity="0.38" mask="url(#path-2-inside-1_8817_262071)"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M 25.9405,4.72663 C 23.9805,2.54472 21.024,1.0625 17,1.0625 12.976,1.0625 10.0195,2.54472 8.05955,4.72663 6.08332,6.92661 5.0625,9.90415 5.0625,12.9625 c 0,5.6425 3.05689,10.659 6.2408,14.3374 1.5807,1.8261 3.1639,3.289 4.352,4.2949 0.5466,0.4628 1.008,0.8274 1.3447,1.0849 0.3367,-0.2575 0.7981,-0.6221 1.3447,-1.0849 1.1881,-1.0059 2.7713,-2.4688 4.3519,-4.2949 3.184,-3.6784 6.2409,-8.6949 6.2409,-14.3374 0,-3.05835 -1.0208,-6.03589 -2.997,-8.23587 z M 17,34 C 17,34 4,25 4,12.9625 4,6.39011 8.38434,0 17,0 25.6157,0 30,6.39011 30,12.9625 30,25 17,34 17,34 Z M 27.0625,13 C 27.0625,18.5574 22.5574,23.0625 17,23.0625 11.4426,23.0625 6.9375,18.5574 6.9375,13 6.9375,7.44263 11.4426,2.9375 17,2.9375 22.5574,2.9375 27.0625,7.44263 27.0625,13 Z M 17,22 c 4.9706,0 9,-4.0294 9,-9 0,-4.97056 -4.0294,-9 -9,-9 -4.9706,0 -9,4.02944 -9,9 0,4.9706 4.0294,9 9,9 z" style="filter:url(#stroke-filter)" />
   <defs>
-    <filter id="filter0_bf_8817_262071" x="12.75" y="14.75" width="23.9434" height="22.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+    <filter id="shadow-filter" x="12.75" y="14.75" width="23.9434" height="22.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
       <feFlood flood-opacity="0" result="BackgroundImageFix"/>
       <feGaussianBlur in="BackgroundImageFix" stdDeviation="2.125"/>
       <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_8817_262071"/>
       <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_8817_262071" result="shape"/>
       <feGaussianBlur stdDeviation="0.5" result="effect2_foregroundBlur_8817_262071"/>
     </filter>
+    <filter
+      id="stroke-filter"
+      style="color-interpolation-filters:sRGB"
+      x="0" y="0" width="1" height="1">
+      <feColorMatrix values="0.6 0 0 0 0 0 0.6 0 0 0 0 0 0.6 0 0 0 0 0 1 0" />
+    </filter>
   </defs>
 </svg>

ui-ngx/src/assets/markers/shape7.svg

@@ -1,6 +1,6 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" fill="none">
-  <g filter="url(#filter0_bf_8816_263885)">
+  <g filter="url(#shadow-filter)">
-    <path d="M19 24.5C17.4075 27.4125 17 33 17 33C17 33 27.0858 32.1955 30.9992 27.4998C34 23.8992 31.9992 19 27.9992 19C23.9993 19 21.1929 20.4894 19 24.5Z" fill="black" fill-opacity="0.24"/>
+    <path class="marker-opacity" d="M19 24.5C17.4075 27.4125 17 33 17 33C17 33 27.0858 32.1955 30.9992 27.4998C34 23.8992 31.9992 19 27.9992 19C23.9993 19 21.1929 20.4894 19 24.5Z" fill="black" fill-opacity="0.24"/>
   </g>
   <path class="marker-color" d="M9.5 23L17 34L24.5 23C24.5 23 22 25.5 17 25.5C12 25.5 9.5 23 9.5 23Z" fill="#307FE5"/>
   <path d="M9.5 23L17 34L24.5 23C24.5 23 22 25.5 17 25.5C12 25.5 9.5 23 9.5 23Z" fill="black" fill-opacity="0.38"/>
@@ -9,12 +9,12 @@
   <path class="marker-stroke" d="M28 13C28 19.0749 23.0753 24 17 24C10.9251 24 6 19.0753 6 13C6 6.92506 10.9247 2 17 2C23.0749 2 28 6.92473 28 13Z" stroke="#307FE5" stroke-width="3.1875"/>
   <path d="M28 13C28 19.0749 23.0753 24 17 24C10.9251 24 6 19.0753 6 13C6 6.92506 10.9247 2 17 2C23.0749 2 28 6.92473 28 13Z" stroke="url(#paint1_linear_8816_263885)" stroke-width="3.1875"/>
   <defs>
-    <filter id="filter0_bf_8816_263885" x="12.75" y="14.75" width="23.9434" height="22.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+    <filter id="shadow-filter" x="12.75" y="14.75" width="23.9434" height="22.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
       <feFlood flood-opacity="0" result="BackgroundImageFix"/>
       <feGaussianBlur in="BackgroundImageFix" stdDeviation="2.125"/>
-      <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_8816_263885"/>
+      <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_8817_262071"/>
-      <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_8816_263885" result="shape"/>
+      <feBlend mode="normal" in="SourceGraphic" in2="effect1_backgroundBlur_8817_262071" result="shape"/>
-      <feGaussianBlur stdDeviation="0.5" result="effect2_foregroundBlur_8816_263885"/>
+      <feGaussianBlur stdDeviation="0.5" result="effect2_foregroundBlur_8817_262071"/>
     </filter>
     <radialGradient id="paint0_radial_8816_263885" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(21.4 5.3) rotate(126.87) scale(13.75 14.648)">
       <stop stop-opacity="0.25"/>

ui-ngx/src/assets/markers/shape8.svg

@@ -1,12 +1,12 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="34" height="35" viewBox="0 0 34 35" fill="none">
+<svg xmlns="http://www.w3.org/2000/svg" width="34" height="35" viewBox="0 0 34 35" class="marker-color" fill="#307FE5">
-  <circle class="marker-color" cx="17" cy="8" r="8" fill="#307FE5"/>
+  <circle cx="17" cy="8" r="8"/>
-  <g filter="url(#filter0_bf_8816_263881)">
+  <g filter="url(#shadow-filter)">
-    <path d="M11.6613 30.2966C10.8905 30.3394 10.7464 31.4155 11.4788 31.6596L17 33.5L22.5212 31.6596C23.2536 31.4155 23.1095 30.3394 22.3387 30.2966L17 30L11.6613 30.2966Z" fill="black" fill-opacity="0.24"/>
+    <path class="marker-opacity" d="M11.6613 30.2966C10.8905 30.3394 10.7464 31.4155 11.4788 31.6596L17 33.5L22.5212 31.6596C23.2536 31.4155 23.1095 30.3394 22.3387 30.2966L17 30L11.6613 30.2966Z" fill="black" fill-opacity="0.24"/>
   </g>
   <circle cx="20" cy="5" r="1" fill="white"/>
   <rect x="16" y="16" width="2" height="18" fill="#575757"/>
   <defs>
-    <filter id="filter0_bf_8816_263881" x="7" y="26" width="20" height="11.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+    <filter id="shadow-filter" x="7" y="26" width="20" height="11.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
       <feFlood flood-opacity="0" result="BackgroundImageFix"/>
       <feGaussianBlur in="BackgroundImageFix" stdDeviation="2"/>
       <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_8816_263881"/>

ui-ngx/src/assets/markers/shape9.svg

@@ -1,14 +1,14 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="34" height="35" viewBox="0 0 34 35" fill="none">
+<svg xmlns="http://www.w3.org/2000/svg" width="34" height="35" viewBox="0 0 34 35" class="marker-color" fill="#307FE5">
-  <g filter="url(#filter0_bf_8817_262059)">
+  <g filter="url(#shadow-filter)">
-    <path d="M11.6613 30.2966C10.8905 30.3394 10.7464 31.4155 11.4788 31.6596L17 33.5L22.5212 31.6596C23.2536 31.4155 23.1095 30.3394 22.3387 30.2966L17 30L11.6613 30.2966Z" fill="black" fill-opacity="0.24"/>
+    <path class="marker-opacity" d="M11.6613 30.2966C10.8905 30.3394 10.7464 31.4155 11.4788 31.6596L17 33.5L22.5212 31.6596C23.2536 31.4155 23.1095 30.3394 22.3387 30.2966L17 30L11.6613 30.2966Z" fill="black" fill-opacity="0.24"/>
   </g>
-  <path class="marker-color" d="M23.9551 5.67547e-07C23.9551 0.85254 23.7799 1.69673 23.4394 2.48438C23.099 3.27202 22.6 3.98769 21.9709 4.59053C19.3203 7.1305 14.6797 7.1305 12.0291 4.59053C11.4 3.98769 10.901 3.27202 10.5606 2.48438C10.2201 1.69673 10.0449 0.85254 10.0449 0L23.9551 5.67547e-07Z" fill="#307FE5"/>
+  <path d="M23.9551 5.67547e-07C23.9551 0.85254 23.7799 1.69673 23.4394 2.48438C23.099 3.27202 22.6 3.98769 21.9709 4.59053C19.3203 7.1305 14.6797 7.1305 12.0291 4.59053C11.4 3.98769 10.901 3.27202 10.5606 2.48438C10.2201 1.69673 10.0449 0.85254 10.0449 0L23.9551 5.67547e-07Z"/>
-  <path class="marker-color" d="M26 20C26 18.8674 25.7672 17.9327 25.3149 16.8863C24.8626 15.84 24.1997 14.8892 23.364 14.0884C19.8889 10.7584 14.1111 10.7584 10.636 14.0884C9.80031 14.8892 9.13738 15.84 8.68508 16.8863C8.23279 17.9327 8 18.8674 8 20L26 20Z" fill="#307FE5"/>
+  <path d="M26 20C26 18.8674 25.7672 17.9327 25.3149 16.8863C24.8626 15.84 24.1997 14.8892 23.364 14.0884C19.8889 10.7584 14.1111 10.7584 10.636 14.0884C9.80031 14.8892 9.13738 15.84 8.68508 16.8863C8.23279 17.9327 8 18.8674 8 20L26 20Z"/>
-  <path class="marker-color" d="M13.5558 5.68641H20.4442L20.6593 12.3206H13.3407L13.5558 5.68641Z" fill="#307FE5"/>
+  <path d="M13.5558 5.68641H20.4442L20.6593 12.3206H13.3407L13.5558 5.68641Z"/>
   <path d="M21.5413 15.1083C21.7082 15.5465 21.9575 16.817 21.5568 16.9696C21.1562 17.1223 20.1818 15.5475 19.8243 15.1441C19.3333 14.5891 18.9 13.6576 19.8587 13.6026C20.8175 13.5476 21.3743 14.6702 21.5413 15.1083Z" fill="white"/>
   <rect x="16" y="20" width="2" height="14" fill="#575757"/>
   <defs>
-    <filter id="filter0_bf_8817_262059" x="7" y="26" width="20" height="11.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+    <filter id="shadow-filter" x="7" y="26" width="20" height="11.5" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
       <feFlood flood-opacity="0" result="BackgroundImageFix"/>
       <feGaussianBlur in="BackgroundImageFix" stdDeviation="2"/>
       <feComposite in2="SourceAlpha" operator="in" result="effect1_backgroundBlur_8817_262059"/>

ui-ngx/src/assets/markers/tripIconContainer1.svg

@@ -1,12 +1,23 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" class="marker-color" fill="#307FE5">
-  <circle cx="17" cy="17" r="17"/>
+  <circle cx="17" cy="17" r="17" mask="url(#icon-mask)"/>
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M 17,33 C 25.8366,33 33,25.8366 33,17 33,8.16344 25.8366,1 17,1 8.16344,1 1,8.16344 1,17 1,25.8366 8.16344,33 17,33 Z m 0,1 C 26.3888,34 34,26.3888 34,17 34,7.61116 26.3888,0 17,0 7.61116,0 0,7.61116 0,17 0,26.3888 7.61116,34 17,34 Z"
+  <circle cx="17" cy="17" r="17" mask="url(#icon-mask-2)" fill="#fff"/>
-    style="filter:url(#filter2)" />
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M 17,33 C 25.8366,33 33,25.8366 33,17 33,8.16344 25.8366,1 17,1 8.16344,1 1,8.16344 1,17 1,25.8366 8.16344,33 17,33 Z m 0,1 C 26.3888,34 34,26.3888 34,17 34,7.61116 26.3888,0 17,0 7.61116,0 0,7.61116 0,17 0,26.3888 7.61116,34 17,34 Z" style="filter:url(#stroke-filter)" />
-  <g class="marker-icon-container" transform="translate(17,17)" fill="#ffffff">
+  <mask id="icon-mask" class="icon-mask-exclude">
-  </g>
+    <g class="marker-icon-container" transform="translate(17,17)">
+      <rect width="100%" height="100%" fill="#fff" transform="translate(-17,-17)"></rect>
+    </g>
+  </mask>
+  <mask id="icon-mask-2" class="icon-mask-overlay">
+    <g class="marker-icon-container" transform="translate(17,17)">
+      <rect width="100%" height="100%" fill="#000" transform="translate(-17,-17)"></rect>
+    </g>
+  </mask>
   <defs>
-    <filter id="filter2" color-interpolation-filters="sRGB" x="0" y="0" width="1" height="1">
+    <filter
-      <feColorMatrix id="feColorMatrix2" values="0.60000000 0.0000000 0.0000000 0.0000000 0.0000000 0.0000000 0.60000000 0.0000000 0.0000000 0.0000000 0.0000000 0.0000000 0.60000000 0.0000000 0.0000000 0.0000000 0.0000000 0.0000000 1.0000000 0.0000000 " />
+      id="stroke-filter"
+      style="color-interpolation-filters:sRGB"
+      x="0" y="0" width="1" height="1">
+      <feColorMatrix values="0.6 0 0 0 0 0 0.6 0 0 0 0 0 0.6 0 0 0 0 0 1 0" />
     </filter>
   </defs>
 </svg>

ui-ngx/src/assets/markers/tripIconContainer2.svg

@@ -0,0 +1,24 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" class="marker-color" fill="#307FE5">
+  <circle cx="17" cy="17" r="17" mask="url(#icon-mask)"/>
+  <circle cx="17" cy="17" r="17" mask="url(#icon-mask-2)" fill="#fff"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M 17,31 C 24.732,31 31,24.732 31,17 31,9.26801 24.732,3 17,3 9.26801,3 3,9.26801 3,17 3,24.732 9.26801,31 17,31 Z m 0,3 C 26.3888,34 34,26.3888 34,17 34,7.61116 26.3888,0 17,0 7.61116,0 0,7.61116 0,17 0,26.3888 7.61116,34 17,34 Z" style="filter:url(#stroke-filter)" />
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M 17,29 C 23.6274,29 29,23.6274 29,17 29,10.3726 23.6274,5 17,5 10.3726,5 5,10.3726 5,17 c 0,6.6274 5.3726,12 12,12 z m 0,1 C 24.1797,30 30,24.1797 30,17 30,9.8203 24.1797,4 17,4 9.8203,4 4,9.8203 4,17 4,24.1797 9.8203,30 17,30 Z" style="filter:url(#stroke-filter)" />
+  <mask id="icon-mask" class="icon-mask-exclude">
+    <g class="marker-icon-container" transform="translate(17,17)">
+      <rect width="100%" height="100%" fill="#fff" transform="translate(-17,-17)"></rect>
+    </g>
+  </mask>
+  <mask id="icon-mask-2" class="icon-mask-overlay">
+    <g class="marker-icon-container" transform="translate(17,17)">
+      <rect width="100%" height="100%" fill="#000" transform="translate(-17,-17)"></rect>
+    </g>
+  </mask>
+  <defs>
+    <filter
+      id="stroke-filter"
+      style="color-interpolation-filters:sRGB"
+      x="0" y="0" width="1" height="1">
+      <feColorMatrix values="0.6 0 0 0 0 0 0.6 0 0 0 0 0 0.6 0 0 0 0 0 1 0" />
+    </filter>
+  </defs>
+</svg>

ui-ngx/src/assets/markers/tripIconContainer3.svg

@@ -0,0 +1,28 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" class="marker-color" fill="#307FE5">
+  <circle cx="17" cy="17" r="17" mask="url(#stroke-mask)"/>
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M 17,33 C 25.8366,33 33,25.8366 33,17 33,8.16344 25.8366,1 17,1 8.16344,1 1,8.16344 1,17 1,25.8366 8.16344,33 17,33 Z m 0,1 C 26.3888,34 34,26.3888 34,17 34,7.61116 26.3888,0 17,0 7.61116,0 0,7.61116 0,17 0,26.3888 7.61116,34 17,34 Z" style="filter:url(#stroke-filter)" />
+  <mask id="stroke-mask">
+    <circle cx="17" cy="17" r="17" fill="#fff" />
+    <circle cx="17" cy="17" r="12" fill="#000" />
+  </mask>
+  <circle cx="17" cy="17" r="12" style="filter:url(#stroke-filter)" mask="url(#icon-mask)"/>
+  <circle cx="17" cy="17" r="12" mask="url(#icon-mask-2)" fill="#fff"/>
+  <mask id="icon-mask" class="icon-mask-exclude">
+    <g class="marker-icon-container" transform="translate(17,17)">
+      <circle cx="17" cy="17" r="17" transform="translate(-17,-17)" fill="#fff"></circle>
+    </g>
+  </mask>
+  <mask id="icon-mask-2" class="icon-mask-overlay">
+    <g class="marker-icon-container" transform="translate(17,17)">
+      <rect width="100%" height="100%" fill="#000" transform="translate(-17,-17)"></rect>
+    </g>
+  </mask>
+  <defs>
+    <filter
+      id="stroke-filter"
+      style="color-interpolation-filters:sRGB"
+      x="0" y="0" width="1" height="1">
+      <feColorMatrix values="0.6 0 0 0 0 0 0.6 0 0 0 0 0 0.6 0 0 0 0 0 1 0" />
+    </filter>
+  </defs>
+</svg>

ui-ngx/src/assets/markers/tripShape10.svg

@@ -1,10 +1,13 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" class="marker-color" fill="#307FE5">
   <path fill-rule="evenodd" clip-rule="evenodd" d="M 34,20 V 14 C 34,11.2695 33,10.0174 31.5632,10.0174 31.5632,9.5 31,9 30.2511,9 v 1.0174 H 1 C 1,10.0174 0,10 0,11 c 0,4.5 0,7.5 0,12 0,1 0,1 1,1 3.72696,-2e-4 26.602,-0.0013 29.2511,0 v 1 C 31,25 31.5632,24.5 31.5632,24 33,24 34,22.7617 34,20 Z m -1.3219,-6.6831 c -0.173,-0.6832 -0.3749,-0.9593 -0.5479,-1.0611 -0.0989,-0.0581 -0.0467,-0.0581 -0.2884,-0.0581 -0.2417,0 -1.5331,1.2209 -1.5331,1.2209 0.7329,0.8554 0.709,6.603 0,7.468 l 1.5331,1.221 c 0.1026,0.0344 0.1977,0.0021 0.2884,-0.0436 0.173,-0.1018 0.3749,-0.378 0.5479,-1.0611 C 32.8223,20.3924 32.9712,19.468 33,18 v -2 c -0.0144,-1.468 -0.1633,-2.0581 -0.3219,-2.6831 z m -7.1709,8.2864 v 1.0029 h 4.1383 c 0,-0.5524 -0.4759,-1.0029 -1.067,-1.0029 z m 0.0144,-0.9202 h 0.3749 v -7.3808 h -0.3749 z m 4.1239,-8.2238 c 0,-0.5523 -0.4759,-1.0029 -1.067,-1.0029 h -3.0713 v 1.0029 z" />
   <path d="m 34.0002,14 v 6 c 0,2.7617 -1,4.0145 -2.4368,4.0145 C 31.4481,24.407 30.8731,25 30.2513,25 V 24.0145 H 24.6577 V 24 C 24.4125,23.9419 24.2251,23.7238 24.2251,23.4622 V 10.5698 c 0,-0.2617 0.1874,-0.5262 0.4326,-0.58434 l 5.5936,0.03194 V 9 c 0.7489,0 1.3121,0.5 1.3121,1.0174 C 33.0002,10 34.0002,11.2695 34.0002,14 Z" fill="#ffffff" />
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M 31.5632,24 C 33,24 34,22.7617 34,20 V 14 C 34,11.2695 33,10.0174 31.5632,10.0174 31.5632,9.5 31,9 30.2511,9 v 1.0174 H 3.60475 L 1,10 C 0.497025,10.0088 0.247034,10.0131 0.122782,10.1403 0,10.266 0,10.5116 0,11 v 12 c 0,0.5 0,0.75 0.125,0.875 C 0.25,24 0.5,24 1,24 h 29.2511 v 1 C 31,25 31.5632,24.5 31.5632,24 Z m 0.567,-11.7442 c 0.173,0.1018 0.3749,0.3779 0.5479,1.0611 C 32.8367,13.9419 32.9856,14.532 33,16 v 2 c -0.0288,1.468 -0.1777,2.3924 -0.3219,3.0029 -0.173,0.6831 -0.3749,0.9593 -0.5479,1.0611 -0.0907,0.0457 -0.1858,0.078 -0.2884,0.0436 l -1.5331,-1.221 c 0.709,-0.865 0.7329,-6.6126 0,-7.468 0,0 1.2914,-1.2209 1.5331,-1.2209 0.1505,0 0.1871,0 0.2171,0.014 0.0096,0.0045 0.0186,0.0105 0.0304,0.0183 0.0105,0.007 0.0233,0.0155 0.0409,0.0258 z m -2.4847,10.34 h -4.1383 v -1.0029 h 3.0713 c 0.5911,0 1.067,0.4506 1.067,1.0029 z m -3.749,-1.9127 h -0.3749 v -7.3808 h 0.3749 z m 2.682,-9.2267 c 0.5911,0 1.067,0.4506 1.067,1.0029 H 25.5072 V 11.4564 Z M 2,23 C 1.42324,23 1.22562,22.9651 1.22562,22.4273 V 11.907 C 1.22562,11.3692 1.42324,11 2,11 h 3.00022 v 0.0144 c 0,0.4612 0.37471,0.8359 0.83588,0.8359 h 2.1041 c 0.46117,0 0.85028,-0.3747 0.85028,-0.8359 V 11 H 16 c 0.0432,0.4323 0.4035,0.7782 0.8359,0.7782 H 18.94 c 0.4467,0 0.807,-0.3459 0.8358,-0.7782 H 22 c 1.0526,0 1.3876,0.3692 1.3876,0.907 V 22.1076 C 23.3876,22.6453 23.0526,23 22,23 h -2.2096 v -0.1007 c 0,-0.4611 -0.3747,-0.8503 -0.8503,-0.8503 H 16.836 c -0.4611,0 -0.8502,0.3747 -0.8502,0.8503 v 0 c 0,0.0288 0,0.0719 0.0143,0.1007 H 8.77878 c 0.02607,-9e-4 0.02607,-0.0144 0.02607,-0.0144 0,-0.4611 -0.3747,-0.8503 -0.85029,-0.8503 h -2.1041 c -0.46117,0 -0.85028,0.3747 -0.85028,0.8503 V 23 Z" style="filter:url(#filter4)" />
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M 31.5632,24 C 33,24 34,22.7617 34,20 V 14 C 34,11.2695 33,10.0174 31.5632,10.0174 31.5632,9.5 31,9 30.2511,9 v 1.0174 H 3.60475 L 1,10 C 0.497025,10.0088 0.247034,10.0131 0.122782,10.1403 0,10.266 0,10.5116 0,11 v 12 c 0,0.5 0,0.75 0.125,0.875 C 0.25,24 0.5,24 1,24 h 29.2511 v 1 C 31,25 31.5632,24.5 31.5632,24 Z m 0.567,-11.7442 c 0.173,0.1018 0.3749,0.3779 0.5479,1.0611 C 32.8367,13.9419 32.9856,14.532 33,16 v 2 c -0.0288,1.468 -0.1777,2.3924 -0.3219,3.0029 -0.173,0.6831 -0.3749,0.9593 -0.5479,1.0611 -0.0907,0.0457 -0.1858,0.078 -0.2884,0.0436 l -1.5331,-1.221 c 0.709,-0.865 0.7329,-6.6126 0,-7.468 0,0 1.2914,-1.2209 1.5331,-1.2209 0.1505,0 0.1871,0 0.2171,0.014 0.0096,0.0045 0.0186,0.0105 0.0304,0.0183 0.0105,0.007 0.0233,0.0155 0.0409,0.0258 z m -2.4847,10.34 h -4.1383 v -1.0029 h 3.0713 c 0.5911,0 1.067,0.4506 1.067,1.0029 z m -3.749,-1.9127 h -0.3749 v -7.3808 h 0.3749 z m 2.682,-9.2267 c 0.5911,0 1.067,0.4506 1.067,1.0029 H 25.5072 V 11.4564 Z M 2,23 C 1.42324,23 1.22562,22.9651 1.22562,22.4273 V 11.907 C 1.22562,11.3692 1.42324,11 2,11 h 3.00022 v 0.0144 c 0,0.4612 0.37471,0.8359 0.83588,0.8359 h 2.1041 c 0.46117,0 0.85028,-0.3747 0.85028,-0.8359 V 11 H 16 c 0.0432,0.4323 0.4035,0.7782 0.8359,0.7782 H 18.94 c 0.4467,0 0.807,-0.3459 0.8358,-0.7782 H 22 c 1.0526,0 1.3876,0.3692 1.3876,0.907 V 22.1076 C 23.3876,22.6453 23.0526,23 22,23 h -2.2096 v -0.1007 c 0,-0.4611 -0.3747,-0.8503 -0.8503,-0.8503 H 16.836 c -0.4611,0 -0.8502,0.3747 -0.8502,0.8503 v 0 c 0,0.0288 0,0.0719 0.0143,0.1007 H 8.77878 c 0.02607,-9e-4 0.02607,-0.0144 0.02607,-0.0144 0,-0.4611 -0.3747,-0.8503 -0.85029,-0.8503 h -2.1041 c -0.46117,0 -0.85028,0.3747 -0.85028,0.8503 V 23 Z" style="filter:url(#stroke-filter)" />
   <defs>
-    <filter id="filter4" color-interpolation-filters="sRGB" x="0" y="0" width="1" height="1">
+    <filter
-      <feColorMatrix id="feColorMatrix2" values="0.60000000 0.0000000 0.0000000 0.0000000 0.0000000 0.0000000 0.60000000 0.0000000 0.0000000 0.0000000 0.0000000 0.0000000 0.60000000 0.0000000 0.0000000 0.0000000 0.0000000 0.0000000 1.0000000 0.0000000 " />
+      id="stroke-filter"
+      style="color-interpolation-filters:sRGB"
+      x="0" y="0" width="1" height="1">
+      <feColorMatrix values="0.6 0 0 0 0 0 0.6 0 0 0 0 0 0.6 0 0 0 0 0 1 0" />
     </filter>
   </defs>
 </svg>

ui-ngx/src/assets/markers/tripShape2.svg

@@ -1,15 +1,29 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" class="marker-color" fill="#307FE5">
-  <circle cx="17" cy="17" r="17"/>
+  <circle cx="17" cy="17" r="17" mask="url(#icon-mask)"/>
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M 17,33 C 25.8366,33 33,25.8366 33,17 33,8.16344 25.8366,1 17,1 8.16344,1 1,8.16344 1,17 1,25.8366 8.16344,33 17,33 Z m 0,1 C 26.3888,34 34,26.3888 34,17 34,7.61116 26.3888,0 17,0 7.61116,0 0,7.61116 0,17 0,26.3888 7.61116,34 17,34 Z"
+  <circle cx="17" cy="17" r="17" mask="url(#icon-mask-2)" fill="#fff"/>
-    style="filter:url(#filter2)" />
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M 17,33 C 25.8366,33 33,25.8366 33,17 33,8.16344 25.8366,1 17,1 8.16344,1 1,8.16344 1,17 1,25.8366 8.16344,33 17,33 Z m 0,1 C 26.3888,34 34,26.3888 34,17 34,7.61116 26.3888,0 17,0 7.61116,0 0,7.61116 0,17 0,26.3888 7.61116,34 17,34 Z" style="filter:url(#stroke-filter)" />
-  <g class="marker-icon-container" transform="translate(17,17)" fill="#ffffff">
+  <mask id="icon-mask" class="icon-mask-exclude">
-    <g transform="translate(-17,-17)">
+    <g class="marker-icon-container" transform="translate(17,17)">
-      <path d="M 7.63578,10.2032 C 7.4184,9.79185 7.83153,9.33261 8.26356,9.50542 L 25.8394,16.5358 c 0.4191,0.1676 0.4191,0.7608 0,0.9284 L 8.26356,24.4946 C 7.83154,24.6674 7.4184,24.2082 7.63578,23.7968 L 11.2271,17 Z"/>
+      <rect width="100%" height="100%" fill="#fff" transform="translate(-17,-17)"></rect>
+      <g transform="translate(-17,-17)">
+        <path fill="#000" d="M 7.63578,10.2032 C 7.4184,9.79185 7.83153,9.33261 8.26356,9.50542 L 25.8394,16.5358 c 0.4191,0.1676 0.4191,0.7608 0,0.9284 L 8.26356,24.4946 C 7.83154,24.6674 7.4184,24.2082 7.63578,23.7968 L 11.2271,17 Z"/>
+      </g>
     </g>
-  </g>
+  </mask>
+  <mask id="icon-mask-2" class="icon-mask-overlay">
+    <g class="marker-icon-container" transform="translate(17,17)">
+      <rect width="100%" height="100%" fill="#000" transform="translate(-17,-17)"></rect>
+      <g transform="translate(-17,-17)">
+        <path fill="#fff" d="M 7.63578,10.2032 C 7.4184,9.79185 7.83153,9.33261 8.26356,9.50542 L 25.8394,16.5358 c 0.4191,0.1676 0.4191,0.7608 0,0.9284 L 8.26356,24.4946 C 7.83154,24.6674 7.4184,24.2082 7.63578,23.7968 L 11.2271,17 Z"/>
+      </g>
+    </g>
+  </mask>
   <defs>
-    <filter id="filter2" color-interpolation-filters="sRGB" x="0" y="0" width="1" height="1">
+    <filter
-      <feColorMatrix id="feColorMatrix2" values="0.60000000 0.0000000 0.0000000 0.0000000 0.0000000 0.0000000 0.60000000 0.0000000 0.0000000 0.0000000 0.0000000 0.0000000 0.60000000 0.0000000 0.0000000 0.0000000 0.0000000 0.0000000 1.0000000 0.0000000 " />
+      id="stroke-filter"
+      style="color-interpolation-filters:sRGB"
+      x="0" y="0" width="1" height="1">
+      <feColorMatrix values="0.6 0 0 0 0 0 0.6 0 0 0 0 0 0.6 0 0 0 0 0 1 0" />
     </filter>
   </defs>
 </svg>

ui-ngx/src/assets/markers/tripShape3.svg

@@ -1,9 +1,12 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" class="marker-color" fill="#307FE5">
   <path d="M 17,0.0858536 C 16.0112,0.279907 15.4367,1.00295 15.2798,1.98651 15.2639,2.09816 15.2533,3.49641 15.2533,5.96593 v 3.8093 L 8.57642,9.78055 1.89691,9.78852 1.67098,9.86295 C 0.793849,10.1554 0.185171,10.8439 0.0363239,11.7078 0.00177019,11.9151 -0.00354577,12.577 0.00177019,17.112 l 0.00797394,5.1704 0.05847557,0.1993 c 0.2604823,0.8932 0.9356103,1.5285 1.8180603,1.7146 0.16214,0.0346 1.05256,0.0399 6.77785,0.0399 h 6.58917 v 3.8066 c 0,2.4722 0.0106,3.8705 0.0265,3.9821 0.1436,0.9065 0.7841,1.6269 1.6932,1.906 C 17.183,33.9947 17.2494,34 17.6056,34 17.6836,34 17.79,33.9947 18,33.9309 18.3641,33.8192 19.2342,33.2339 19.5,33 19.5664,32.9389 24.3845,27.7274 27,25 28.9555,22.9588 33.5,18 34,17.0057 33.5,16 29.7561,11.8752 27,9 25.5992,7.53795 19.1037,0.590381 19,0.5 18.7661,0.297972 18.2694,0.178893 17.9531,0.0858536 17.6581,-0.00186917 17.2897,0.03003 17,0.0858536 Z" />
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M 0.00974413,22.2588 0.00177019,17.102 c -0.00531596,-4.523 0,-5.1832 0.03455371,-5.39 C 0.210358,10.7045 1,10.0087 1.89691,9.79777 L 15.2533,9.78452 c 0,-2.5257 0,-5.26136 0.0265,-7.76824 C 15.2905,1.01395 16.0112,0.228478 17,0.0349352 17.6746,-0.0946972 18.6108,0.146463 19.1286,0.592552 22.3114,3.84368 34,15.9927 34,17.102 34,18.1435 23.8254,28.5757 20,32.5015 19.5,33.001 18.759,34 17.5,34 c -1.259,0 -2.2202,-1.2932 -2.2202,-2.0243 -0.0265,-2.5183 -0.0265,-5.2425 -0.0265,-7.7683 -4.2262,0 -9.07008,0 -13.36702,-0.0397 C 1,24.1677 0,22.9745 0.00974413,22.2588 Z M 16.2789,31.8814 c 0.0981,0.467 0.4594,0.8714 1.0131,1.0415 0.708,0.2175 1.3331,-0.4318 1.8148,-0.9262 1.7887,-1.8356 4.9957,-5.1269 7.9052,-8.2189 1.6588,-1.7629 3.212,-3.4516 4.3474,-4.7643 0.5694,-0.6583 1.0215,-1.208 1.3267,-1.6184 0.0857,-0.1153 0.1554,-0.2137 0.2106,-0.2959 -0.0556,-0.0842 -0.1259,-0.185 -0.2126,-0.3033 -0.3043,-0.4154 -0.755,-0.972 -1.3225,-1.6388 C 30.2299,13.8276 28.6807,12.1156 27.0235,10.3275 23.7364,6.78063 20.0561,2.96839 18.4493,1.32633 18.1247,1.072 17.5966,0.937045 17.191,1.01395 16.7497,1.101 16.4027,1.4472 16.279,2.10661 16.2533,4.58546 16.2533,7.28455 16.2533,9.78452 V 10.7809 L 2.02778,10.795 c -0.51455,0.1558 -0.91043,0.557 -1.00424,1.0765 -6.4e-4,0.0073 -0.00469,0.0504 -0.00847,0.1663 -0.00482,0.1479 -0.00851,0.3802 -0.011,0.7572 -0.004948,0.7515 -0.00496,2.0428 -0.0023,4.3055 l 0.00797,5.1567 v 0.0027 c 0,0 0.0079,0.051 0.05941,0.1541 0.05987,0.1197 0.15509,0.2589 0.27701,0.3904 0.12224,0.1318 0.25063,0.2336 0.36376,0.2974 0.05521,0.0312 0.09971,0.0492 0.13189,0.059 0.02872,0.0087 0.04447,0.0095 0.04447,0.0095 H 1.89556 C 6.187,23.2101 11.026,23.2101 15.2533,23.2101 h 1 v 0.9973 c 0,2.4988 0,5.1853 0.0256,7.674 z" style="filter:url(#filter2)" />
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M 0.00974413,22.2588 0.00177019,17.102 c -0.00531596,-4.523 0,-5.1832 0.03455371,-5.39 C 0.210358,10.7045 1,10.0087 1.89691,9.79777 L 15.2533,9.78452 c 0,-2.5257 0,-5.26136 0.0265,-7.76824 C 15.2905,1.01395 16.0112,0.228478 17,0.0349352 17.6746,-0.0946972 18.6108,0.146463 19.1286,0.592552 22.3114,3.84368 34,15.9927 34,17.102 34,18.1435 23.8254,28.5757 20,32.5015 19.5,33.001 18.759,34 17.5,34 c -1.259,0 -2.2202,-1.2932 -2.2202,-2.0243 -0.0265,-2.5183 -0.0265,-5.2425 -0.0265,-7.7683 -4.2262,0 -9.07008,0 -13.36702,-0.0397 C 1,24.1677 0,22.9745 0.00974413,22.2588 Z M 16.2789,31.8814 c 0.0981,0.467 0.4594,0.8714 1.0131,1.0415 0.708,0.2175 1.3331,-0.4318 1.8148,-0.9262 1.7887,-1.8356 4.9957,-5.1269 7.9052,-8.2189 1.6588,-1.7629 3.212,-3.4516 4.3474,-4.7643 0.5694,-0.6583 1.0215,-1.208 1.3267,-1.6184 0.0857,-0.1153 0.1554,-0.2137 0.2106,-0.2959 -0.0556,-0.0842 -0.1259,-0.185 -0.2126,-0.3033 -0.3043,-0.4154 -0.755,-0.972 -1.3225,-1.6388 C 30.2299,13.8276 28.6807,12.1156 27.0235,10.3275 23.7364,6.78063 20.0561,2.96839 18.4493,1.32633 18.1247,1.072 17.5966,0.937045 17.191,1.01395 16.7497,1.101 16.4027,1.4472 16.279,2.10661 16.2533,4.58546 16.2533,7.28455 16.2533,9.78452 V 10.7809 L 2.02778,10.795 c -0.51455,0.1558 -0.91043,0.557 -1.00424,1.0765 -6.4e-4,0.0073 -0.00469,0.0504 -0.00847,0.1663 -0.00482,0.1479 -0.00851,0.3802 -0.011,0.7572 -0.004948,0.7515 -0.00496,2.0428 -0.0023,4.3055 l 0.00797,5.1567 v 0.0027 c 0,0 0.0079,0.051 0.05941,0.1541 0.05987,0.1197 0.15509,0.2589 0.27701,0.3904 0.12224,0.1318 0.25063,0.2336 0.36376,0.2974 0.05521,0.0312 0.09971,0.0492 0.13189,0.059 0.02872,0.0087 0.04447,0.0095 0.04447,0.0095 H 1.89556 C 6.187,23.2101 11.026,23.2101 15.2533,23.2101 h 1 v 0.9973 c 0,2.4988 0,5.1853 0.0256,7.674 z" style="filter:url(#stroke-filter)" />
   <defs>
-    <filter id="filter2" color-interpolation-filters="sRGB" x="0" y="0" width="1" height="1">
+    <filter
-      <feColorMatrix id="feColorMatrix2" values="0.60000000 0.0000000 0.0000000 0.0000000 0.0000000 0.0000000 0.60000000 0.0000000 0.0000000 0.0000000 0.0000000 0.0000000 0.60000000 0.0000000 0.0000000 0.0000000 0.0000000 0.0000000 1.0000000 0.0000000 " />
+      id="stroke-filter"
+      style="color-interpolation-filters:sRGB"
+      x="0" y="0" width="1" height="1">
+      <feColorMatrix values="0.6 0 0 0 0 0 0.6 0 0 0 0 0 0.6 0 0 0 0 0 1 0" />
     </filter>
   </defs>
 </svg>

ui-ngx/src/assets/markers/tripShape4.svg

@@ -1,9 +1,12 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" class="marker-color" fill="#307FE5">
   <path d="M 4.47621,17.6524 4.52498,17.5 4.47621,17.3476 0.788173,5.82249 32.551,17.5 0.788173,29.1775 Z" />
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M 5.04976,17.4998 1.57615,28.3548 31.1018,17.4998 1.57615,6.64476 Z m -1.04996,0 -3.688034,11.5251 c -0.126878,0.3965 0.258016,0.7653 0.648745,0.6217 L 32.7233,17.9691 c 0.4367,-0.1606 0.4367,-0.7781 0,-0.9386 L 0.960511,5.35298 C 0.569782,5.20933 0.184888,5.57816 0.311766,5.97465 Z" style="filter:url(#filter2)" />
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M 5.04976,17.4998 1.57615,28.3548 31.1018,17.4998 1.57615,6.64476 Z m -1.04996,0 -3.688034,11.5251 c -0.126878,0.3965 0.258016,0.7653 0.648745,0.6217 L 32.7233,17.9691 c 0.4367,-0.1606 0.4367,-0.7781 0,-0.9386 L 0.960511,5.35298 C 0.569782,5.20933 0.184888,5.57816 0.311766,5.97465 Z" style="filter:url(#stroke-filter)" />
   <defs>
-    <filter id="filter2" color-interpolation-filters="sRGB" x="0" y="0" width="1" height="1">
+    <filter
-      <feColorMatrix id="feColorMatrix2" values="0.60000000 0.0000000 0.0000000 0.0000000 0.0000000 0.0000000 0.60000000 0.0000000 0.0000000 0.0000000 0.0000000 0.0000000 0.60000000 0.0000000 0.0000000 0.0000000 0.0000000 0.0000000 1.0000000 0.0000000 " />
+      id="stroke-filter"
+      style="color-interpolation-filters:sRGB"
+      x="0" y="0" width="1" height="1">
+      <feColorMatrix values="0.6 0 0 0 0 0 0.6 0 0 0 0 0 0.6 0 0 0 0 0 1 0" />
     </filter>
   </defs>
 </svg>

ui-ngx/src/assets/markers/tripShape5.svg

@@ -1,10 +1,29 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" class="marker-color" fill="#307FE5">
-  <circle cx="17" cy="17" r="17" />
+  <circle cx="17" cy="17" r="17" mask="url(#icon-mask)"/>
-  <path d="m 16.5942,12.0051 c -0.4157,-0.4527 -0.6417,-1.054 -0.6296,-1.6751 0.0121,-0.62116 0.2613,-1.21277 0.6942,-1.64824 0.433,-0.43547 1.0153,-0.68018 1.6223,-0.68175 0.6071,-0.00158 1.1906,0.24011 1.6257,0.67333 l 6.4281,6.69026 C 26.7612,15.8083 27,16.4065 27,17.0295 c 0,0.623 -0.2388,1.2211 -0.6651,1.6659 l -6.2979,6.5553 c -0.2119,0.2307 -0.4667,0.4159 -0.7495,0.5444 -0.2827,0.1286 -0.5877,0.1981 -0.8971,0.2044 -0.3093,0.0063 -0.6168,-0.0507 -0.9043,-0.1677 -0.2876,-0.117 -0.5494,-0.2916 -0.7701,-0.5136 -0.2206,-0.2219 -0.3958,-0.4868 -0.5151,-0.779 -0.1192,-0.2922 -0.1803,-0.6058 -0.1795,-0.9225 8e-4,-0.3166 0.0634,-0.6299 0.1841,-0.9215 0.1207,-0.2916 0.2972,-0.5555 0.519,-0.7763 L 19.1792,19.3567 9.3034,19.3084 C 8.68734,19.3031 8.09857,19.0476 7.66662,18.598 7.23466,18.1484 6.9949,17.5417 7.00008,16.9112 7.00526,16.2807 7.25496,15.6782 7.69424,15.2361 8.13352,14.794 8.72641,14.5486 9.34246,14.554 l 9.74224,0.0466 z" fill="#ffffff" />
+  <circle cx="17" cy="17" r="17" mask="url(#icon-mask-2)" fill="#fff"/>
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M 17,33 C 25.8366,33 33,25.8366 33,17 33,8.16344 25.8366,1 17,1 8.16344,1 1,8.16344 1,17 1,25.8366 8.16344,33 17,33 Z m 0,1 C 26.3888,34 34,26.3888 34,17 34,7.61116 26.3888,0 17,0 7.61116,0 0,7.61116 0,17 0,26.3888 7.61116,34 17,34 Z" style="filter:url(#filter2)" />
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M 17,33 C 25.8366,33 33,25.8366 33,17 33,8.16344 25.8366,1 17,1 8.16344,1 1,8.16344 1,17 1,25.8366 8.16344,33 17,33 Z m 0,1 C 26.3888,34 34,26.3888 34,17 34,7.61116 26.3888,0 17,0 7.61116,0 0,7.61116 0,17 0,26.3888 7.61116,34 17,34 Z" style="filter:url(#stroke-filter)" />
+  <mask id="icon-mask" class="icon-mask-exclude">
+    <g class="marker-icon-container" transform="translate(17,17)">
+      <rect width="100%" height="100%" fill="#fff" transform="translate(-17,-17)"></rect>
+      <g transform="translate(-17,-17)">
+        <path fill="#000" d="m 16.5942,12.0051 c -0.4157,-0.4527 -0.6417,-1.054 -0.6296,-1.6751 0.0121,-0.62116 0.2613,-1.21277 0.6942,-1.64824 0.433,-0.43547 1.0153,-0.68018 1.6223,-0.68175 0.6071,-0.00158 1.1906,0.24011 1.6257,0.67333 l 6.4281,6.69026 C 26.7612,15.8083 27,16.4065 27,17.0295 c 0,0.623 -0.2388,1.2211 -0.6651,1.6659 l -6.2979,6.5553 c -0.2119,0.2307 -0.4667,0.4159 -0.7495,0.5444 -0.2827,0.1286 -0.5877,0.1981 -0.8971,0.2044 -0.3093,0.0063 -0.6168,-0.0507 -0.9043,-0.1677 -0.2876,-0.117 -0.5494,-0.2916 -0.7701,-0.5136 -0.2206,-0.2219 -0.3958,-0.4868 -0.5151,-0.779 -0.1192,-0.2922 -0.1803,-0.6058 -0.1795,-0.9225 8e-4,-0.3166 0.0634,-0.6299 0.1841,-0.9215 0.1207,-0.2916 0.2972,-0.5555 0.519,-0.7763 L 19.1792,19.3567 9.3034,19.3084 C 8.68734,19.3031 8.09857,19.0476 7.66662,18.598 7.23466,18.1484 6.9949,17.5417 7.00008,16.9112 7.00526,16.2807 7.25496,15.6782 7.69424,15.2361 8.13352,14.794 8.72641,14.5486 9.34246,14.554 l 9.74224,0.0466 z" />
+      </g>
+    </g>
+  </mask>
+  <mask id="icon-mask-2" class="icon-mask-overlay">
+    <g class="marker-icon-container" transform="translate(17,17)">
+      <rect width="100%" height="100%" fill="#000" transform="translate(-17,-17)"></rect>
+      <g transform="translate(-17,-17)">
+        <path fill="#fff" d="m 16.5942,12.0051 c -0.4157,-0.4527 -0.6417,-1.054 -0.6296,-1.6751 0.0121,-0.62116 0.2613,-1.21277 0.6942,-1.64824 0.433,-0.43547 1.0153,-0.68018 1.6223,-0.68175 0.6071,-0.00158 1.1906,0.24011 1.6257,0.67333 l 6.4281,6.69026 C 26.7612,15.8083 27,16.4065 27,17.0295 c 0,0.623 -0.2388,1.2211 -0.6651,1.6659 l -6.2979,6.5553 c -0.2119,0.2307 -0.4667,0.4159 -0.7495,0.5444 -0.2827,0.1286 -0.5877,0.1981 -0.8971,0.2044 -0.3093,0.0063 -0.6168,-0.0507 -0.9043,-0.1677 -0.2876,-0.117 -0.5494,-0.2916 -0.7701,-0.5136 -0.2206,-0.2219 -0.3958,-0.4868 -0.5151,-0.779 -0.1192,-0.2922 -0.1803,-0.6058 -0.1795,-0.9225 8e-4,-0.3166 0.0634,-0.6299 0.1841,-0.9215 0.1207,-0.2916 0.2972,-0.5555 0.519,-0.7763 L 19.1792,19.3567 9.3034,19.3084 C 8.68734,19.3031 8.09857,19.0476 7.66662,18.598 7.23466,18.1484 6.9949,17.5417 7.00008,16.9112 7.00526,16.2807 7.25496,15.6782 7.69424,15.2361 8.13352,14.794 8.72641,14.5486 9.34246,14.554 l 9.74224,0.0466 z" />
+      </g>
+    </g>
+  </mask>
   <defs>
-    <filter id="filter2" color-interpolation-filters="sRGB" x="0" y="0" width="1" height="1">
+    <filter
-      <feColorMatrix id="feColorMatrix2" values="0.60000000 0.0000000 0.0000000 0.0000000 0.0000000 0.0000000 0.60000000 0.0000000 0.0000000 0.0000000 0.0000000 0.0000000 0.60000000 0.0000000 0.0000000 0.0000000 0.0000000 0.0000000 1.0000000 0.0000000 " />
+      id="stroke-filter"
+      style="color-interpolation-filters:sRGB"
+      x="0" y="0" width="1" height="1">
+      <feColorMatrix values="0.6 0 0 0 0 0 0.6 0 0 0 0 0 0.6 0 0 0 0 0 1 0" />
     </filter>
   </defs>
 </svg>

ui-ngx/src/assets/markers/tripShape6.svg

@@ -1,10 +1,29 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" class="marker-color" fill="#307FE5">
-  <circle cx="17" cy="17" r="17" />
+  <circle cx="17" cy="17" r="17" mask="url(#icon-mask)"/>
-  <path fill-rule="evenodd" clip-rule="evenodd" d="M 17,33 C 25.8366,33 33,25.8366 33,17 33,8.16344 25.8366,1 17,1 8.16344,1 1,8.16344 1,17 1,25.8366 8.16344,33 17,33 Z m 0,1 C 26.3888,34 34,26.3888 34,17 34,7.61116 26.3888,0 17,0 7.61116,0 0,7.61116 0,17 0,26.3888 7.61116,34 17,34 Z" style="filter:url(#filter2)" />
+  <circle cx="17" cy="17" r="17" mask="url(#icon-mask-2)" fill="#fff"/>
-  <path d="m 12.6301,12.0051 c -0.4157,-0.4527 -0.6417,-1.054 -0.6296,-1.6751 0.012,-0.62116 0.2612,-1.21277 0.6942,-1.64824 0.4329,-0.43547 1.0152,-0.68018 1.6223,-0.68175 0.607,-0.00158 1.1905,0.24011 1.6256,0.67333 l 6.4281,6.69026 c 0.4263,0.4447 0.6651,1.0429 0.6651,1.6659 0,0.623 -0.2388,1.2211 -0.6651,1.6659 l -6.2979,6.5553 c -0.2118,0.2307 -0.4666,0.4158 -0.7494,0.5444 -0.2828,0.1286 -0.5878,0.1981 -0.8971,0.2044 -0.3094,0.0063 -0.6169,-0.0507 -0.9044,-0.1677 -0.2875,-0.117 -0.5493,-0.2916 -0.77,-0.5136 -0.2207,-0.2219 -0.3958,-0.4868 -0.5151,-0.779 -0.1193,-0.2922 -0.1803,-0.6058 -0.1795,-0.9225 7e-4,-0.3166 0.0633,-0.6299 0.1841,-0.9215 0.1207,-0.2916 0.2971,-0.5555 0.5189,-0.7763 l 2.4547,-2.5622 c 2.3206,-2.3272 2.3206,-2.3272 2.3206,-2.3272 l -2.415,-2.4289 z" fill="#ffffff" />
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M 17,33 C 25.8366,33 33,25.8366 33,17 33,8.16344 25.8366,1 17,1 8.16344,1 1,8.16344 1,17 1,25.8366 8.16344,33 17,33 Z m 0,1 C 26.3888,34 34,26.3888 34,17 34,7.61116 26.3888,0 17,0 7.61116,0 0,7.61116 0,17 0,26.3888 7.61116,34 17,34 Z" style="filter:url(#stroke-filter)" />
+  <mask id="icon-mask" class="icon-mask-exclude">
+    <g class="marker-icon-container" transform="translate(17,17)">
+      <rect width="100%" height="100%" fill="#fff" transform="translate(-17,-17)"></rect>
+      <g transform="translate(-17,-17)">
+        <path fill="#000" d="m 12.6301,12.0051 c -0.4157,-0.4527 -0.6417,-1.054 -0.6296,-1.6751 0.012,-0.62116 0.2612,-1.21277 0.6942,-1.64824 0.4329,-0.43547 1.0152,-0.68018 1.6223,-0.68175 0.607,-0.00158 1.1905,0.24011 1.6256,0.67333 l 6.4281,6.69026 c 0.4263,0.4447 0.6651,1.0429 0.6651,1.6659 0,0.623 -0.2388,1.2211 -0.6651,1.6659 l -6.2979,6.5553 c -0.2118,0.2307 -0.4666,0.4158 -0.7494,0.5444 -0.2828,0.1286 -0.5878,0.1981 -0.8971,0.2044 -0.3094,0.0063 -0.6169,-0.0507 -0.9044,-0.1677 -0.2875,-0.117 -0.5493,-0.2916 -0.77,-0.5136 -0.2207,-0.2219 -0.3958,-0.4868 -0.5151,-0.779 -0.1193,-0.2922 -0.1803,-0.6058 -0.1795,-0.9225 7e-4,-0.3166 0.0633,-0.6299 0.1841,-0.9215 0.1207,-0.2916 0.2971,-0.5555 0.5189,-0.7763 l 2.4547,-2.5622 c 2.3206,-2.3272 2.3206,-2.3272 2.3206,-2.3272 l -2.415,-2.4289 z"/>
+      </g>
+    </g>
+  </mask>
+  <mask id="icon-mask-2" class="icon-mask-overlay">
+    <g class="marker-icon-container" transform="translate(17,17)">
+      <rect width="100%" height="100%" fill="#000" transform="translate(-17,-17)"></rect>
+      <g transform="translate(-17,-17)">
+        <path fill="#fff" d="m 12.6301,12.0051 c -0.4157,-0.4527 -0.6417,-1.054 -0.6296,-1.6751 0.012,-0.62116 0.2612,-1.21277 0.6942,-1.64824 0.4329,-0.43547 1.0152,-0.68018 1.6223,-0.68175 0.607,-0.00158 1.1905,0.24011 1.6256,0.67333 l 6.4281,6.69026 c 0.4263,0.4447 0.6651,1.0429 0.6651,1.6659 0,0.623 -0.2388,1.2211 -0.6651,1.6659 l -6.2979,6.5553 c -0.2118,0.2307 -0.4666,0.4158 -0.7494,0.5444 -0.2828,0.1286 -0.5878,0.1981 -0.8971,0.2044 -0.3094,0.0063 -0.6169,-0.0507 -0.9044,-0.1677 -0.2875,-0.117 -0.5493,-0.2916 -0.77,-0.5136 -0.2207,-0.2219 -0.3958,-0.4868 -0.5151,-0.779 -0.1193,-0.2922 -0.1803,-0.6058 -0.1795,-0.9225 7e-4,-0.3166 0.0633,-0.6299 0.1841,-0.9215 0.1207,-0.2916 0.2971,-0.5555 0.5189,-0.7763 l 2.4547,-2.5622 c 2.3206,-2.3272 2.3206,-2.3272 2.3206,-2.3272 l -2.415,-2.4289 z"/>
+      </g>
+    </g>
+  </mask>
   <defs>
-    <filter id="filter2" color-interpolation-filters="sRGB" x="0" y="0" width="1" height="1">
+    <filter
-      <feColorMatrix id="feColorMatrix2" values="0.60000000 0.0000000 0.0000000 0.0000000 0.0000000 0.0000000 0.60000000 0.0000000 0.0000000 0.0000000 0.0000000 0.0000000 0.60000000 0.0000000 0.0000000 0.0000000 0.0000000 0.0000000 1.0000000 0.0000000 " />
+      id="stroke-filter"
+      style="color-interpolation-filters:sRGB"
+      x="0" y="0" width="1" height="1">
+      <feColorMatrix values="0.6 0 0 0 0 0 0.6 0 0 0 0 0 0.6 0 0 0 0 0 1 0" />
     </filter>
   </defs>
 </svg>

ui-ngx/src/assets/markers/tripShape7.svg

@@ -1,11 +1,14 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" viewBox="0 0 34 34" class="marker-color" fill="#307FE5">
   <path fill-rule="evenodd" clip-rule="evenodd" d="M 3.03511,11.1037 0.975008,11.3 c -0.565732,0.0362 -0.8856091,0.3379 -0.8993192,1.0023 -0.06708141,3.163 -0.06704708,6.3758 0,9.5389 0.0137101,0.6644 0.3335872,0.9661 0.8993192,1.0022 H 3.03511 c 0.68089,0.0434 1.18081,0.0837 1.5144,0.1416 8.32419,1.4476 22.42079,2.4591 29.26439,-5.6302 0.2148,-0.2541 0.2148,-0.5062 0,-0.7604 C 26.9694,8.5051 12.8737,9.51665 4.54951,10.9642 4.21684,11.0221 3.716,11.0624 3.03511,11.1058 Z" fill="#ffffff" />
   <path fill-rule="evenodd" clip-rule="evenodd" d="m 3.03511,11.1042 -2.060102,0.1963 c -0.565732,0.0362 -0.8856091,0.3379 -0.8993192,1.0023 -0.06708141,3.163 -0.06704708,6.3758 0,9.5389 0.0137101,0.6644 0.3335872,0.9661 0.8993192,1.0022 H 3.03511 c 0.68089,0.0434 1.18081,0.0837 1.5144,0.1416 8.32419,1.4476 22.42079,2.4591 29.26439,-5.6302 0.2148,-0.2541 0.2148,-0.5063 0,-0.7604 C 26.9694,8.50559 12.8737,9.51714 4.54951,10.9647 4.21684,11.0226 3.716,11.0629 3.03511,11.1063 Z m 9.89889,0.8709 h 3.6631 c 3.1074,0.0909 4.5615,0.5849 4.5615,4.999 0,4.414 -1.4541,4.9101 -4.5615,5.001 H 12.934 c 0.0073,0.2407 0.4113,0.3007 0.6032,0.3234 0.6407,0.0744 2.6925,0.3316 4.6684,0.1766 3.8834,-0.3048 5.279,-1.3877 5.279,-5.501 0,-4.1134 -1.3956,-5.1942 -5.279,-5.499 -1.9759,-0.155 -4.0286,0.1022 -4.6684,0.1766 -0.1928,0.0227 -0.5959,0.0827 -0.6032,0.3234 z" />
-  <path fill-rule="evenodd" clip-rule="evenodd" d="m 9.55575,16.0347 1.99985,-0.0279 c 0.2761,-0.0039 0.4968,-0.2308 0.4929,-0.5069 l -0.0349,-2.4998 c -0.0039,-0.2761 -0.2308,-0.4968 -0.507,-0.493 L 9.61037,12.5336 C 9.54408,12.5346 9.48013,12.5091 9.43259,12.4629 9.27291,12.3076 9.00521,12.4229 9.00833,12.6456 l 0.04048,2.8962 c 0.00386,0.2761 0.23082,0.4968 0.50694,0.4929 z m 0.02784,1.9999 1.99981,-0.028 c 0.2761,-0.0039 0.5031,0.2168 0.5069,0.493 l 0.035,2.4997 c 0.0038,0.2761 -0.2169,0.5031 -0.493,0.507 l -1.89625,0.0265 c -0.0663,9e-4 -0.12951,0.0281 -0.17574,0.0757 -0.15527,0.1596 -0.42609,0.0519 -0.4292,-0.1708 L 9.09062,18.5415 C 9.08676,18.2654 9.30747,18.0384 9.58359,18.0346 Z m 8.76411,-2.1225 -2.2927,0.0321 c -0.2761,0.0038 -0.5031,-0.2169 -0.5069,-0.493 l -0.028,-1.9998 c -0.0038,-0.2761 0.2169,-0.5031 0.493,-0.5069 l 2.2926,-0.0321 c 0.261,-0.0036 0.396,0.31 0.2141,0.4971 0,0 0.5078,0.5563 0.5139,0.9929 0.0062,0.4366 -0.4859,1.0069 -0.4859,1.0069 0.187,0.1819 0.0608,0.4992 -0.2001,0.5028 z m -2.2224,5.0316 2.2927,-0.0321 c 0.2609,-0.0036 0.3872,-0.3209 0.2001,-0.5028 0,0 0.4921,-0.5703 0.486,-1.0069 -0.0061,-0.4366 -0.514,-0.9929 -0.514,-0.9929 0.1819,-0.1871 0.0469,-0.5007 -0.214,-0.4971 l -2.2927,0.0321 c -0.2761,0.0038 -0.4968,0.2308 -0.493,0.5069 l 0.028,1.9998 c 0.0038,0.2761 0.2308,0.4968 0.5069,0.493 z" style="filter:url(#filter4)" />
+  <path fill-rule="evenodd" clip-rule="evenodd" d="m 9.55575,16.0347 1.99985,-0.0279 c 0.2761,-0.0039 0.4968,-0.2308 0.4929,-0.5069 l -0.0349,-2.4998 c -0.0039,-0.2761 -0.2308,-0.4968 -0.507,-0.493 L 9.61037,12.5336 C 9.54408,12.5346 9.48013,12.5091 9.43259,12.4629 9.27291,12.3076 9.00521,12.4229 9.00833,12.6456 l 0.04048,2.8962 c 0.00386,0.2761 0.23082,0.4968 0.50694,0.4929 z m 0.02784,1.9999 1.99981,-0.028 c 0.2761,-0.0039 0.5031,0.2168 0.5069,0.493 l 0.035,2.4997 c 0.0038,0.2761 -0.2169,0.5031 -0.493,0.507 l -1.89625,0.0265 c -0.0663,9e-4 -0.12951,0.0281 -0.17574,0.0757 -0.15527,0.1596 -0.42609,0.0519 -0.4292,-0.1708 L 9.09062,18.5415 C 9.08676,18.2654 9.30747,18.0384 9.58359,18.0346 Z m 8.76411,-2.1225 -2.2927,0.0321 c -0.2761,0.0038 -0.5031,-0.2169 -0.5069,-0.493 l -0.028,-1.9998 c -0.0038,-0.2761 0.2169,-0.5031 0.493,-0.5069 l 2.2926,-0.0321 c 0.261,-0.0036 0.396,0.31 0.2141,0.4971 0,0 0.5078,0.5563 0.5139,0.9929 0.0062,0.4366 -0.4859,1.0069 -0.4859,1.0069 0.187,0.1819 0.0608,0.4992 -0.2001,0.5028 z m -2.2224,5.0316 2.2927,-0.0321 c 0.2609,-0.0036 0.3872,-0.3209 0.2001,-0.5028 0,0 0.4921,-0.5703 0.486,-1.0069 -0.0061,-0.4366 -0.514,-0.9929 -0.514,-0.9929 0.1819,-0.1871 0.0469,-0.5007 -0.214,-0.4971 l -2.2927,0.0321 c -0.2761,0.0038 -0.4968,0.2308 -0.493,0.5069 l 0.028,1.9998 c 0.0038,0.2761 0.2308,0.4968 0.5069,0.493 z" style="filter:url(#stroke-filter)" />
-  <path fill-rule="evenodd" clip-rule="evenodd" d="m 3.04579,23.005 c 0.69564,0 1.63358,0.1207 2.85604,0.2781 C 8.18884,23.5774 11.4716,24 16.0266,24 c 6.6603,0 13.6073,-1.6373 17.8126,-6.6195 0.2144,-0.2543 0.2144,-0.5067 0,-0.7611 C 29.6334,11.6373 22.6858,10.1045 16.0266,10 11.4716,10 8.18884,10.4225 5.90183,10.7169 4.67937,10.8742 3.74143,10.995 3.04579,10.995 H 1.04875 c -0.564898,0.0362 -0.9848352,0.3359 -0.9985262,1.0008 -0.0669822,3.1657 -0.0669479,6.8426 0,10.0084 0.013691,0.6649 0.4336282,0.975 0.9985262,1.0112 z M 1.08578,22.0144 3.04579,22.0041 c 0.76299,0 1.80277,0.1338 3.06781,0.2967 0.51876,0.0667 1.0754,0.1383 1.66636,0.2076 2.09575,0.2457 4.80134,0.4908 8.24664,0.4908 6.4258,0 12.8746,-1.557 16.82,-5.9991 -3.9405,-4.4322 -10.3798,-5.897 -16.8278,-5.9993 -3.4416,4e-4 -6.14468,0.2452 -8.23884,0.4907 -0.59097,0.0693 -1.1476,0.141 -1.66636,0.2077 -1.26504,0.1628 -2.30482,0.2966 -3.06781,0.2966 H 1.08737 c -0.01454,0.0015 -0.02728,0.0032 -0.0383,0.0051 -2.4e-4,0.0048 -4.2e-4,0.01 -5.4e-4,0.0156 -0.066677,3.1515 -0.066658,6.8148 -1e-5,9.9665 2e-4,0.0095 6.2e-4,0.0186 0.00115,0.0263 0.0103,0.0018 0.0223,0.0036 0.03611,0.0051 z" style="filter:url(#filter4)" />
+  <path fill-rule="evenodd" clip-rule="evenodd" d="m 3.04579,23.005 c 0.69564,0 1.63358,0.1207 2.85604,0.2781 C 8.18884,23.5774 11.4716,24 16.0266,24 c 6.6603,0 13.6073,-1.6373 17.8126,-6.6195 0.2144,-0.2543 0.2144,-0.5067 0,-0.7611 C 29.6334,11.6373 22.6858,10.1045 16.0266,10 11.4716,10 8.18884,10.4225 5.90183,10.7169 4.67937,10.8742 3.74143,10.995 3.04579,10.995 H 1.04875 c -0.564898,0.0362 -0.9848352,0.3359 -0.9985262,1.0008 -0.0669822,3.1657 -0.0669479,6.8426 0,10.0084 0.013691,0.6649 0.4336282,0.975 0.9985262,1.0112 z M 1.08578,22.0144 3.04579,22.0041 c 0.76299,0 1.80277,0.1338 3.06781,0.2967 0.51876,0.0667 1.0754,0.1383 1.66636,0.2076 2.09575,0.2457 4.80134,0.4908 8.24664,0.4908 6.4258,0 12.8746,-1.557 16.82,-5.9991 -3.9405,-4.4322 -10.3798,-5.897 -16.8278,-5.9993 -3.4416,4e-4 -6.14468,0.2452 -8.23884,0.4907 -0.59097,0.0693 -1.1476,0.141 -1.66636,0.2077 -1.26504,0.1628 -2.30482,0.2966 -3.06781,0.2966 H 1.08737 c -0.01454,0.0015 -0.02728,0.0032 -0.0383,0.0051 -2.4e-4,0.0048 -4.2e-4,0.01 -5.4e-4,0.0156 -0.066677,3.1515 -0.066658,6.8148 -1e-5,9.9665 2e-4,0.0095 6.2e-4,0.0186 0.00115,0.0263 0.0103,0.0018 0.0223,0.0036 0.03611,0.0051 z" style="filter:url(#stroke-filter)" />
   <defs>
-    <filter id="filter4" color-interpolation-filters="sRGB" x="0" y="0" width="1" height="1">
+    <filter
-      <feColorMatrix id="feColorMatrix4" values="0.59999999999999998 0 0 0 0 0 0.59999999999999998 0 0 0 0 0 0.59999999999999998 0 0 0 0 0 1 0" />
+      id="stroke-filter"
+      style="color-interpolation-filters:sRGB"
+      x="0" y="0" width="1" height="1">
+      <feColorMatrix values="0.6 0 0 0 0 0 0.6 0 0 0 0 0 0.6 0 0 0 0 0 1 0" />
     </filter>
   </defs>
 </svg>