| 229 | } |
| 230 | |
| 231 | _createMap() { |
| 232 | return new Promise((resolve) => { |
| 233 | const container = |
| 234 | typeof this.container === 'string' ? window.document.getElementById(this.container) : this.container; |
| 235 | if (!container) { |
| 236 | throw new Error(`Container '${container}' not found.`); |
| 237 | } |
| 238 | this.width = container.clientWidth || 400; |
| 239 | this.height = container.clientHeight || 300; |
| 240 | let map = new mapboxgl.Map({ |
| 241 | container: this.container, |
| 242 | style: { |
| 243 | ...this.styleOptions, |
| 244 | version: 8, |
| 245 | sources: {}, |
| 246 | layers: [] |
| 247 | }, |
| 248 | renderWorldCopies: false, |
| 249 | center: [0, 0], |
| 250 | zoom: 8 |
| 251 | }); |
| 252 | map.on('load', () => { |
| 253 | resolve(map); |
| 254 | }); |
| 255 | }); |
| 256 | } |
| 257 | |
| 258 | _mapExisted() { |
| 259 | return !!this.map; |