@vidro/map-handler 1.3.2 → 1.3.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +67 -1
- package/dist/map-handler.js +1 -1
- package/map-handler.d.ts +134 -0
- package/package.json +10 -4
- package/src/types.d.ts +63 -0
- package/.babelrc +0 -6
- package/doc/animation.png +0 -0
- package/doc/confirmComponent.png +0 -0
- package/doc/giswater.png +0 -0
- package/doc/giswaterInfo.png +0 -0
- package/doc/giswaterInfoApi.png +0 -0
- package/doc/giswatergeojson.png +0 -0
- package/doc/multiTile.png +0 -0
- package/doc/multiTileNoGutter.png +0 -0
- package/doc/togglelayergiswater.png +0 -0
- package/doc/vidromaps-basic.png +0 -0
- package/examples/full/apidemo.js +0 -387
- package/examples/full/cachedToken.dat +0 -1
- package/examples/full/cachedTokenData.dat +0 -1
- package/examples/full/docker/Docker_compose.yml +0 -14
- package/examples/full/docker/Dockerfile +0 -27
- package/examples/full/index.php +0 -200
- package/examples/full/storeToken.php +0 -6
- package/examples/full/tester.css +0 -74
- package/examples/full/tester.js +0 -658
- package/examples/multipleIframes/index.js +0 -82
- package/examples/multipleIframes/index.php +0 -52
- package/examples/react-next/README.md +0 -282
- package/examples/react-next/atoms/PrintLayoutSelector.js +0 -51
- package/examples/react-next/atoms/PrintPaperSizeSelector.js +0 -49
- package/examples/react-next/atoms/PrintScaleSelector.js +0 -61
- package/examples/react-next/atoms/ZoomToScaleButton.js +0 -57
- package/examples/react-next/components/AuthComponent.js +0 -88
- package/examples/react-next/components/MapButtons.js +0 -108
- package/examples/react-next/components/MapFilters.js +0 -120
- package/examples/react-next/components/MapIframe.js +0 -25
- package/examples/react-next/components/MapInfo.js +0 -36
- package/examples/react-next/components/MapLayers.js +0 -60
- package/examples/react-next/components/MapList.js +0 -51
- package/examples/react-next/components/MapPrint.js +0 -50
- package/examples/react-next/contexts/auth.js +0 -147
- package/examples/react-next/contexts/maps.js +0 -185
- package/examples/react-next/contexts/messages.js +0 -358
- package/examples/react-next/contexts/print.js +0 -125
- package/examples/react-next/env.sample +0 -3
- package/examples/react-next/eslint.config.mjs +0 -14
- package/examples/react-next/hooks/useMapEvents.js +0 -118
- package/examples/react-next/jsconfig.json +0 -7
- package/examples/react-next/next.config.mjs +0 -6
- package/examples/react-next/package.json +0 -25
- package/examples/react-next/pages/_app.js +0 -5
- package/examples/react-next/pages/index.js +0 -97
- package/examples/react-next/postcss.config.mjs +0 -8
- package/examples/react-next/public/discord.svg +0 -8
- package/examples/react-next/public/favicon.ico +0 -0
- package/examples/react-next/public/file.svg +0 -1
- package/examples/react-next/public/logo.png +0 -0
- package/examples/react-next/public/next.svg +0 -1
- package/examples/react-next/shared/constants.js +0 -48
- package/examples/react-next/shared/cookies.js +0 -23
- package/examples/react-next/styles/globals.css +0 -24
- package/examples/react-next/tailwind.config.mjs +0 -17
- package/examples/serverLess/dist/index.23420cfa.js +0 -2973
- package/examples/serverLess/dist/index.23420cfa.js.map +0 -1
- package/examples/serverLess/dist/index.91b6cacc.js +0 -2
- package/examples/serverLess/dist/index.91b6cacc.js.map +0 -1
- package/examples/serverLess/dist/index.html +0 -1
- package/examples/serverLess/index.html +0 -39
- package/examples/serverLess/main.js +0 -113
- package/examples/serverLess/package.json +0 -18
- package/examples/serverLess/readme.md +0 -41
- package/examples/simple/index.html +0 -23
- package/examples/simple/simple.js +0 -80
- package/examples/taigua/index.html +0 -55
- package/examples/taigua/main.js +0 -490
- package/examples/tester.css +0 -74
- package/examples/vidromap/index.js +0 -20
- package/examples/vidromap/index.php +0 -111
- package/flows.md +0 -73
- package/helpers.md +0 -45
- package/src/index.js +0 -882
- package/src/shared/iframe-communicator.js +0 -18
- package/webpack.config.js +0 -22
|
@@ -1,111 +0,0 @@
|
|
|
1
|
-
<html>
|
|
2
|
-
<head>
|
|
3
|
-
<title>🛠️ MAP TESTER - Vidro Map</title>
|
|
4
|
-
<link rel="stylesheet" href="../tester.css"></link>
|
|
5
|
-
<link rel="icon" type="image/png" href="https://www.vidrosoftware.com/favicon/favicon-32x32.png" sizes="32x32" />
|
|
6
|
-
<link rel="icon" type="image/png" href="https://www.vidrosoftware.com/favicon/favicon-16x16.png" sizes="16x16" />
|
|
7
|
-
</head>
|
|
8
|
-
<body>
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
<div class="form" id="userData">
|
|
13
|
-
<h1>Vidromap</h1>
|
|
14
|
-
|
|
15
|
-
<div id="sessionToken"></div>
|
|
16
|
-
<div>
|
|
17
|
-
Paste your code here:<br> <textarea name="code" id="code" rows="10" cols="100" placeholder="">
|
|
18
|
-
</textarea>
|
|
19
|
-
</div>
|
|
20
|
-
<div>
|
|
21
|
-
<button id="btGetElementsFromLayer">List Elements from layer</button>
|
|
22
|
-
<select id="format">
|
|
23
|
-
<option id="xml" selected value="xml">XML</option>
|
|
24
|
-
<option id="json" value="json">JSON</option>
|
|
25
|
-
</select> <small>Output format</small> Limit:
|
|
26
|
-
<input type="limit" name="limit" id="limit" size="4" value="2"><br><br>
|
|
27
|
-
</div>
|
|
28
|
-
<div>
|
|
29
|
-
Debug
|
|
30
|
-
<button id="btDebug">Debug</button>
|
|
31
|
-
<select id="debug">
|
|
32
|
-
<option id="1" selected value=1>Show logs</option>
|
|
33
|
-
<option id="0" value=0>Hide logs</option>
|
|
34
|
-
</select> <small>Show/hide component logs</small>
|
|
35
|
-
</div>
|
|
36
|
-
</div>
|
|
37
|
-
<div>
|
|
38
|
-
<button id="btLoadIframe">Load Map</button> -
|
|
39
|
-
<button id="btLoadWMSLayers">Load layers from wms</button>
|
|
40
|
-
</div>
|
|
41
|
-
<div id="Error_container"></div>
|
|
42
|
-
<div id="mapContainer">
|
|
43
|
-
|
|
44
|
-
<div id="iframes-container">
|
|
45
|
-
|
|
46
|
-
</div>
|
|
47
|
-
<hr />
|
|
48
|
-
<pre id="Result_container"></pre>
|
|
49
|
-
<hr/>
|
|
50
|
-
<h2>Custom colors</h2>
|
|
51
|
-
Geom fill color: <input type="text" name="geom_fill_color" id="geom_fill_color" size="12" value="rgba(252,0,0,0.37)"><br><br>
|
|
52
|
-
Geom stroke color: <input type="text" name="geom_stroke_color" id="geom_stroke_color" size="12" value="rgba(252,0,0,0.37)"><br><br>
|
|
53
|
-
Geom stroke width: <input type="text" name="geom_stroke_width" id="geom_stroke_width" size="4" value="1"><br><br>
|
|
54
|
-
Geom shape for points - circle/square: <select id="geom_shape">
|
|
55
|
-
<option id="circle" selected value="circle">Circle</option>
|
|
56
|
-
<option id="square" value="square">Square</option>
|
|
57
|
-
</select><br><br>
|
|
58
|
-
Point radius: <input type="text" name="geom_radius" id="geom_radius" size="4" value="4"><br><br>
|
|
59
|
-
<button id="btSetColors">Set colors</button> <br><br>
|
|
60
|
-
|
|
61
|
-
<h2>Zoom</h2>
|
|
62
|
-
<button id="btZoomIn">Zoom In</button>
|
|
63
|
-
<button id="btZoomOut">Zoom Out</button>
|
|
64
|
-
<button id="btZoomToExtent">Zoom to extent</button>
|
|
65
|
-
<br><br>
|
|
66
|
-
<button id="btZoomToCoordinates">Zoom to coordinates</button>
|
|
67
|
-
ZoomToCoordinates level: <input type="text" name="zoomLevelToCoordinates" id="zoomLevelToCoordinates" size="5" value="4">
|
|
68
|
-
<h2>Add geometry</h2>
|
|
69
|
-
<button id="btAddPoint">Add point</button>
|
|
70
|
-
<button id="btAddPolygon">Add polygon</button>
|
|
71
|
-
<button id="btAddLine">Add line</button>
|
|
72
|
-
<button id="btClear">Clear geometries</button>
|
|
73
|
-
<h2>Info</h2>
|
|
74
|
-
<button id="btWMSInfo" disabled="true">WMS Info</button>
|
|
75
|
-
<select id="formatWMS">
|
|
76
|
-
<option id="xml" selected value="xml">XML</option>
|
|
77
|
-
<option id="json" value="json">JSON</option>
|
|
78
|
-
</select> <small>Output format</small>
|
|
79
|
-
<br>
|
|
80
|
-
<h2>Layers</h2>
|
|
81
|
-
Project Layers: <select id="projectlayers"></select> - <small>click on "Load Project Layers button</small> <button id="btToggleLayer">Add / Remove Layer</button><br><br>
|
|
82
|
-
Displayed Layers: <select id="layers"></select> -
|
|
83
|
-
<button id="btActiveLayer">Set Active Layer</button>
|
|
84
|
-
<button id="btGetActiveLayer">Get Active Layer</button>
|
|
85
|
-
<span id="currentActiveLayer"></span>
|
|
86
|
-
|
|
87
|
-
<h2>Geolocation</h2>
|
|
88
|
-
<button id="btGeolocalize">Geolocalize User</button>
|
|
89
|
-
<button id="btStopGeolocalize">Cancel Geolocalize</button>
|
|
90
|
-
|
|
91
|
-
<h2>Highlight</h2>
|
|
92
|
-
<button id="btHighlight">Highlight geom</button>
|
|
93
|
-
Geom: <input type="text" name="geom" id="geom" size="25" value="">
|
|
94
|
-
<br>
|
|
95
|
-
Highlight to zoom level: <input type="text" name="zoomLevel" id="zoomLevel" size="5" value=""> or Zoom to geometry: <input type="checkbox" name="zoomToHighlightCheck" id="zoomToHighlightCheck" size="5" value="">
|
|
96
|
-
<h2>GeoJSON</h2>
|
|
97
|
-
<input type="file" id="geojsonfile" name="geojsonfile" accept="application/json"><small> Select geoJSON file</small><br><br>
|
|
98
|
-
<small>Or paste geoJSON content</small><br><br>
|
|
99
|
-
<textarea name="geojsondata" id="geojsondata" rows="10" cols="80" placeholder=""></textarea> <br><br>
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
<button id="btAddGeoJSON">Add GeoJSON </button><br><br>
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
</div>
|
|
106
|
-
|
|
107
|
-
<script src="https://unpkg.com/@vidro/map-handler@1.0.11/dist/map-handler.js"></script>
|
|
108
|
-
<script src="../full/tester.js"></script>
|
|
109
|
-
<script src="./index.js"></script>
|
|
110
|
-
</body>
|
|
111
|
-
</html>
|
package/flows.md
DELETED
|
@@ -1,73 +0,0 @@
|
|
|
1
|
-
# Map Handler flows
|
|
2
|
-
|
|
3
|
-
This document defines use case flows of map handler
|
|
4
|
-
|
|
5
|
-
## Vidromaps basic flow
|
|
6
|
-
|
|
7
|
-
Vidromaps basic flow
|
|
8
|
-
|
|
9
|
-
1. Login to giswater - API `letsgo`
|
|
10
|
-
2. Get map - API `map/{project_id}`
|
|
11
|
-
3. Load iframe
|
|
12
|
-
|
|
13
|
-

