fix(vector-map-glyph): add image scale to calculate correct image size and and...

fix(vector-map-glyph): add image scale to calculate correct image size and and auto switch map background when overlay is enabled

Closes MIN-110

src/components/Map/MapViewer/MapViewerVector/listeners/mouseClick/mouseLeftClick/onMapLeftClick.ts

@@ -27,7 +27,15 @@ export const onMapLeftClick =
 
       let featureAtPixel: FeatureLike | undefined;
       mapInstance.forEachFeatureAtPixel(pixel, (feature, ) => {
-        if(feature.get('id') && [...Object.values(FEATURE_TYPE)].includes(feature.get('type')) && feature.get('zIndex') >= 0) {
+        if(
+          feature.get('id') &&
+          (
+            feature.get('type') === FEATURE_TYPE.COMPARTMENT && feature.get('filled') ||
+            [...Object.values(FEATURE_TYPE)].includes(feature.get('type')) && feature.get('type') !== FEATURE_TYPE.COMPARTMENT
+          )
+          && feature.get('zIndex') >= 0
+          && !feature.get('hidden')
+        ) {
           featureAtPixel = feature;
           return true;
         }
@@ -53,7 +61,7 @@ export const onMapLeftClick =
 
       const type = featureAtPixel.get('type');
       const id = featureAtPixel.get('id');
-      if([FEATURE_TYPE.ALIAS, FEATURE_TYPE.GLYPH].includes(type)) {
+      if([FEATURE_TYPE.ALIAS, FEATURE_TYPE.GLYPH, FEATURE_TYPE.COMPARTMENT].includes(type)) {
         await leftClickHandleAlias(dispatch)(featureAtPixel, modelId);
       } else if (type === FEATURE_TYPE.REACTION) {
         clickHandleReaction(dispatch)(modelElements, reactions, id,  modelId);