diff --git a/src/iotMapManager/css/markers.css b/src/iotMapManager/css/markers.css
index 5d0dccc2..4a412ad2 100644
--- a/src/iotMapManager/css/markers.css
+++ b/src/iotMapManager/css/markers.css
@@ -86,24 +86,6 @@
line-height:50px;
}
-.iotmap-markericon .iotmap-shadowSelected{
- position: absolute;
- top:0px;
- left:-10px;
- width:70px;
- height: 70px;
- z-index: 5;
-}
-
-.iotmap-markericon .iotmap-shadowUnselected{
- position: absolute;
- top:-20px;
- left:-20px;
- width:70px;
- height: 70px;
- z-index: 5;
-}
-
/********************
CLUSTERS
********************/
diff --git a/src/iotMapManager/css/shadows.css b/src/iotMapManager/css/shadows.css
new file mode 100644
index 00000000..0658bac8
--- /dev/null
+++ b/src/iotMapManager/css/shadows.css
@@ -0,0 +1,69 @@
+/*
+* Software Name : IotMapManager
+* Version: 2.5.1
+* SPDX-FileCopyrightText: Copyright (c) 2020 Orange
+* SPDX-License-Identifier: MIT
+*
+* This software is distributed under the MIT License,
+* the text of which is available at https://github.com/Orange-OpenSource/IOT-Map-Component/blob/master/LICENSE
+* or see the "license.txt" file for more details.
+*
+* Author: S. Gateau
+* Software description: provide markers, tabs, clusters and paths dedicated to iot projects using mapping
+*/
+
+/* shadows.css */
+
+.iotmap-markericon .iotmap-selected-circle-shadow {
+ position: absolute;
+ top: 42px;
+ left:-10px;
+ width:70px;
+ height: 26px;
+ z-index: 5;
+}
+
+.iotmap-markericon .iotmap-selected-square-shadow {
+ position: absolute;
+ top: 42px;
+ left:-10px;
+ width:70px;
+ height: 24px;
+ z-index: 5;
+}
+
+.iotmap-markericon .iotmap-circle-shadow {
+ position: absolute;
+ top:-18px;
+ left:-18px;
+ width: 66px;
+ height: 66px;
+ z-index: 5;
+}
+
+.iotmap-markericon .iotmap-circle-pin-shadow {
+ position: absolute;
+ top:24px;
+ left:-20px;
+ width:70px;
+ height: 24px;
+ z-index: 5;
+}
+
+.iotmap-markericon .iotmap-square-shadow {
+ position: absolute;
+ top:-20px;
+ left:-20px;
+ width:70px;
+ height: 70px;
+ z-index: 5;
+}
+
+.iotmap-markericon .iotmap-square-pin-shadow {
+ position: absolute;
+ top:24px;
+ left:-20px;
+ width:70px;
+ height: 26px;
+ z-index: 5;
+}
diff --git a/src/iotMapManager/img/MOB_CIR_PIN_Shadow.png b/src/iotMapManager/img/MOB_CIR_PIN_Shadow.png
index 7a6480b5..5e68f5e9 100644
Binary files a/src/iotMapManager/img/MOB_CIR_PIN_Shadow.png and b/src/iotMapManager/img/MOB_CIR_PIN_Shadow.png differ
diff --git a/src/iotMapManager/img/MOB_CIR_SEL_Shadow.png b/src/iotMapManager/img/MOB_CIR_SEL_Shadow.png
index c2a434fc..bd99b375 100644
Binary files a/src/iotMapManager/img/MOB_CIR_SEL_Shadow.png and b/src/iotMapManager/img/MOB_CIR_SEL_Shadow.png differ
diff --git a/src/iotMapManager/img/MOB_CIR_Shadow.png b/src/iotMapManager/img/MOB_CIR_Shadow.png
index 96849a93..d93c01b0 100644
Binary files a/src/iotMapManager/img/MOB_CIR_Shadow.png and b/src/iotMapManager/img/MOB_CIR_Shadow.png differ
diff --git a/src/iotMapManager/img/POI_SQR_PIN_Shadow.png b/src/iotMapManager/img/POI_SQR_PIN_Shadow.png
index 700702f6..35748617 100644
Binary files a/src/iotMapManager/img/POI_SQR_PIN_Shadow.png and b/src/iotMapManager/img/POI_SQR_PIN_Shadow.png differ
diff --git a/src/iotMapManager/img/POI_SQR_SEL_Shadow.png b/src/iotMapManager/img/POI_SQR_SEL_Shadow.png
index c2a434fc..3b21f3ef 100644
Binary files a/src/iotMapManager/img/POI_SQR_SEL_Shadow.png and b/src/iotMapManager/img/POI_SQR_SEL_Shadow.png differ
diff --git a/src/iotMapManager/img/POI_SQR_Shadow.png b/src/iotMapManager/img/POI_SQR_Shadow.png
index 5835fb51..969378d1 100644
Binary files a/src/iotMapManager/img/POI_SQR_Shadow.png and b/src/iotMapManager/img/POI_SQR_Shadow.png differ
diff --git a/src/iotMapManager/iot-map-manager.css b/src/iotMapManager/iot-map-manager.css
index 5e108a46..e78cb8f7 100644
--- a/src/iotMapManager/iot-map-manager.css
+++ b/src/iotMapManager/iot-map-manager.css
@@ -18,6 +18,7 @@
@import './css/markers.css';
@import './css/popup.css';
@import './css/tabs.css';
+@import './css/shadows.css';
diff --git a/src/iotMapManager/src/iot-map-icons.ts b/src/iotMapManager/src/iot-map-icons.ts
index a2a93102..1cc7bf66 100644
--- a/src/iotMapManager/src/iot-map-icons.ts
+++ b/src/iotMapManager/src/iot-map-icons.ts
@@ -390,6 +390,7 @@ function getMarkerDivIcon (marker: IotMarker, config: IotMapConfig, selected: bo
let svgGauge = ``
let svgDirection = ``
let shadowFile = ''
+ let shadowClass = ''
const markerConfig = (selected)
? config.markers.size.selected
@@ -412,16 +413,24 @@ function getMarkerDivIcon (marker: IotMarker, config: IotMapConfig, selected: bo
svgShape = ``
svgBG = svg.selFunBg
}
- shadowFile = (marker.shape.type === ShapeType.circle) ? mobCirSelShadow : poiSqrSelShadow
+ if (marker.shape.type === ShapeType.circle) {
+ shadowFile = mobCirSelShadow
+ shadowClass = 'iotmap-selected-circle-shadow'
+ } else {
+ shadowFile = poiSqrSelShadow
+ shadowClass = 'iotmap-selected-square-shadow'
+ }
} else if (marker.shape.type === ShapeType.circle) {
if (marker.shape.anchored) {
svgBorder = svg.pinBorder
svgShape = ``
shadowFile = mobCirPinShadow
+ shadowClass = 'iotmap-circle-pin-shadow'
} else {
svgBorder = svg.border
svgShape = ``
shadowFile = mobCirShadow
+ shadowClass = 'iotmap-circle-shadow'
}
} else if (marker.shape.type === ShapeType.square) {
if (marker.shape.anchored) {
@@ -434,6 +443,7 @@ function getMarkerDivIcon (marker: IotMarker, config: IotMapConfig, selected: bo
svgBG = svg.pinFunBg
}
shadowFile = poiSqrPinShadow
+ shadowClass = 'iotmap-square-pin-shadow'
} else {
if (marker.shape.plain) {
svgBorder = svg.border
@@ -444,6 +454,7 @@ function getMarkerDivIcon (marker: IotMarker, config: IotMapConfig, selected: bo
svgBG = svg.funBg
}
shadowFile = poiSqrShadow
+ shadowClass = 'iotmap-square-shadow'
}
}
@@ -497,7 +508,7 @@ function getMarkerDivIcon (marker: IotMarker, config: IotMapConfig, selected: bo
}
// shadow
- const imgShadow = `
`
+ const imgShadow = ``
// tabs
let tab = ``