@mint-ui/map 0.1.3-beta → 0.1.5-beta

package/README.md

@@ -1,7 +1,9 @@
-<h1>@mint-ui/map</h1>
+# @mint-ui/map
 
-**@mint-ui**
-React map library
+- React map library 
+- Control various map with one interface
+- Google, Naver map supported now
+- Typescript supported
 
 ## Installation
 
@@ -11,5 +13,41 @@ yarn add @mint-ui/map
 npm install @mint-ui/map
 ```
 
-### Document / Reference Site
+## Examples
+
+``` javascript
+...
+...
+
+import { MapMarkerWrapper, MintMap, Position } from '@mint-ui/map'
+
+const root = ReactDOM.createRoot(
+  document.getElementById('root')
+)
+
+function MyMapComponent(){
+
+  return <MintMap 
+    mapType={'google'} 
+    mapKey={'YOUR_GOOGLE_MAP_KEY'}
+    mapId='YOUR_GOOGLE_MAP_ID' //Use advanced markers in Google maps
+    base={{center:new Position(-25.344, 131.031), zoomLevel:12}}
+  >
+    {/* Your marker */}
+    <MapMarkerWrapper position={new Position(-25.344, 131.031)}>
+    
+      {/* Your marker elements */}
+      <div style={{width:'10px', height:'10px', background:'red', borderRadius:'10px'}}></div>
+      
+    </MapMarkerWrapper>
+    
+  </MintMap>
+
+}
+
+root.render((<MyMapComponent/>))
+
+```
+
+## Document / Reference Site
 - To be continue...

package/dist/components/mint-map/MintMap.d.ts

@@ -26,7 +26,13 @@ export declare class Position {
 export declare class Bounds {
     nw: Position;
     se: Position;
-    constructor(nw: Position, se: Position);
+    ne: Position;
+    sw: Position;
+    constructor(nw?: Position, se?: Position, ne?: Position, sw?: Position);
+    static fromNWSE(nw: Position, se: Position): Bounds;
+    static fromNESW(ne: Position, sw: Position): Bounds;
+    private covertNWSEtoNESW;
+    private covertNESWtoNWSE;
     getCenter(): Position;
     includes(positions: Position[]): boolean;
     includesOnlyOnePoint(positions: Position[]): boolean;

package/dist/components/mint-map/MintMap.js

@@ -29,11 +29,41 @@ var Position = function () {
 }();
 
 var Bounds = function () {
-  function Bounds(nw, se) {
+  function Bounds(nw, se, ne, sw) {
+    if (!(nw && se || ne && sw)) {
+      throw new Error('nw/se or ne/sw needed');
+    }
+
     this.nw = nw;
     this.se = se;
+    this.ne = ne;
+    this.sw = sw;
+
+    if (nw && se) {
+      this.covertNWSEtoNESW(nw, se);
+    } else if (ne && sw) {
+      this.covertNESWtoNWSE(ne, sw);
+    }
   }
 
+  Bounds.fromNWSE = function (nw, se) {
+    return new Bounds(nw, se, undefined, undefined);
+  };
+
+  Bounds.fromNESW = function (ne, sw) {
+    return new Bounds(undefined, undefined, ne, sw);
+  };
+
+  Bounds.prototype.covertNWSEtoNESW = function (nw, se) {
+    this.ne = new Position(nw.lat, se.lng);
+    this.sw = new Position(se.lat, nw.lng);
+  };
+
+  Bounds.prototype.covertNESWtoNWSE = function (ne, sw) {
+    this.nw = new Position(ne.lat, sw.lng);
+    this.se = new Position(sw.lat, ne.lng);
+  };
+
   Bounds.prototype.getCenter = function () {
     return new Position(this.nw.lat + (this.se.lat - this.nw.lat) / 2, this.nw.lng + (this.se.lng - this.nw.lng) / 2);
   };

package/dist/components/mint-map/google/GoogleMintMapController.js

@@ -396,7 +396,7 @@ var GoogleMintMapController = function (_super) {
   };
 
   GoogleMintMapController.prototype.fromGoogleBounds = function (bounds) {
-    return new MintMap.Bounds(new MintMap.Position(bounds.getSouthWest().lat(), bounds.getSouthWest().lng()), new MintMap.Position(bounds.getNorthEast().lat(), bounds.getNorthEast().lng()));
+    return MintMap.Bounds.fromNESW(new MintMap.Position(bounds.getNorthEast().lat(), bounds.getNorthEast().lng()), new MintMap.Position(bounds.getSouthWest().lat(), bounds.getSouthWest().lng()));
   };
 
   GoogleMintMapController.prototype.getCurrBounds = function () {

package/dist/components/mint-map/naver/NaverMintMapController.js

@@ -404,7 +404,7 @@ var NaverMintMapController = function (_super) {
     }
 
     var bounds = this.map.getBounds();
-    return new MintMap.Bounds(new MintMap.Position(bounds.getMin().y, bounds.getMin().x), new MintMap.Position(bounds.getMax().y, bounds.getMax().x));
+    return MintMap.Bounds.fromNWSE(new MintMap.Position(bounds.getMin().y, bounds.getMin().x), new MintMap.Position(bounds.getMax().y, bounds.getMax().x));
   };
 
   NaverMintMapController.prototype.panningTo = function (targetCenter) {

package/dist/index.es.js

@@ -718,7 +718,7 @@ var NaverMintMapController = function (_super) {
     }
 
     var bounds = this.map.getBounds();
-    return new Bounds(new Position(bounds.getMin().y, bounds.getMin().x), new Position(bounds.getMax().y, bounds.getMax().x));
+    return Bounds.fromNWSE(new Position(bounds.getMin().y, bounds.getMin().x), new Position(bounds.getMax().y, bounds.getMax().x));
   };
 
   NaverMintMapController.prototype.panningTo = function (targetCenter) {
@@ -1127,7 +1127,7 @@ var GoogleMintMapController = function (_super) {
   };
 
   GoogleMintMapController.prototype.fromGoogleBounds = function (bounds) {
-    return new Bounds(new Position(bounds.getSouthWest().lat(), bounds.getSouthWest().lng()), new Position(bounds.getNorthEast().lat(), bounds.getNorthEast().lng()));
+    return Bounds.fromNESW(new Position(bounds.getNorthEast().lat(), bounds.getNorthEast().lng()), new Position(bounds.getSouthWest().lat(), bounds.getSouthWest().lng()));
   };
 
   GoogleMintMapController.prototype.getCurrBounds = function () {
@@ -1171,11 +1171,41 @@ var Position = function () {
 }();
 
 var Bounds = function () {
-  function Bounds(nw, se) {
+  function Bounds(nw, se, ne, sw) {
+    if (!(nw && se || ne && sw)) {
+      throw new Error('nw/se or ne/sw needed');
+    }
+
     this.nw = nw;
     this.se = se;
+    this.ne = ne;
+    this.sw = sw;
+
+    if (nw && se) {
+      this.covertNWSEtoNESW(nw, se);
+    } else if (ne && sw) {
+      this.covertNESWtoNWSE(ne, sw);
+    }
   }
 
+  Bounds.fromNWSE = function (nw, se) {
+    return new Bounds(nw, se, undefined, undefined);
+  };
+
+  Bounds.fromNESW = function (ne, sw) {
+    return new Bounds(undefined, undefined, ne, sw);
+  };
+
+  Bounds.prototype.covertNWSEtoNESW = function (nw, se) {
+    this.ne = new Position(nw.lat, se.lng);
+    this.sw = new Position(se.lat, nw.lng);
+  };
+
+  Bounds.prototype.covertNESWtoNWSE = function (ne, sw) {
+    this.nw = new Position(ne.lat, sw.lng);
+    this.se = new Position(sw.lat, ne.lng);
+  };
+
   Bounds.prototype.getCenter = function () {
     return new Position(this.nw.lat + (this.se.lat - this.nw.lat) / 2, this.nw.lng + (this.se.lng - this.nw.lng) / 2);
   };

package/dist/index.umd.js

@@ -724,7 +724,7 @@
       }
 
       var bounds = this.map.getBounds();
-      return new Bounds(new Position(bounds.getMin().y, bounds.getMin().x), new Position(bounds.getMax().y, bounds.getMax().x));
+      return Bounds.fromNWSE(new Position(bounds.getMin().y, bounds.getMin().x), new Position(bounds.getMax().y, bounds.getMax().x));
     };
 
     NaverMintMapController.prototype.panningTo = function (targetCenter) {
@@ -1133,7 +1133,7 @@
     };
 
     GoogleMintMapController.prototype.fromGoogleBounds = function (bounds) {
-      return new Bounds(new Position(bounds.getSouthWest().lat(), bounds.getSouthWest().lng()), new Position(bounds.getNorthEast().lat(), bounds.getNorthEast().lng()));
+      return Bounds.fromNESW(new Position(bounds.getNorthEast().lat(), bounds.getNorthEast().lng()), new Position(bounds.getSouthWest().lat(), bounds.getSouthWest().lng()));
     };
 
     GoogleMintMapController.prototype.getCurrBounds = function () {
@@ -1177,11 +1177,41 @@
   }();
 
   var Bounds = function () {
-    function Bounds(nw, se) {
+    function Bounds(nw, se, ne, sw) {
+      if (!(nw && se || ne && sw)) {
+        throw new Error('nw/se or ne/sw needed');
+      }
+
       this.nw = nw;
       this.se = se;
+      this.ne = ne;
+      this.sw = sw;
+
+      if (nw && se) {
+        this.covertNWSEtoNESW(nw, se);
+      } else if (ne && sw) {
+        this.covertNESWtoNWSE(ne, sw);
+      }
     }
 
+    Bounds.fromNWSE = function (nw, se) {
+      return new Bounds(nw, se, undefined, undefined);
+    };
+
+    Bounds.fromNESW = function (ne, sw) {
+      return new Bounds(undefined, undefined, ne, sw);
+    };
+
+    Bounds.prototype.covertNWSEtoNESW = function (nw, se) {
+      this.ne = new Position(nw.lat, se.lng);
+      this.sw = new Position(se.lat, nw.lng);
+    };
+
+    Bounds.prototype.covertNESWtoNWSE = function (ne, sw) {
+      this.nw = new Position(ne.lat, sw.lng);
+      this.se = new Position(sw.lat, ne.lng);
+    };
+
     Bounds.prototype.getCenter = function () {
       return new Position(this.nw.lat + (this.se.lat - this.nw.lat) / 2, this.nw.lng + (this.se.lng - this.nw.lng) / 2);
     };

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@mint-ui/map",
-  "version": "0.1.3-beta",
+  "version": "0.1.5-beta",
   "main": "./dist/index.js",
   "module": "./dist/index.es.js",
   "browser": "./dist/index.umd.js",
   "types": "./dist/index.d.ts",
   "repository": "https://github.com/dev-rsquare/mint-ui-map",
   "author": "RSQUARE",
-  "keywords": ["react", "map", "google", "naver", "library"],
+  "keywords": ["react", "map", "google", "naver", "library", "typescript"],
   "license": "MIT",
   "private": false,
   "devDependencies": {