Merge pull request #29 from map-ir/MYM-1021-v3

change  useeffect in map.tsx

Author: parisajandaghi1368

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@map.ir/vector-style-editor",
-  "version": "1.5.5",
+  "version": "1.5.6",
   "type": "module",
   "description": "An editor for styling vector tiles with Mapbox style Spec.",
   "main": "dist/index.js",

src/common/map.tsx

@@ -74,10 +74,19 @@ export default function Map({ options: mapOptions, onMapLoad }: IProps) {
 
   useEffect(() => {
     if (map && isMapLoaded && styleObj) {
-      map.setStyle(styleObj);
+      const srcName = Object.keys(styleObj.sources)[0];
+      const srcData = styleObj.sources[srcName];
+      const layersStyle = styleObj.layers;
+      if (!map.getSource(srcName)) {
+        map.addSource(srcName, srcData);
+      }
+      for (const layerStyle of layersStyle) {
+        if (!map.getLayer(layerStyle.id)) {
+          map.addLayer(layerStyle);
+        }
+      }
     }
   }, [map, isMapLoaded, styleObj]);
-
   return (
     <MapWrapper>
       <div id="style-editor-map" ref={mapRef}></div>