@mappedin/mappedin-js 5.0.0-beta.1 → 5.0.0-beta.11

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 CHANGED
@@ -1,6 +1,7 @@
1
1
  # Mappedin Web SDK
2
2
 
3
3
  ## Resources
4
+
4
5
  - [Mappedin Developer Portal](https://developer.mappedin.com)
5
6
  - [Web SDK V4 guides](https://developer.mappedin.com/guides/webv4/quickstart)
6
7
  - [Release notes](https://developer.mappedin.com/blog/2021-11-23-web-sdk-v4-release-notes/)
@@ -18,26 +19,26 @@ or
18
19
 
19
20
  `yarn add @mappedin/mappedin-js`
20
21
 
21
-
22
22
  ```javascript
23
23
  import { getVenue, showVenue, E_SDK_EVENT } from '@mappedin/mappedin-js';
24
24
  import '@mappedin/mappedin-js/lib/index.css';
25
25
 
26
26
  async function init() {
27
-
28
- const venueData = await getVenue(
29
- {
30
- clientId: '<clientId>',
31
- clientSecret: '<clientSecret>',
32
- venue: '<venue>'
33
- });
34
-
35
- const mapView = await showVenue(document.getElementById('mappedin-map'), venueData);
36
- mapView.labelAllLocations();
37
- mapView.addInteractivePolygonsForAllLocations();
38
- mapView.on(E_SDK_EVENT.POLYGON_CLICKED, (polygon) => {
39
- console.log(`Polygon with id ${polygon.id} clicked!`);
40
- });
27
+ const venueData = await getVenue({
28
+ clientId: '<clientId>',
29
+ clientSecret: '<clientSecret>',
30
+ venue: '<venue>'
31
+ });
32
+
33
+ const mapView = await showVenue(
34
+ document.getElementById('mappedin-map'),
35
+ venueData
36
+ );
37
+ mapView.FloatingLabels.labelAllLocations();
38
+ mapView.addInteractivePolygonsForAllLocations();
39
+ mapView.on(E_SDK_EVENT.POLYGON_CLICKED, polygon => {
40
+ console.log(`Polygon with id ${polygon.id} clicked!`);
41
+ });
41
42
  }
42
43
  document.addEventListener('DOMContentLoaded', init);
43
44
  ```
@@ -54,7 +55,10 @@ Usage in the browser requires adding a script and link tags that point at the CD
54
55
  <title>Sample</title>
55
56
  <meta name="viewport" content="width=device-width,initial-scale=1" />
56
57
  <link rel="icon" href="favicon.ico" />
57
- <link rel="stylesheet" href="https://d1p5cqqchvbqmy.cloudfront.net/websdk/v4.0.16/mappedin.css" />
58
+ <link
59
+ rel="stylesheet"
60
+ href="https://d1p5cqqchvbqmy.cloudfront.net/websdk/v4.0.16/mappedin.css"
61
+ />
58
62
  </head>
59
63
  <body>
60
64
  <div data-key="" id="mappedin-map"></div>
@@ -69,17 +73,16 @@ Usage in the browser requires adding a script and link tags that point at the CD
69
73
  <script src="https://d1p5cqqchvbqmy.cloudfront.net/websdk/v4.0.16/mappedin.js"></script>
70
74
  <script>
71
75
  async function init() {
72
- const venue = await Mappedin.getVenue(
73
- {
74
- clientId: '<clientId>',
75
- clientSecret: '<clientSecret>',
76
- venue: '<venue>'
77
- });
76
+ const venue = await Mappedin.getVenue({
77
+ clientId: '<clientId>',
78
+ clientSecret: '<clientSecret>',
79
+ venue: '<venue>'
80
+ });
78
81
  const mapView = await Mappedin.showVenue(
79
82
  document.getElementById('mappedin-map'),
80
83
  venue
81
84
  );
82
- mapView.labelAllLocations();
85
+ mapView.FloatingLabels.labelAllLocations();
83
86
  }
84
87
  document.addEventListener('DOMContentLoaded', init);
85
88
  </script>
@@ -99,7 +102,10 @@ The Mappedin SDK supports ESM (EcmaScriptModules), meaning we can import files d
99
102
  <title>Mappedin Sample</title>
100
103
  <meta name="viewport" content="width=device-width,initial-scale=1" />
101
104
  <link rel="icon" href="favicon.ico" />
102
- <link rel="stylesheet" href="https://d1p5cqqchvbqmy.cloudfront.net/websdk/v4.0.16/esm/renderer/index.css" />
105
+ <link
106
+ rel="stylesheet"
107
+ href="https://d1p5cqqchvbqmy.cloudfront.net/websdk/v4.0.16/esm/renderer/index.css"
108
+ />
103
109
  </head>
104
110
  <body>
105
111
  <div id="mappedin-map"></div>
@@ -109,24 +115,26 @@ The Mappedin SDK supports ESM (EcmaScriptModules), meaning we can import files d
109
115
  #mappedin-map {
110
116
  width: 100%;
111
117
  height: 100%;
112
- position: relative
118
+ position: relative;
113
119
  }
114
120
  </style>
115
121
  <script type="module">
116
- import { getVenue, showVenue } from 'https://d1p5cqqchvbqmy.cloudfront.net/websdk/v4.0.16/esm/renderer/index.js';
117
-
122
+ import {
123
+ getVenue,
124
+ showVenue
125
+ } from 'https://d1p5cqqchvbqmy.cloudfront.net/websdk/v4.0.16/esm/renderer/index.js';
126
+
118
127
  async function init() {
119
- const venue = await getVenue(
120
- {
121
- clientId: '<clientId>',
122
- clientSecret: '<clientSecret>',
123
- venue: '<venue>'
124
- });
128
+ const venue = await getVenue({
129
+ clientId: '<clientId>',
130
+ clientSecret: '<clientSecret>',
131
+ venue: '<venue>'
132
+ });
125
133
  const mapView = await showVenue(
126
134
  document.getElementById('mappedin-map'),
127
135
  venue
128
136
  );
129
- mapView.labelAllLocations();
137
+ mapView.FloatingLabels.labelAllLocations();
130
138
  }
131
139
  document.addEventListener('DOMContentLoaded', init);
132
140
  </script>
@@ -142,13 +150,11 @@ Both `get-venue` and `navigator` packages can be used separately, without loadin
142
150
  import getVenue from '@mappedin/mappedin-js/lib/esm/get-venue';
143
151
 
144
152
  async function init() {
145
-
146
- const venueData = await getVenue(
147
- {
148
- clientId: '<clientId>',
149
- clientSecret: '<clientSecret>',
150
- venue: '<venue>'
151
- });
153
+ const venueData = await getVenue({
154
+ clientId: '<clientId>',
155
+ clientSecret: '<clientSecret>',
156
+ venue: '<venue>'
157
+ });
152
158
  }
153
159
  document.addEventListener('DOMContentLoaded', init);
154
160
  ```