|
|
14
|
-
|
|
15
|
-
## Giswater basic flow
|
|
16
|
-
|
|
17
|
-
Giswater basic flow
|
|
18
|
-
|
|
19
|
-
1. Login to giswater - API `letsgo`
|
|
20
|
-
2. Get map - API `map/{project_id}`
|
|
21
|
-
3. Load iframe
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-

|
|
25
|
-
|
|
26
|
-
## Giswater info
|
|
27
|
-
|
|
28
|
-
Giswater info can be performed using mapHandler or usind API REST methods
|
|
29
|
-
|
|
30
|
-
1. Login to giswater - API `letsgo`
|
|
31
|
-
2. Get map - API `map/{project_id}`
|
|
32
|
-
3. Load iframe
|
|
33
|
-
4. Instance mapHandler - `new VidroMaps.Communicator({sessionToken});`
|
|
34
|
-
5. Click on map
|
|
35
|
-
|
|
36
|
-
**Using mapHandler**
|
|
37
|
-
|
|
38
|
-
6. Info`mapHandler.js` method [**`infofromcoordinates `**](https://github.com/Vidro-Software-SL/maphandler#infofromcoordinates)
|
|
39
|
-

|
|
40
|
-
|
|
41
|
-
**Using API REST**
|
|
42
|
-
|
|
43
|
-
6. Listen event [**`coordinates`**](https://github.com/Vidro-Software-SL/maphandler#coordinates)
|
|
44
|
-
7. POST to API `giswater/info` with x, y, srid and device parameters.
|
|
45
|
-
|
|
46
|
-

|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
## Giswater display layer
|
|
50
|
-
|
|
51
|
-
Display a Giswater layer using mapHandler
|
|
52
|
-
|
|
53
|
-
1. Login to giswater - API `letsgo`
|
|
54
|
-
2. Get map - API `map/{project_id}`
|
|
55
|
-
3. Load iframe
|
|
56
|
-
4. Instance mapHandler - `new VidroMaps.Communicator({sessionToken});`
|
|
57
|
-
5. Render layer using `mapHandler.js` method [**`toggleLayer`**](https://github.com/Vidro-Software-SL/maphandler#togglelayer)
|
|
58
|
-
|
|
59
|
-

|
|
60
|
-
|
|
61
|
-
## Giswater JSON layer
|
|
62
|
-
|
|
63
|
-
Giswater layers can be rendered as geojson.
|
|
64
|
-
|
|
65
|
-
1. Login to giswater - API `letsgo`
|
|
66
|
-
2. Get map - API `map/{project_id}`
|
|
67
|
-
3. Load iframe
|
|
68
|
-
4. Get geojson data for a layer - API `giswater/geojson/{project_id}/{layer_name}`.
|
|
69
|
-
5. Instance mapHandler - `new VidroMaps.Communicator({sessionToken});`
|
|
70
|
-
6. Render geojson data using `maphandler.js` method [**`addGeoJSON`**](https://github.com/Vidro-Software-SL/maphandler#addgeojson)
|
|
71
|
-

|
|
72
|
-
|
|
73
|
-
|
package/helpers.md
DELETED
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
##### Image to ArrayBuffer
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
>Helper function to fetch image as ArrayBuffer
|
|
5
|
-
|
|
6
|
-
```
|
|
7
|
-
const fetchImageAsArrayBuffer = async (path) => {
|
|
8
|
-
try {
|
|
9
|
-
const response = await fetch(path); // Fetch the image from the path
|
|
10
|
-
const buffer = await response.arrayBuffer(); // Convert response to ArrayBuffer
|
|
11
|
-
return buffer; // Return the binary data
|
|
12
|
-
} catch (error) {
|
|
13
|
-
console.error("Error fetching image:", error);
|
|
14
|
-
throw error;
|
|
15
|
-
}
|
|
16
|
-
};
|
|
17
|
-
```
|
|
18
|
-
|
|
19
|
-
>Helper function to set image as ArrayBuffer with vanilla js
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
```
|
|
23
|
-
// Simulate a call to Dropbox or other service that can
|
|
24
|
-
// return an image as an ArrayBuffer.
|
|
25
|
-
var xhr = new XMLHttpRequest();
|
|
26
|
-
|
|
27
|
-
// Use JSFiddle logo as a sample image to avoid complicating
|
|
28
|
-
// this example with cross-domain issues.
|
|
29
|
-
xhr.open( "GET", "http://fiddle.jshell.net/img/logo.png", true );
|
|
30
|
-
|
|
31
|
-
// Ask for the result as an ArrayBuffer.
|
|
32
|
-
xhr.responseType = "arraybuffer";
|
|
33
|
-
|
|
34
|
-
xhr.onload = function( e ) {
|
|
35
|
-
// Obtain a blob: URL for the image data.
|
|
36
|
-
var arrayBufferView = new Uint8Array( this.response );
|
|
37
|
-
var blob = new Blob( [ arrayBufferView ], { type: "image/jpeg" } );
|
|
38
|
-
var urlCreator = window.URL || window.webkitURL;
|
|
39
|
-
var imageUrl = urlCreator.createObjectURL( blob );
|
|
40
|
-
var img = document.querySelector( "#photo" );
|
|
41
|
-
img.src = imageUrl;
|
|
42
|
-
};
|
|
43
|
-
|
|
44
|
-
xhr.send();
|
|
45
|
-
```
|