@mappedin/mappedin-js 5.16.0 → 5.18.0

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.
Files changed (25) hide show
  1. package/README.md +10 -135
  2. package/lib/esm/get-venue/index.js +1 -1
  3. package/lib/esm/navigator/index.js +1 -1
  4. package/lib/esm/renderer/{Arrival-7GULGCVJ.js → Arrival-7RQOIYDT.js} +1 -1
  5. package/lib/esm/renderer/{Chalet-4E7PX7WT.js → Chalet-BU67ABNM.js} +1 -1
  6. package/lib/esm/renderer/{HelveticaNeue-UEVLJKVU.js → HelveticaNeue-LMAJKD43.js} +1 -1
  7. package/lib/esm/renderer/{Helvetiker-SNVJCSDR.js → Helvetiker-NJKVVKLU.js} +1 -1
  8. package/lib/esm/renderer/{Lato-FDCJ5GCG.js → Lato-4S4GNVAX.js} +1 -1
  9. package/lib/esm/renderer/{MyriadPro-NQ2DCXFB.js → MyriadPro-LTC2Z4HK.js} +1 -1
  10. package/lib/esm/renderer/{ProximaNova-MIBCMRZX.js → ProximaNova-2HOTLKJS.js} +1 -1
  11. package/lib/esm/renderer/{SimonCircular-B2HEOOJY.js → SimonCircular-YVIITNI5.js} +1 -1
  12. package/lib/esm/renderer/{browser-42K2OAVV.js → browser-2XCWK5A2.js} +1 -1
  13. package/lib/esm/renderer/chunk-APUNUWA7.js +1 -0
  14. package/lib/esm/renderer/chunk-WAMGE363.js +1 -0
  15. package/lib/esm/renderer/chunk-XPQLPFMX.js +1 -0
  16. package/lib/esm/renderer/index.css +1 -1
  17. package/lib/esm/renderer/index.d.ts +1162 -306
  18. package/lib/esm/renderer/index.js +1 -1
  19. package/lib/esm/renderer/outdoor-context-O5V4X4BR.js +1 -0
  20. package/lib/mappedin.css +1 -1
  21. package/lib/mappedin.js +1 -1
  22. package/lib/node/index.js +1 -1
  23. package/package.json +3 -2
  24. package/lib/esm/renderer/chunk-A74TA65P.js +0 -1
  25. package/lib/esm/renderer/chunk-XTLZV3YN.js +0 -1
package/README.md CHANGED
@@ -3,12 +3,14 @@
3
3
  ## Resources
4
4
 
