From fb9f54cfebd677900d9d9013ea9e575237a5c4f1 Mon Sep 17 00:00:00 2001
From: iamtekson <teksondada@gmail.com>
Date: Fri, 23 Jul 2021 12:21:04 +0700
Subject: [PATCH] correction on docs

---
 README.md                 | 64 +++++++++++++++++++--------------------
 demo/index.html           |  2 +-
 src/leaflet-geojson-vt.js |  6 ++--
 3 files changed, 35 insertions(+), 37 deletions(-)

diff --git a/README.md b/README.md
index d10566a..53cdfc9 100644
--- a/README.md
+++ b/README.md
@@ -2,25 +2,45 @@
 
 It is a open-source leaflet plugin which generate the vector tiles for geojson data. It has the dev-dependency of [geojson-vt-leaflet](https://github.com/handygeospatial/geojson-vt-leaflet).
 
-## Usage
+## Demo
+
+[DEMO](https://iamtekson.github.io/leaflet-geojson-vt/demo/)
+
+## Installation and setup
 
+- Using NPM:
+
+```js
+npm install leaflet-geojson-vt
 ```
+
+- Quick use:
+
+```js
+<script src="https://unpkg.com/geojson-vt@3.2.0/geojson-vt.js"></script>
+<script src="[path to js]/leaflet-geojson-vt.js"></script>
+```
+
+## Usage
+
+```js
 var options = {
-    maxZoom: 16,
-    tolerance: 3,
-    debug: 0,
-    style: {
-        fillColor: '#1EB300',
-        color: '#F2FF00',
-        weight: 2
-    }
+  maxZoom: 16,
+  tolerance: 3,
+  debug: 0,
+  style: {
+    fillColor: "#1EB300",
+    color: "#F2FF00",
+  },
 };
-var canvasLayer = L.gridLayer.geoJson(json, options).addTo(map);
+var vtLayer = L.geoJson.vt(geojson, options).addTo(map);
 ```
 
 Options are included with [geojson-vt options](https://github.com/mapbox/geojson-vt#options) and [L.geojson style](http://leafletjs.com/reference.html#path-options).
 
-```
+The following are the default options from geojson-vt.
+
+```js
 var tileIndex = geojsonvt(data, {
     maxZoom: 14,  // max zoom to preserve detail on
     tolerance: 3, // simplification tolerance (higher means simpler)
@@ -38,28 +58,6 @@ var tileIndex = geojsonvt(data, {
 
 - [geojson-vt](https://github.com/mapbox/geojson-vt)
 
-## Demo
-
-[DEMO](https://brandonxiang.github.io/leaflet-geojson-vt/test)
-
-## Test
-
-run npm script with `browser-sync`
-
-```
-npm run dev
-```
-
-Browser on `http://localhost:3000/test`
-
-## TODO
-
-[TODO](doc/TODO.md)
-
-## Changelog
-
-[changelog](doc/changelog.md)
-
 ## License
 
 [LICENSE](LICENSE)
diff --git a/demo/index.html b/demo/index.html
index d108ccf..218f40b 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -65,7 +65,7 @@
     debug: 0,
     style: geojsonStyle
 };
-var canvasLayer = L.gridLayer.geoJson(data, options).addTo(map);
+var canvasLayer = L.geoJson.vt(data, options).addTo(map);
 
 console.log(canvasLayer)
 
diff --git a/src/leaflet-geojson-vt.js b/src/leaflet-geojson-vt.js
index c6573e6..33c4f00 100644
--- a/src/leaflet-geojson-vt.js
+++ b/src/leaflet-geojson-vt.js
@@ -1,4 +1,4 @@
-L.GridLayer.GeoJSON = L.GridLayer.extend({
+L.GeoJSON.VT = L.GridLayer.extend({
   options: {
     async: false,
   },
@@ -98,8 +98,8 @@ L.GridLayer.GeoJSON = L.GridLayer.extend({
   },
 });
 
-L.gridLayer.geoJson = function (geojson, options) {
-  return new L.GridLayer.GeoJSON(geojson, options);
+L.geoJson.vt = function (geojson, options) {
+  return new L.GeoJSON.VT(geojson, options);
 };
 
 String.prototype.iscolorHex = function () {