5
5
  - [Mappedin Developer Portal](https://developer.mappedin.com)
6
- - [Releases and Roadmap](https://developer.mappedin.com/releases)
7
- - [Trial Keys](https://developer.mappedin.com/guides/api-keys)
6
+ - [Releases and Roadmap](https://developer.mappedin.com/releases/)
7
+ - [Getting Started Guide](https://developer.mappedin.com/web-sdk/v5/getting-started/)
8
+ - [API Reference](https://developer.mappedin.com/web-sdk-api/v5/)
9
+ - [Trial Keys](https://developer.mappedin.com/api-keys/)
8
10
 
9
11
  ## Usage
10
12
 
11
- ### In ES6 modular apps, using NPM
13
+ ### Installation
12
14
 
13
15
  `npm install @mappedin/mappedin-js`
14
16
 
@@ -16,6 +18,8 @@ or
16
18
 
17
19
  `yarn add @mappedin/mappedin-js`
18
20
 
21
+ ### Getting Started
22
+
19
23
  ```javascript
20
24
  import { getVenue, showVenue, E_SDK_EVENT } from '@mappedin/mappedin-js';
21
25
  import '@mappedin/mappedin-js/lib/index.css';
@@ -24,13 +28,10 @@ async function init() {
24
28
  const venueData = await getVenue({
25
29
  clientId: '<clientId>',
26
30
  clientSecret: '<clientSecret>',
27
- venue: '<venue>'
31
+ venue: '<venue>',
28
32
  });
29
33
 
30
- const mapView = await showVenue(
31
- document.getElementById('mappedin-map'),
32
- venueData
33
- );
34
+ const mapView = await showVenue(document.getElementById('mappedin-map'), venueData);
34
35
  mapView.FloatingLabels.labelAllLocations();
35
36
  mapView.addInteractivePolygonsForAllLocations();
36
37
  mapView.on(E_SDK_EVENT.CLICK, ({ polygons }) => {
@@ -40,130 +41,4 @@ async function init() {
40
41
  document.addEventListener('DOMContentLoaded', init);
41
42
  ```
42
43
 
43
- ### In the browser
44
-
45
- Usage in the browser requires adding a script and link tags that point at the CDN.
46
-
47
- ```html
48
- <!DOCTYPE html>
49
- <html>
50
- <head>
51
- <meta charset="utf-8" />
52
- <title>Sample</title>
53
- <meta name="viewport" content="width=device-width,initial-scale=1" />
54
- <link rel="icon" href="favicon.ico" />
55
- <link
56
- rel="stylesheet"
57
- href="https://d1p5cqqchvbqmy.cloudfront.net/websdk/v4.0.16/mappedin.css"
58
- />
59
- </head>
60
- <body>
61
- <div data-key="" id="mappedin-map"></div>
62
- <style>
63
- body,
64
- html,
65
- #mappedin-map {
66
- width: 100%;
67
- height: 100%;
68
- }
69
- </style>
70
- <script src="https://d1p5cqqchvbqmy.cloudfront.net/websdk/v4.0.16/mappedin.js"></script>
71
- <script>
72
- async function init() {
73
- const venue = await Mappedin.getVenue({
74
- clientId: '<clientId>',
75
- clientSecret: '<clientSecret>',
76
- venue: '<venue>'
77
- });
78
- const mapView = await Mappedin.showVenue(
79
- document.getElementById('mappedin-map'),
80
- venue
81
- );
82
- mapView.FloatingLabels.labelAllLocations();
83
- }
84
- document.addEventListener('DOMContentLoaded', init);
85
- </script>
86
- </body>
87
- </html>
88
- ```
89
-
90
- ### In the browser (ESM)
91
-
92
- The Mappedin SDK supports ESM (EcmaScriptModules), meaning we can import files directly right in the script tag.
93
-
94
- ```html
95
- <!DOCTYPE html>
96
- <html>
97
- <head>
98
- <meta charset="utf-8" />
99
- <title>Mappedin Sample</title>
100
- <meta name="viewport" content="width=device-width,initial-scale=1" />
101
- <link rel="icon" href="favicon.ico" />
102
- <link
103
- rel="stylesheet"
104
- href="https://d1p5cqqchvbqmy.cloudfront.net/websdk/v4.0.16/esm/renderer/index.css"
105
- />
106
- </head>
107
- <body>
108
- <div id="mappedin-map"></div>
109
- <style>
110
- body,
111
- html,
112
- #mappedin-map {
113
- width: 100%;
114
- height: 100%;
115
- position: relative;
116
- }
117
- </style>
118
- <script type="module">
119
- import {
120
- getVenue,
121
- showVenue
122
- } from 'https://d1p5cqqchvbqmy.cloudfront.net/websdk/v4.0.16/esm/renderer/index.js';
123
-
124
- async function init() {
125
- const venue = await getVenue({
126
- clientId: '<clientId>',
127
- clientSecret: '<clientSecret>',
128
- venue: '<venue>'
129
- });
130
- const mapView = await showVenue(
131
- document.getElementById('mappedin-map'),
132
- venue
133
- );
134
- mapView.FloatingLabels.labelAllLocations();
135
- }
136
- document.addEventListener('DOMContentLoaded', init);
137
- </script>
138
- </body>
139
- </html>
140
- ```
141
-
142
- ### Using get-venue or navigator modules without the renderer
143
-
144
- Both `get-venue` and `navigator` packages can be used separately, without loading the renderer. This is useful for applications that need access to Mappedin API data and/or Directions engine, but without needing a renderer.
145
-
146
- ```javascript
147
- import getVenue from '@mappedin/mappedin-js/lib/esm/get-venue';
148
-
149
- async function init() {
150
- const venueData = await getVenue({
151
- clientId: '<clientId>',
152
- clientSecret: '<clientSecret>',
153
- venue: '<venue>'
154
- });
155
- }
156
- document.addEventListener('DOMContentLoaded', init);
157
- ```
158
-
159
- ## Debugging
160
-
161
- ### Three.js
162
-
163
- In order to inspect three.js, content it is possible to use the [three-devtools web extension](https://github.com/threejs/three-devtools). The alpha version of the developer tools can be installed as a web extension on [Firefox Add-ons/AMO](https://addons.mozilla.org/en-US/firefox/addon/three-js-developer-tools/) and directly from the [repo](https://github.com/threejs/three-devtools) for Google Chrome.
164
-
165
- In order to install Google Chrome extension manually follow the steps below:
166
-
167
- 1. Clone the [three-devtools repo](https://github.com/threejs/three-devtools)
168
- 1. Visit chrome://extensions/ and turn on "Developer mode"
169
- 1. Click "Load unpacked" button and navigate to the folder you downloaded from GitHub
44
+ For full documentation, read our [Getting Started guide on the Developer Portal](https://developer.mappedin.com/web-sdk/v5/getting-started/). Developers using React or Angular should follow our [Using React](https://developer.mappedin.com/web-sdk/v5/using-react/) or [Using Angular](https://developer.mappedin.com/web-sdk/v5/using-angular/) guides.