diff --git a/404.html b/404.html index 72db34d..9f2ed9f 100644 --- a/404.html +++ b/404.html @@ -9,7 +9,7 @@ - + diff --git a/assets/images/CameraAnimation-002de6d08f5e7dac7e0e8a364c118f7a.png b/assets/images/CameraAnimation-fa32c0855303f845987917f85572b3ce.png similarity index 99% rename from assets/images/CameraAnimation-002de6d08f5e7dac7e0e8a364c118f7a.png rename to assets/images/CameraAnimation-fa32c0855303f845987917f85572b3ce.png index 90de772..c0be15a 100644 Binary files a/assets/images/CameraAnimation-002de6d08f5e7dac7e0e8a364c118f7a.png and b/assets/images/CameraAnimation-fa32c0855303f845987917f85572b3ce.png differ diff --git a/assets/images/ChangeLayerColor-4979e1f8c88f86f21922cf4a12fe3f1a.png b/assets/images/ChangeLayerColor-d4183619292940d27c42c993ba5cacc8.png similarity index 99% rename from assets/images/ChangeLayerColor-4979e1f8c88f86f21922cf4a12fe3f1a.png rename to assets/images/ChangeLayerColor-d4183619292940d27c42c993ba5cacc8.png index f68a0f6..008eda1 100644 Binary files a/assets/images/ChangeLayerColor-4979e1f8c88f86f21922cf4a12fe3f1a.png and b/assets/images/ChangeLayerColor-d4183619292940d27c42c993ba5cacc8.png differ diff --git a/assets/images/ChoroplethLayerByZoomLevel-a5eb6dbcf7374d08614b3195164246f8.png b/assets/images/ChoroplethLayerByZoomLevel-2a3cee7a776e7afa3f062c971552f0d1.png similarity index 99% rename from assets/images/ChoroplethLayerByZoomLevel-a5eb6dbcf7374d08614b3195164246f8.png rename to assets/images/ChoroplethLayerByZoomLevel-2a3cee7a776e7afa3f062c971552f0d1.png index 0731227..4b8f1b7 100644 Binary files a/assets/images/ChoroplethLayerByZoomLevel-a5eb6dbcf7374d08614b3195164246f8.png and b/assets/images/ChoroplethLayerByZoomLevel-2a3cee7a776e7afa3f062c971552f0d1.png differ diff --git a/assets/images/CreateOfflineRegion-df1f8fb6c07fddfeadd08f682c9cb341.png b/assets/images/CreateOfflineRegion-0296578d01765f81078b15738d56655f.png similarity index 99% rename from assets/images/CreateOfflineRegion-df1f8fb6c07fddfeadd08f682c9cb341.png rename to assets/images/CreateOfflineRegion-0296578d01765f81078b15738d56655f.png index 84e8217..aae567b 100644 Binary files a/assets/images/CreateOfflineRegion-df1f8fb6c07fddfeadd08f682c9cb341.png and b/assets/images/CreateOfflineRegion-0296578d01765f81078b15738d56655f.png differ diff --git a/assets/images/CustomCallout-616138bdf24baf3d9a0e10074695dcc5.png b/assets/images/CustomCallout-59966c8db5822c4b59ecc9ae4b67d8cd.png similarity index 99% rename from assets/images/CustomCallout-616138bdf24baf3d9a0e10074695dcc5.png rename to assets/images/CustomCallout-59966c8db5822c4b59ecc9ae4b67d8cd.png index fa7dbeb..1fe2e66 100644 Binary files a/assets/images/CustomCallout-616138bdf24baf3d9a0e10074695dcc5.png and b/assets/images/CustomCallout-59966c8db5822c4b59ecc9ae4b67d8cd.png differ diff --git a/assets/images/CustomIcon-20cb65194d98099d0d0f612b2f9aa059.png b/assets/images/CustomIcon-2e6554b46077bfbed472d72ceee6870c.png similarity index 99% rename from assets/images/CustomIcon-20cb65194d98099d0d0f612b2f9aa059.png rename to assets/images/CustomIcon-2e6554b46077bfbed472d72ceee6870c.png index 8f36409..fe2db5b 100644 Binary files a/assets/images/CustomIcon-20cb65194d98099d0d0f612b2f9aa059.png and b/assets/images/CustomIcon-2e6554b46077bfbed472d72ceee6870c.png differ diff --git a/assets/images/CustomIconNativeAsset-acc92f6e6aae073c2392efd4f3c7c308.png b/assets/images/CustomIconNativeAsset-f4861138fd9374123b2eff0c28bde10a.png similarity index 99% rename from assets/images/CustomIconNativeAsset-acc92f6e6aae073c2392efd4f3c7c308.png rename to assets/images/CustomIconNativeAsset-f4861138fd9374123b2eff0c28bde10a.png index fd0dd18..610198f 100644 Binary files a/assets/images/CustomIconNativeAsset-acc92f6e6aae073c2392efd4f3c7c308.png and b/assets/images/CustomIconNativeAsset-f4861138fd9374123b2eff0c28bde10a.png differ diff --git a/assets/images/CustomNativeUserLocation-a8c9cfe5b5e9a7ae53f0fca9f073254b.png b/assets/images/CustomNativeUserLocation-38337c947a1d602fae1b6c3aecaa8b4f.png similarity index 99% rename from assets/images/CustomNativeUserLocation-a8c9cfe5b5e9a7ae53f0fca9f073254b.png rename to assets/images/CustomNativeUserLocation-38337c947a1d602fae1b6c3aecaa8b4f.png index 66cd2ba..a200dc4 100644 Binary files a/assets/images/CustomNativeUserLocation-a8c9cfe5b5e9a7ae53f0fca9f073254b.png and b/assets/images/CustomNativeUserLocation-38337c947a1d602fae1b6c3aecaa8b4f.png differ diff --git a/assets/images/CustomVectorSource-07cf82f989d19b1157c9abaf26742f54.png b/assets/images/CustomVectorSource-2052381920dee26df9789ed3196d4e79.png similarity index 99% rename from assets/images/CustomVectorSource-07cf82f989d19b1157c9abaf26742f54.png rename to assets/images/CustomVectorSource-2052381920dee26df9789ed3196d4e79.png index 4ff6ea5..dbf36ac 100644 Binary files a/assets/images/CustomVectorSource-07cf82f989d19b1157c9abaf26742f54.png and b/assets/images/CustomVectorSource-2052381920dee26df9789ed3196d4e79.png differ diff --git a/assets/images/DataDrivenCircleColors-766b8281d0bf7c800d7bdc1abde09647.png b/assets/images/DataDrivenCircleColors-573ac20b562f3a2cb22c51455cd4cfb3.png similarity index 99% rename from assets/images/DataDrivenCircleColors-766b8281d0bf7c800d7bdc1abde09647.png rename to assets/images/DataDrivenCircleColors-573ac20b562f3a2cb22c51455cd4cfb3.png index f591074..3ce60c1 100644 Binary files a/assets/images/DataDrivenCircleColors-766b8281d0bf7c800d7bdc1abde09647.png and b/assets/images/DataDrivenCircleColors-573ac20b562f3a2cb22c51455cd4cfb3.png differ diff --git a/assets/images/DynamicUrl-295dd4320f666e87bce5f03d3e65b03b.png b/assets/images/DynamicUrl-b3bffdbe4efaddc8964a1fb1c9654fb8.png similarity index 99% rename from assets/images/DynamicUrl-295dd4320f666e87bce5f03d3e65b03b.png rename to assets/images/DynamicUrl-b3bffdbe4efaddc8964a1fb1c9654fb8.png index cd79e1c..8eecf2a 100644 Binary files a/assets/images/DynamicUrl-295dd4320f666e87bce5f03d3e65b03b.png and b/assets/images/DynamicUrl-b3bffdbe4efaddc8964a1fb1c9654fb8.png differ diff --git a/assets/images/Earthquakes-0468a08367b71efa02a3ab4bf45b4c34.png b/assets/images/Earthquakes-68b7643b390a23afb5dc106aeeda5612.png similarity index 99% rename from assets/images/Earthquakes-0468a08367b71efa02a3ab4bf45b4c34.png rename to assets/images/Earthquakes-68b7643b390a23afb5dc106aeeda5612.png index 8f4ac8b..4c62923 100644 Binary files a/assets/images/Earthquakes-0468a08367b71efa02a3ab4bf45b4c34.png and b/assets/images/Earthquakes-68b7643b390a23afb5dc106aeeda5612.png differ diff --git a/assets/images/GeoJSONSource-7a896e1266f0f4c1cb37c91dacc5228e.png b/assets/images/GeoJSONSource-2d4fedf3d9059ea2a45e2fe9e1da2614.png similarity index 99% rename from assets/images/GeoJSONSource-7a896e1266f0f4c1cb37c91dacc5228e.png rename to assets/images/GeoJSONSource-2d4fedf3d9059ea2a45e2fe9e1da2614.png index ffbe60f..e1a5b7d 100644 Binary files a/assets/images/GeoJSONSource-7a896e1266f0f4c1cb37c91dacc5228e.png and b/assets/images/GeoJSONSource-2d4fedf3d9059ea2a45e2fe9e1da2614.png differ diff --git a/assets/images/GlobeProjection-002de6d08f5e7dac7e0e8a364c118f7a.png b/assets/images/GlobeProjection-fa32c0855303f845987917f85572b3ce.png similarity index 99% rename from assets/images/GlobeProjection-002de6d08f5e7dac7e0e8a364c118f7a.png rename to assets/images/GlobeProjection-fa32c0855303f845987917f85572b3ce.png index 90de772..c0be15a 100644 Binary files a/assets/images/GlobeProjection-002de6d08f5e7dac7e0e8a364c118f7a.png and b/assets/images/GlobeProjection-fa32c0855303f845987917f85572b3ce.png differ diff --git a/assets/images/Heatmap-0ae7ec74370cb8460082199e593b6ded.png b/assets/images/Heatmap-de4b4ac540b0222090487cc58f585f90.png similarity index 99% rename from assets/images/Heatmap-0ae7ec74370cb8460082199e593b6ded.png rename to assets/images/Heatmap-de4b4ac540b0222090487cc58f585f90.png index c669f6a..8650f98 100644 Binary files a/assets/images/Heatmap-0ae7ec74370cb8460082199e593b6ded.png and b/assets/images/Heatmap-de4b4ac540b0222090487cc58f585f90.png differ diff --git a/assets/images/ImageOverlay-4692a84c61470466f2314c1655dc25f7.png b/assets/images/ImageOverlay-0e71f7eede38a230c24aeee6fd861cbe.png similarity index 99% rename from assets/images/ImageOverlay-4692a84c61470466f2314c1655dc25f7.png rename to assets/images/ImageOverlay-0e71f7eede38a230c24aeee6fd861cbe.png index 96a23f1..74041b6 100644 Binary files a/assets/images/ImageOverlay-4692a84c61470466f2314c1655dc25f7.png and b/assets/images/ImageOverlay-0e71f7eede38a230c24aeee6fd861cbe.png differ diff --git a/assets/images/IndoorBuilding-5cd966cf575c4fb47229663f36028ba5.png b/assets/images/IndoorBuilding-29f2dbf01fb53842d60efe3880e008dd.png similarity index 99% rename from assets/images/IndoorBuilding-5cd966cf575c4fb47229663f36028ba5.png rename to assets/images/IndoorBuilding-29f2dbf01fb53842d60efe3880e008dd.png index e8e71a1..7185efe 100644 Binary files a/assets/images/IndoorBuilding-5cd966cf575c4fb47229663f36028ba5.png and b/assets/images/IndoorBuilding-29f2dbf01fb53842d60efe3880e008dd.png differ diff --git a/assets/images/LocalizeLabels-be31f7ea356fb021defeaf857dc65e06.png b/assets/images/LocalizeLabels-51883db18d2642925671ed19626facec.png similarity index 99% rename from assets/images/LocalizeLabels-be31f7ea356fb021defeaf857dc65e06.png rename to assets/images/LocalizeLabels-51883db18d2642925671ed19626facec.png index 1e200dd..7bb8dc9 100644 Binary files a/assets/images/LocalizeLabels-be31f7ea356fb021defeaf857dc65e06.png and b/assets/images/LocalizeLabels-51883db18d2642925671ed19626facec.png differ diff --git a/assets/images/MapAndRNNavigation-4cc2858ef477d6c58b17a182a3b9342f.png b/assets/images/MapAndRNNavigation-213c1fcd3445fcad3acdd3a77224d31a.png similarity index 99% rename from assets/images/MapAndRNNavigation-4cc2858ef477d6c58b17a182a3b9342f.png rename to assets/images/MapAndRNNavigation-213c1fcd3445fcad3acdd3a77224d31a.png index 741702f..2798ea8 100644 Binary files a/assets/images/MapAndRNNavigation-4cc2858ef477d6c58b17a182a3b9342f.png and b/assets/images/MapAndRNNavigation-213c1fcd3445fcad3acdd3a77224d31a.png differ diff --git a/assets/images/MapHandlers-6e0beabf88ef393478ec96930e56a12a.png b/assets/images/MapHandlers-ab143930c90d76bc1195d7fa0184dddf.png similarity index 99% rename from assets/images/MapHandlers-6e0beabf88ef393478ec96930e56a12a.png rename to assets/images/MapHandlers-ab143930c90d76bc1195d7fa0184dddf.png index 4005446..07e4798 100644 Binary files a/assets/images/MapHandlers-6e0beabf88ef393478ec96930e56a12a.png and b/assets/images/MapHandlers-ab143930c90d76bc1195d7fa0184dddf.png differ diff --git a/assets/images/MarkerView-6c19b0708ffb8daa8ab820afb0d1fa2a.png b/assets/images/MarkerView-86458f0690c4b61f14a7d6ad65b81fc5.png similarity index 99% rename from assets/images/MarkerView-6c19b0708ffb8daa8ab820afb0d1fa2a.png rename to assets/images/MarkerView-86458f0690c4b61f14a7d6ad65b81fc5.png index 17ef720..2f026de 100644 Binary files a/assets/images/MarkerView-6c19b0708ffb8daa8ab820afb0d1fa2a.png and b/assets/images/MarkerView-86458f0690c4b61f14a7d6ad65b81fc5.png differ diff --git a/assets/images/Markers-002de6d08f5e7dac7e0e8a364c118f7a.png b/assets/images/Markers-738fdaa430d9ef59b39b629f070ea125.png similarity index 99% rename from assets/images/Markers-002de6d08f5e7dac7e0e8a364c118f7a.png rename to assets/images/Markers-738fdaa430d9ef59b39b629f070ea125.png index 90de772..6c75790 100644 Binary files a/assets/images/Markers-002de6d08f5e7dac7e0e8a364c118f7a.png and b/assets/images/Markers-738fdaa430d9ef59b39b629f070ea125.png differ diff --git a/assets/images/OfflineExample-d92ecedcf4ff5dedd60c3a026e31d58e.png b/assets/images/OfflineExample-1baad383522223c3833b2752a8c38f2f.png similarity index 99% rename from assets/images/OfflineExample-d92ecedcf4ff5dedd60c3a026e31d58e.png rename to assets/images/OfflineExample-1baad383522223c3833b2752a8c38f2f.png index 9ac2a08..121b869 100644 Binary files a/assets/images/OfflineExample-d92ecedcf4ff5dedd60c3a026e31d58e.png and b/assets/images/OfflineExample-1baad383522223c3833b2752a8c38f2f.png differ diff --git a/assets/images/Ornaments-802493183321a9fe892eebbd427b3143.png b/assets/images/Ornaments-330699c93cc9980dc1baf310e0845b60.png similarity index 99% rename from assets/images/Ornaments-802493183321a9fe892eebbd427b3143.png rename to assets/images/Ornaments-330699c93cc9980dc1baf310e0845b60.png index b9a79b6..c49a89a 100644 Binary files a/assets/images/Ornaments-802493183321a9fe892eebbd427b3143.png and b/assets/images/Ornaments-330699c93cc9980dc1baf310e0845b60.png differ diff --git a/assets/images/PointAnnotationAnchors-fad5a52d68d18ecc89add785049b137c.png b/assets/images/PointAnnotationAnchors-4747138428537f601b075844c329de06.png similarity index 99% rename from assets/images/PointAnnotationAnchors-fad5a52d68d18ecc89add785049b137c.png rename to assets/images/PointAnnotationAnchors-4747138428537f601b075844c329de06.png index 7333137..717f591 100644 Binary files a/assets/images/PointAnnotationAnchors-fad5a52d68d18ecc89add785049b137c.png and b/assets/images/PointAnnotationAnchors-4747138428537f601b075844c329de06.png differ diff --git a/assets/images/PointInMapView-62316a0ff11a5c3f12b3ab11d20ae212.png b/assets/images/PointInMapView-ca477f94ab14c7f8882ee0481f1b898f.png similarity index 99% rename from assets/images/PointInMapView-62316a0ff11a5c3f12b3ab11d20ae212.png rename to assets/images/PointInMapView-ca477f94ab14c7f8882ee0481f1b898f.png index 9a2ab17..99046ef 100644 Binary files a/assets/images/PointInMapView-62316a0ff11a5c3f12b3ab11d20ae212.png and b/assets/images/PointInMapView-ca477f94ab14c7f8882ee0481f1b898f.png differ diff --git a/assets/images/QueryAtPoint-cb98e5daab67f8fa25f5b84591c36d80.png b/assets/images/QueryAtPoint-4615bc5e15d426ffd13c45ab2fa44729.png similarity index 99% rename from assets/images/QueryAtPoint-cb98e5daab67f8fa25f5b84591c36d80.png rename to assets/images/QueryAtPoint-4615bc5e15d426ffd13c45ab2fa44729.png index 6e97c32..76cdaa1 100644 Binary files a/assets/images/QueryAtPoint-cb98e5daab67f8fa25f5b84591c36d80.png and b/assets/images/QueryAtPoint-4615bc5e15d426ffd13c45ab2fa44729.png differ diff --git a/assets/images/QuerySourceFeatures-22505e4a416dbc034c66a5c01167a938.png b/assets/images/QuerySourceFeatures-5cc699bacafbd1f181ddfc2f5db10b34.png similarity index 99% rename from assets/images/QuerySourceFeatures-22505e4a416dbc034c66a5c01167a938.png rename to assets/images/QuerySourceFeatures-5cc699bacafbd1f181ddfc2f5db10b34.png index 0aebb21..ef574cb 100644 Binary files a/assets/images/QuerySourceFeatures-22505e4a416dbc034c66a5c01167a938.png and b/assets/images/QuerySourceFeatures-5cc699bacafbd1f181ddfc2f5db10b34.png differ diff --git a/assets/images/QueryTerrainElevation-4798ee9e485fcda38d55d6431dcd0857.png b/assets/images/QueryTerrainElevation-8c499014399769c70eeb1b48436a70fa.png similarity index 99% rename from assets/images/QueryTerrainElevation-4798ee9e485fcda38d55d6431dcd0857.png rename to assets/images/QueryTerrainElevation-8c499014399769c70eeb1b48436a70fa.png index 677cb8f..cce92a0 100644 Binary files a/assets/images/QueryTerrainElevation-4798ee9e485fcda38d55d6431dcd0857.png and b/assets/images/QueryTerrainElevation-8c499014399769c70eeb1b48436a70fa.png differ diff --git a/assets/images/QueryWithRect-703c72919e231d78016e01aedb3b9335.png b/assets/images/QueryWithRect-4adcb6c95e95e7f2f4432a77b3c30bc0.png similarity index 99% rename from assets/images/QueryWithRect-703c72919e231d78016e01aedb3b9335.png rename to assets/images/QueryWithRect-4adcb6c95e95e7f2f4432a77b3c30bc0.png index 62ccfc4..887fa38 100644 Binary files a/assets/images/QueryWithRect-703c72919e231d78016e01aedb3b9335.png and b/assets/images/QueryWithRect-4adcb6c95e95e7f2f4432a77b3c30bc0.png differ diff --git a/assets/images/RasterSource-c1e946b2823a08e5620583cac492ae08.png b/assets/images/RasterSource-0cad8081fe3c2f924951d4e99a7f44bc.png similarity index 99% rename from assets/images/RasterSource-c1e946b2823a08e5620583cac492ae08.png rename to assets/images/RasterSource-0cad8081fe3c2f924951d4e99a7f44bc.png index f60f028..3b046d7 100644 Binary files a/assets/images/RasterSource-c1e946b2823a08e5620583cac492ae08.png and b/assets/images/RasterSource-0cad8081fe3c2f924951d4e99a7f44bc.png differ diff --git a/assets/images/ScalableImages-c2ff1d4386d41a523f20a49921cd9568.png b/assets/images/ScalableImages-a2ec1a8f91e52609e42d0c23cc4da9ab.png similarity index 99% rename from assets/images/ScalableImages-c2ff1d4386d41a523f20a49921cd9568.png rename to assets/images/ScalableImages-a2ec1a8f91e52609e42d0c23cc4da9ab.png index ee1c528..31ac325 100644 Binary files a/assets/images/ScalableImages-c2ff1d4386d41a523f20a49921cd9568.png and b/assets/images/ScalableImages-a2ec1a8f91e52609e42d0c23cc4da9ab.png differ diff --git a/assets/images/SetDisplacement-07e6dc9be4de8b7568c278cca1b58137.png b/assets/images/SetDisplacement-4267953a60329020cbdeda23ebcda2f5.png similarity index 99% rename from assets/images/SetDisplacement-07e6dc9be4de8b7568c278cca1b58137.png rename to assets/images/SetDisplacement-4267953a60329020cbdeda23ebcda2f5.png index 01802f1..30ea49a 100644 Binary files a/assets/images/SetDisplacement-07e6dc9be4de8b7568c278cca1b58137.png and b/assets/images/SetDisplacement-4267953a60329020cbdeda23ebcda2f5.png differ diff --git a/assets/images/SetTintColor-1d881b0638f0539747d85481948c7dd1.png b/assets/images/SetTintColor-7dfdefe8e186c7e310ac7763bb0af8f5.png similarity index 99% rename from assets/images/SetTintColor-1d881b0638f0539747d85481948c7dd1.png rename to assets/images/SetTintColor-7dfdefe8e186c7e310ac7763bb0af8f5.png index 474ba2d..8557b94 100644 Binary files a/assets/images/SetTintColor-1d881b0638f0539747d85481948c7dd1.png and b/assets/images/SetTintColor-7dfdefe8e186c7e310ac7763bb0af8f5.png differ diff --git a/assets/images/ShapeSourceIcon-ee6fcc2a8aadc792ec7d172f3c2661c9.png b/assets/images/ShapeSourceIcon-80996c858c16119b0cc36718b0ad87bf.png similarity index 99% rename from assets/images/ShapeSourceIcon-ee6fcc2a8aadc792ec7d172f3c2661c9.png rename to assets/images/ShapeSourceIcon-80996c858c16119b0cc36718b0ad87bf.png index a937e84..147e671 100644 Binary files a/assets/images/ShapeSourceIcon-ee6fcc2a8aadc792ec7d172f3c2661c9.png and b/assets/images/ShapeSourceIcon-80996c858c16119b0cc36718b0ad87bf.png differ diff --git a/assets/images/ShowAndHideLayer-fb317c3dfdae17efb9b7820d71af2be0.png b/assets/images/ShowAndHideLayer-a234de294e2cf1e5f40612db3abb0076.png similarity index 99% rename from assets/images/ShowAndHideLayer-fb317c3dfdae17efb9b7820d71af2be0.png rename to assets/images/ShowAndHideLayer-a234de294e2cf1e5f40612db3abb0076.png index 2957c88..7ceaacd 100644 Binary files a/assets/images/ShowAndHideLayer-fb317c3dfdae17efb9b7820d71af2be0.png and b/assets/images/ShowAndHideLayer-a234de294e2cf1e5f40612db3abb0076.png differ diff --git a/assets/images/ShowClick-0a2b4662ddf339e372d1ac5698bc41a8.png b/assets/images/ShowClick-502607fb8ab6b2a4d75f394473df743f.png similarity index 99% rename from assets/images/ShowClick-0a2b4662ddf339e372d1ac5698bc41a8.png rename to assets/images/ShowClick-502607fb8ab6b2a4d75f394473df743f.png index eb682e3..66c3b04 100644 Binary files a/assets/images/ShowClick-0a2b4662ddf339e372d1ac5698bc41a8.png and b/assets/images/ShowClick-502607fb8ab6b2a4d75f394473df743f.png differ diff --git a/assets/images/ShowMap-695e85ebf43f09b7337e1aece73991b3.png b/assets/images/ShowMap-7557ec1bb6a2757be502ae384f808548.png similarity index 99% rename from assets/images/ShowMap-695e85ebf43f09b7337e1aece73991b3.png rename to assets/images/ShowMap-7557ec1bb6a2757be502ae384f808548.png index 99a1a19..2bbe8bc 100644 Binary files a/assets/images/ShowMap-695e85ebf43f09b7337e1aece73991b3.png and b/assets/images/ShowMap-7557ec1bb6a2757be502ae384f808548.png differ diff --git a/assets/images/ShowMapLocalStyle-fb3537ed35cdf58dad7cf46e4827e06f.png b/assets/images/ShowMapLocalStyle-60c0f4007a90780b3e6865c6424beb4f.png similarity index 99% rename from assets/images/ShowMapLocalStyle-fb3537ed35cdf58dad7cf46e4827e06f.png rename to assets/images/ShowMapLocalStyle-60c0f4007a90780b3e6865c6424beb4f.png index 339d42e..c14bc92 100644 Binary files a/assets/images/ShowMapLocalStyle-fb3537ed35cdf58dad7cf46e4827e06f.png and b/assets/images/ShowMapLocalStyle-60c0f4007a90780b3e6865c6424beb4f.png differ diff --git a/assets/images/ShowPointAnnotation-a82e9d3d7de5a5100051152ad08554ec.png b/assets/images/ShowPointAnnotation-b78b59740cd58d77d46f0411554775c6.png similarity index 99% rename from assets/images/ShowPointAnnotation-a82e9d3d7de5a5100051152ad08554ec.png rename to assets/images/ShowPointAnnotation-b78b59740cd58d77d46f0411554775c6.png index 949c37a..213a49c 100644 Binary files a/assets/images/ShowPointAnnotation-a82e9d3d7de5a5100051152ad08554ec.png and b/assets/images/ShowPointAnnotation-b78b59740cd58d77d46f0411554775c6.png differ diff --git a/assets/images/ShowRegionDidChange-430c5d840344f5db9e9a40265601a593.png b/assets/images/ShowRegionDidChange-38d36d073b2d247d2158d300949f52b2.png similarity index 99% rename from assets/images/ShowRegionDidChange-430c5d840344f5db9e9a40265601a593.png rename to assets/images/ShowRegionDidChange-38d36d073b2d247d2158d300949f52b2.png index 5be430d..5c8eef3 100644 Binary files a/assets/images/ShowRegionDidChange-430c5d840344f5db9e9a40265601a593.png and b/assets/images/ShowRegionDidChange-38d36d073b2d247d2158d300949f52b2.png differ diff --git a/assets/images/SourceLayerVisibility-fa87821fa6b4b30e78de89a8528a9c2c.png b/assets/images/SourceLayerVisibility-80f26d462bf8c7440b16e210d8b1cc6c.png similarity index 99% rename from assets/images/SourceLayerVisibility-fa87821fa6b4b30e78de89a8528a9c2c.png rename to assets/images/SourceLayerVisibility-80f26d462bf8c7440b16e210d8b1cc6c.png index 03e609a..202d1d2 100644 Binary files a/assets/images/SourceLayerVisibility-fa87821fa6b4b30e78de89a8528a9c2c.png and b/assets/images/SourceLayerVisibility-80f26d462bf8c7440b16e210d8b1cc6c.png differ diff --git a/assets/images/StyleJson-8cb566db77c14d97bd5620744ef05446.png b/assets/images/StyleJson-e869428e4395a0b15f386294d5cb318d.png similarity index 99% rename from assets/images/StyleJson-8cb566db77c14d97bd5620744ef05446.png rename to assets/images/StyleJson-e869428e4395a0b15f386294d5cb318d.png index a2dd45a..0734ba5 100644 Binary files a/assets/images/StyleJson-8cb566db77c14d97bd5620744ef05446.png and b/assets/images/StyleJson-e869428e4395a0b15f386294d5cb318d.png differ diff --git a/assets/images/TerrainSkyAtmosphere-80af5aff81939d5ff2737c48e4e98c71.png b/assets/images/TerrainSkyAtmosphere-53b2c21d03ff156b5f95e2aa3697dfdc.png similarity index 99% rename from assets/images/TerrainSkyAtmosphere-80af5aff81939d5ff2737c48e4e98c71.png rename to assets/images/TerrainSkyAtmosphere-53b2c21d03ff156b5f95e2aa3697dfdc.png index 696dedf..2698483 100644 Binary files a/assets/images/TerrainSkyAtmosphere-80af5aff81939d5ff2737c48e4e98c71.png and b/assets/images/TerrainSkyAtmosphere-53b2c21d03ff156b5f95e2aa3697dfdc.png differ diff --git a/assets/images/TwoByTwo-b6b726485f3131774272c6729c35d6c6.png b/assets/images/TwoByTwo-e71452f3e43eaf26ba06f51d84301581.png similarity index 99% rename from assets/images/TwoByTwo-b6b726485f3131774272c6729c35d6c6.png rename to assets/images/TwoByTwo-e71452f3e43eaf26ba06f51d84301581.png index 1ee092d..9d093a6 100644 Binary files a/assets/images/TwoByTwo-b6b726485f3131774272c6729c35d6c6.png and b/assets/images/TwoByTwo-e71452f3e43eaf26ba06f51d84301581.png differ diff --git a/assets/images/UserLocationPadding-b31d17ccc0d0f517a3c029e8dee3d29b.png b/assets/images/UserLocationPadding-d43e231f58fb8e78baac3fc9807b7c44.png similarity index 99% rename from assets/images/UserLocationPadding-b31d17ccc0d0f517a3c029e8dee3d29b.png rename to assets/images/UserLocationPadding-d43e231f58fb8e78baac3fc9807b7c44.png index 69ca46c..ede4679 100644 Binary files a/assets/images/UserLocationPadding-b31d17ccc0d0f517a3c029e8dee3d29b.png and b/assets/images/UserLocationPadding-d43e231f58fb8e78baac3fc9807b7c44.png differ diff --git a/assets/images/UserLocationRenderMode-513c26d133e00bc2db793d319cc4200e.png b/assets/images/UserLocationRenderMode-9ea69cb0a373df12fa345f6cf55307c9.png similarity index 99% rename from assets/images/UserLocationRenderMode-513c26d133e00bc2db793d319cc4200e.png rename to assets/images/UserLocationRenderMode-9ea69cb0a373df12fa345f6cf55307c9.png index 225cc13..307f03f 100644 Binary files a/assets/images/UserLocationRenderMode-513c26d133e00bc2db793d319cc4200e.png and b/assets/images/UserLocationRenderMode-9ea69cb0a373df12fa345f6cf55307c9.png differ diff --git a/assets/images/UserLocationUpdates-0fb067949a4ba8d3e82233ae80390913.png b/assets/images/UserLocationUpdates-edbb01afa3e44c3175e7f000c6f50474.png similarity index 99% rename from assets/images/UserLocationUpdates-0fb067949a4ba8d3e82233ae80390913.png rename to assets/images/UserLocationUpdates-edbb01afa3e44c3175e7f000c6f50474.png index c0cb2c8..ca3f8fe 100644 Binary files a/assets/images/UserLocationUpdates-0fb067949a4ba8d3e82233ae80390913.png and b/assets/images/UserLocationUpdates-edbb01afa3e44c3175e7f000c6f50474.png differ diff --git a/assets/images/WatercolorRasterTiles-42e5b634069c5833e53aa3e0c1a41be1.png b/assets/images/WatercolorRasterTiles-8420a3ed0bd107c10ce21e73f0250688.png similarity index 99% rename from assets/images/WatercolorRasterTiles-42e5b634069c5833e53aa3e0c1a41be1.png rename to assets/images/WatercolorRasterTiles-8420a3ed0bd107c10ce21e73f0250688.png index 8c9d3bd..8d2120f 100644 Binary files a/assets/images/WatercolorRasterTiles-42e5b634069c5833e53aa3e0c1a41be1.png and b/assets/images/WatercolorRasterTiles-8420a3ed0bd107c10ce21e73f0250688.png differ diff --git a/assets/js/00f847ac.8aa2b815.js b/assets/js/00f847ac.85f5d7c1.js similarity index 98% rename from assets/js/00f847ac.8aa2b815.js rename to assets/js/00f847ac.85f5d7c1.js index a11a738..13dd085 100644 --- a/assets/js/00f847ac.8aa2b815.js +++ b/assets/js/00f847ac.85f5d7c1.js @@ -1 +1 @@ -"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[5364],{8498:(e,o,t)=>{t.r(o),t.d(o,{assets:()=>p,contentTitle:()=>l,default:()=>c,frontMatter:()=>a,metadata:()=>s,toc:()=>i});var n=t(5893),r=t(1151);const a={title:"Choropleth Layer By Zoom Level",tags:["VectorSource"],custom_props:{example_rel_path:"FillRasterLayer/ChoroplethLayerByZoomLevel.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/ChoroplethLayerByZoomLevel.js"},l=void 0,s={id:"examples/FillRasterLayer/ChoroplethLayerByZoomLevel",title:"Choropleth Layer By Zoom Level",description:"ChoroplethLayerByZoomLevel.png}",source:"@site/docs/examples/FillRasterLayer/ChoroplethLayerByZoomLevel.md",sourceDirName:"examples/FillRasterLayer",slug:"/examples/FillRasterLayer/ChoroplethLayerByZoomLevel",permalink:"/docs/examples/FillRasterLayer/ChoroplethLayerByZoomLevel",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/ChoroplethLayerByZoomLevel.js",tags:[{inline:!0,label:"VectorSource",permalink:"/docs/tags/vector-source"}],version:"current",frontMatter:{title:"Choropleth Layer By Zoom Level",tags:["VectorSource"],custom_props:{example_rel_path:"FillRasterLayer/ChoroplethLayerByZoomLevel.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/ChoroplethLayerByZoomLevel.js"},sidebar:"examplesSidebar",previous:{title:"GetZoom",permalink:"/docs/examples/Camera/GetZoom"},next:{title:"Custom Vector Source",permalink:"/docs/examples/FillRasterLayer/CustomVectorSource"}},p={},i=[];function m(e){const o={code:"code",img:"img",p:"p",pre:"pre",...(0,r.a)(),...e.components};return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(o.pre,{children:(0,n.jsx)(o.code,{className:"language-jsx",children:"import React from 'react';\nimport Mapbox from '@rnmapbox/maps';\n\nimport sheet from '../../styles/sheet';\n\nconst styles = {\n statePopulation: {\n fillColor: [\n 'interpolate',\n ['linear'],\n ['get', 'population'],\n 0,\n '#F2F12D',\n 500000,\n '#EED322',\n 750000,\n '#E6B71E',\n 1000000,\n '#DA9C20',\n 2500000,\n '#CA8323',\n 5000000,\n '#B86B25',\n 7500000,\n '#A25626',\n 10000000,\n '#8B4225',\n 25000000,\n '#723122',\n ],\n\n fillOpacity: 0.75,\n },\n\n countyPopulation: {\n fillColor: [\n 'interpolate',\n ['linear'],\n ['get', 'population'],\n 0,\n '#F2F12D',\n 100,\n '#EED322',\n 1000,\n '#E6B71E',\n 5000,\n '#DA9C20',\n 10000,\n '#CA8323',\n 50000,\n '#B86B25',\n 100000,\n '#A25626',\n 500000,\n '#8B4225',\n 1000000,\n '#723122',\n ],\n\n fillOpacity: 0.75,\n },\n};\n\nclass ChoroplethLayerByZoomLevel extends React.PureComponent {\n render() {\n return (\n \n \n\n \n \n\n \n \n \n );\n }\n}\n\nexport default ChoroplethLayerByZoomLevel;\n\n\n"})}),"\n",(0,n.jsxs)(o.p,{children:[(0,n.jsx)(o.img,{alt:"ChoroplethLayerByZoomLevel.png",src:t(6272).Z+"",width:"295",height:"640"}),"}"]})]})}function c(e={}){const{wrapper:o}={...(0,r.a)(),...e.components};return o?(0,n.jsx)(o,{...e,children:(0,n.jsx)(m,{...e})}):m(e)}},6272:(e,o,t)=>{t.d(o,{Z:()=>n});const n=t.p+"assets/images/ChoroplethLayerByZoomLevel-a5eb6dbcf7374d08614b3195164246f8.png"},1151:(e,o,t)=>{t.d(o,{a:()=>l});var n=t(7294);const r={},a=n.createContext(r);function l(e){const o=n.useContext(a);return n.useMemo((function(){return"function"==typeof e?e(o):{...o,...e}}),[o,e])}}}]); \ No newline at end of file +"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[5364],{8498:(e,o,t)=>{t.r(o),t.d(o,{assets:()=>p,contentTitle:()=>l,default:()=>c,frontMatter:()=>a,metadata:()=>s,toc:()=>i});var n=t(5893),r=t(1151);const a={title:"Choropleth Layer By Zoom Level",tags:["VectorSource"],custom_props:{example_rel_path:"FillRasterLayer/ChoroplethLayerByZoomLevel.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/ChoroplethLayerByZoomLevel.js"},l=void 0,s={id:"examples/FillRasterLayer/ChoroplethLayerByZoomLevel",title:"Choropleth Layer By Zoom Level",description:"ChoroplethLayerByZoomLevel.png}",source:"@site/docs/examples/FillRasterLayer/ChoroplethLayerByZoomLevel.md",sourceDirName:"examples/FillRasterLayer",slug:"/examples/FillRasterLayer/ChoroplethLayerByZoomLevel",permalink:"/docs/examples/FillRasterLayer/ChoroplethLayerByZoomLevel",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/ChoroplethLayerByZoomLevel.js",tags:[{inline:!0,label:"VectorSource",permalink:"/docs/tags/vector-source"}],version:"current",frontMatter:{title:"Choropleth Layer By Zoom Level",tags:["VectorSource"],custom_props:{example_rel_path:"FillRasterLayer/ChoroplethLayerByZoomLevel.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/ChoroplethLayerByZoomLevel.js"},sidebar:"examplesSidebar",previous:{title:"GetZoom",permalink:"/docs/examples/Camera/GetZoom"},next:{title:"Custom Vector Source",permalink:"/docs/examples/FillRasterLayer/CustomVectorSource"}},p={},i=[];function m(e){const o={code:"code",img:"img",p:"p",pre:"pre",...(0,r.a)(),...e.components};return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(o.pre,{children:(0,n.jsx)(o.code,{className:"language-jsx",children:"import React from 'react';\nimport Mapbox from '@rnmapbox/maps';\n\nimport sheet from '../../styles/sheet';\n\nconst styles = {\n statePopulation: {\n fillColor: [\n 'interpolate',\n ['linear'],\n ['get', 'population'],\n 0,\n '#F2F12D',\n 500000,\n '#EED322',\n 750000,\n '#E6B71E',\n 1000000,\n '#DA9C20',\n 2500000,\n '#CA8323',\n 5000000,\n '#B86B25',\n 7500000,\n '#A25626',\n 10000000,\n '#8B4225',\n 25000000,\n '#723122',\n ],\n\n fillOpacity: 0.75,\n },\n\n countyPopulation: {\n fillColor: [\n 'interpolate',\n ['linear'],\n ['get', 'population'],\n 0,\n '#F2F12D',\n 100,\n '#EED322',\n 1000,\n '#E6B71E',\n 5000,\n '#DA9C20',\n 10000,\n '#CA8323',\n 50000,\n '#B86B25',\n 100000,\n '#A25626',\n 500000,\n '#8B4225',\n 1000000,\n '#723122',\n ],\n\n fillOpacity: 0.75,\n },\n};\n\nclass ChoroplethLayerByZoomLevel extends React.PureComponent {\n render() {\n return (\n \n \n\n \n \n\n \n \n \n );\n }\n}\n\nexport default ChoroplethLayerByZoomLevel;\n\n\n"})}),"\n",(0,n.jsxs)(o.p,{children:[(0,n.jsx)(o.img,{alt:"ChoroplethLayerByZoomLevel.png",src:t(6272).Z+"",width:"295",height:"640"}),"}"]})]})}function c(e={}){const{wrapper:o}={...(0,r.a)(),...e.components};return o?(0,n.jsx)(o,{...e,children:(0,n.jsx)(m,{...e})}):m(e)}},6272:(e,o,t)=>{t.d(o,{Z:()=>n});const n=t.p+"assets/images/ChoroplethLayerByZoomLevel-2a3cee7a776e7afa3f062c971552f0d1.png"},1151:(e,o,t)=>{t.d(o,{a:()=>l});var n=t(7294);const r={},a=n.createContext(r);function l(e){const o=n.useContext(a);return n.useMemo((function(){return"function"==typeof e?e(o):{...o,...e}}),[o,e])}}}]); \ No newline at end of file diff --git a/assets/js/04ea8698.1282c3dd.js b/assets/js/04ea8698.fc6a1610.js similarity index 91% rename from assets/js/04ea8698.1282c3dd.js rename to assets/js/04ea8698.fc6a1610.js index 66d4a32..d9245e2 100644 --- a/assets/js/04ea8698.1282c3dd.js +++ b/assets/js/04ea8698.fc6a1610.js @@ -1 +1 @@ -"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[1605],{290:(e,r,a)=>{a.r(r),a.d(r,{assets:()=>c,contentTitle:()=>n,default:()=>m,frontMatter:()=>s,metadata:()=>l,toc:()=>p});var t=a(5893),o=a(1151);const s={title:"GeoJSON Source",tags:[],custom_props:{example_rel_path:"FillRasterLayer/GeoJSONSource.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/GeoJSONSource.js"},n=void 0,l={id:"examples/FillRasterLayer/GeoJSONSource",title:"GeoJSON Source",description:"GeoJSONSource.png}",source:"@site/docs/examples/FillRasterLayer/GeoJSONSource.md",sourceDirName:"examples/FillRasterLayer",slug:"/examples/FillRasterLayer/GeoJSONSource",permalink:"/docs/examples/FillRasterLayer/GeoJSONSource",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/GeoJSONSource.js",tags:[],version:"current",frontMatter:{title:"GeoJSON Source",tags:[],custom_props:{example_rel_path:"FillRasterLayer/GeoJSONSource.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/GeoJSONSource.js"},sidebar:"examplesSidebar",previous:{title:"Custom Vector Source",permalink:"/docs/examples/FillRasterLayer/CustomVectorSource"},next:{title:"Image Overlay",permalink:"/docs/examples/FillRasterLayer/ImageOverlay"}},c={},p=[];function i(e){const r={code:"code",img:"img",p:"p",pre:"pre",...(0,o.a)(),...e.components};return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(r.pre,{children:(0,t.jsx)(r.code,{className:"language-jsx",children:"import React from 'react';\nimport MapboxGL from '@rnmapbox/maps';\n\nimport sheet from '../../styles/sheet';\nimport gridPattern from '../../assets/grid_pattern.png';\nimport smileyFaceGeoJSON from '../../assets/smiley_face.json';\nimport BaseExamplePropTypes from '../common/BaseExamplePropTypes';\nimport Page from '../common/Page';\n\nconst layerStyles = {\n background: {\n backgroundPattern: gridPattern,\n },\n smileyFace: {\n fillAntialias: true,\n fillColor: 'white',\n fillOutlineColor: 'rgba(255, 255, 255, 0.84)',\n },\n};\n\nclass GeoJSONSource extends React.Component {\n static propTypes = {\n ...BaseExamplePropTypes,\n };\n\n render() {\n return (\n \n (this.map = ref)}\n style={sheet.matchParent}\n styleURL={MapboxGL.StyleURL.Dark}\n >\n \n\n \n \n \n\n \n \n \n \n \n );\n }\n}\n\nexport default GeoJSONSource;\n\n\n"})}),"\n",(0,t.jsxs)(r.p,{children:[(0,t.jsx)(r.img,{alt:"GeoJSONSource.png",src:a(5869).Z+"",width:"295",height:"640"}),"}"]})]})}function m(e={}){const{wrapper:r}={...(0,o.a)(),...e.components};return r?(0,t.jsx)(r,{...e,children:(0,t.jsx)(i,{...e})}):i(e)}},5869:(e,r,a)=>{a.d(r,{Z:()=>t});const t=a.p+"assets/images/GeoJSONSource-7a896e1266f0f4c1cb37c91dacc5228e.png"},1151:(e,r,a)=>{a.d(r,{a:()=>n});var t=a(7294);const o={},s=t.createContext(o);function n(e){const r=t.useContext(s);return t.useMemo((function(){return"function"==typeof e?e(r):{...r,...e}}),[r,e])}}}]); \ No newline at end of file +"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[1605],{290:(e,r,a)=>{a.r(r),a.d(r,{assets:()=>p,contentTitle:()=>n,default:()=>m,frontMatter:()=>s,metadata:()=>l,toc:()=>c});var t=a(5893),o=a(1151);const s={title:"GeoJSON Source",tags:[],custom_props:{example_rel_path:"FillRasterLayer/GeoJSONSource.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/GeoJSONSource.js"},n=void 0,l={id:"examples/FillRasterLayer/GeoJSONSource",title:"GeoJSON Source",description:"GeoJSONSource.png}",source:"@site/docs/examples/FillRasterLayer/GeoJSONSource.md",sourceDirName:"examples/FillRasterLayer",slug:"/examples/FillRasterLayer/GeoJSONSource",permalink:"/docs/examples/FillRasterLayer/GeoJSONSource",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/GeoJSONSource.js",tags:[],version:"current",frontMatter:{title:"GeoJSON Source",tags:[],custom_props:{example_rel_path:"FillRasterLayer/GeoJSONSource.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/GeoJSONSource.js"},sidebar:"examplesSidebar",previous:{title:"Custom Vector Source",permalink:"/docs/examples/FillRasterLayer/CustomVectorSource"},next:{title:"Image Overlay",permalink:"/docs/examples/FillRasterLayer/ImageOverlay"}},p={},c=[];function i(e){const r={code:"code",img:"img",p:"p",pre:"pre",...(0,o.a)(),...e.components};return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(r.pre,{children:(0,t.jsx)(r.code,{className:"language-jsx",children:"import React from 'react';\nimport MapboxGL from '@rnmapbox/maps';\n\nimport sheet from '../../styles/sheet';\nimport gridPattern from '../../assets/grid_pattern.png';\nimport smileyFaceGeoJSON from '../../assets/smiley_face.json';\nimport BaseExamplePropTypes from '../common/BaseExamplePropTypes';\nimport Page from '../common/Page';\n\nconst layerStyles = {\n background: {\n backgroundPattern: gridPattern,\n },\n smileyFace: {\n fillAntialias: true,\n fillColor: 'white',\n fillOutlineColor: 'rgba(255, 255, 255, 0.84)',\n },\n};\n\nclass GeoJSONSource extends React.Component {\n static propTypes = {\n ...BaseExamplePropTypes,\n };\n\n render() {\n return (\n \n (this.map = ref)}\n style={sheet.matchParent}\n styleURL={MapboxGL.StyleURL.Dark}\n >\n \n\n \n \n \n\n \n \n \n \n \n );\n }\n}\n\nexport default GeoJSONSource;\n\n\n"})}),"\n",(0,t.jsxs)(r.p,{children:[(0,t.jsx)(r.img,{alt:"GeoJSONSource.png",src:a(5869).Z+"",width:"295",height:"640"}),"}"]})]})}function m(e={}){const{wrapper:r}={...(0,o.a)(),...e.components};return r?(0,t.jsx)(r,{...e,children:(0,t.jsx)(i,{...e})}):i(e)}},5869:(e,r,a)=>{a.d(r,{Z:()=>t});const t=a.p+"assets/images/GeoJSONSource-2d4fedf3d9059ea2a45e2fe9e1da2614.png"},1151:(e,r,a)=>{a.d(r,{a:()=>n});var t=a(7294);const o={},s=t.createContext(o);function n(e){const r=t.useContext(s);return t.useMemo((function(){return"function"==typeof e?e(r):{...r,...e}}),[r,e])}}}]); \ No newline at end of file diff --git a/assets/js/07badaf3.75dda5c3.js b/assets/js/07badaf3.638eded3.js similarity index 98% rename from assets/js/07badaf3.75dda5c3.js rename to assets/js/07badaf3.638eded3.js index 5e95f99..9f4530a 100644 --- a/assets/js/07badaf3.75dda5c3.js +++ b/assets/js/07badaf3.638eded3.js @@ -1 +1 @@ -"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[6832],{672:(e,t,r)=>{r.r(t),r.d(t,{assets:()=>l,contentTitle:()=>a,default:()=>m,frontMatter:()=>n,metadata:()=>c,toc:()=>u});var o=r(5893),s=r(1151);const n={title:"Custom Vector Source",tags:["VectorSource","VectorSource#features"],custom_props:{example_rel_path:"FillRasterLayer/CustomVectorSource.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/CustomVectorSource.js"},a=void 0,c={id:"examples/FillRasterLayer/CustomVectorSource",title:"Custom Vector Source",description:"CustomVectorSource.png}",source:"@site/docs/examples/FillRasterLayer/CustomVectorSource.md",sourceDirName:"examples/FillRasterLayer",slug:"/examples/FillRasterLayer/CustomVectorSource",permalink:"/docs/examples/FillRasterLayer/CustomVectorSource",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/CustomVectorSource.js",tags:[{inline:!0,label:"VectorSource",permalink:"/docs/tags/vector-source"},{inline:!0,label:"VectorSource#features",permalink:"/docs/tags/vector-source-features"}],version:"current",frontMatter:{title:"Custom Vector Source",tags:["VectorSource","VectorSource#features"],custom_props:{example_rel_path:"FillRasterLayer/CustomVectorSource.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/CustomVectorSource.js"},sidebar:"examplesSidebar",previous:{title:"Choropleth Layer By Zoom Level",permalink:"/docs/examples/FillRasterLayer/ChoroplethLayerByZoomLevel"},next:{title:"GeoJSON Source",permalink:"/docs/examples/FillRasterLayer/GeoJSONSource"}},l={},u=[];function i(e){const t={code:"code",img:"img",p:"p",pre:"pre",...(0,s.a)(),...e.components};return(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)(t.pre,{children:(0,o.jsx)(t.code,{className:"language-jsx",children:"import React from 'react';\nimport { MapView, Camera, VectorSource, FillLayer } from '@rnmapbox/maps';\n\nconst styles = {\n boxFill: {\n fillColor: [\n 'interpolate',\n ['linear'],\n ['get', 'box'],\n 0,\n 'green',\n 1,\n 'blue',\n ],\n\n fillAntialias: true,\n },\n matchParent: {\n flex: 1,\n },\n};\n\nconst VECTOR_SOURCE_URL =\n 'mapbox://nickitaliano.cj94go8xl18fl2qp92v8bdivv-4kgl9';\n\nclass CustomVectorSource extends React.PureComponent {\n state = {\n featuresCount: null,\n };\n\n queryFeatures = async () => {\n const features = await this._vectorSource.features([\n 'react-native-example',\n ]);\n this.setState({ featuresCount: features.features.length });\n };\n\n render() {\n return (\n \n \n\n {\n this._vectorSource = source;\n }}\n onPress={(e) => {\n console.log(`VectorSource onPress: ${e.features}`, e.features);\n }}\n >\n \n \n \n );\n }\n}\n\nexport default CustomVectorSource;\n\n\n"})}),"\n",(0,o.jsxs)(t.p,{children:[(0,o.jsx)(t.img,{alt:"CustomVectorSource.png",src:r(2577).Z+"",width:"295",height:"640"}),"}"]})]})}function m(e={}){const{wrapper:t}={...(0,s.a)(),...e.components};return t?(0,o.jsx)(t,{...e,children:(0,o.jsx)(i,{...e})}):i(e)}},2577:(e,t,r)=>{r.d(t,{Z:()=>o});const o=r.p+"assets/images/CustomVectorSource-07cf82f989d19b1157c9abaf26742f54.png"},1151:(e,t,r)=>{r.d(t,{a:()=>a});var o=r(7294);const s={},n=o.createContext(s);function a(e){const t=o.useContext(n);return o.useMemo((function(){return"function"==typeof e?e(t):{...t,...e}}),[t,e])}}}]); \ No newline at end of file +"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[6832],{672:(e,t,r)=>{r.r(t),r.d(t,{assets:()=>l,contentTitle:()=>a,default:()=>m,frontMatter:()=>n,metadata:()=>c,toc:()=>u});var o=r(5893),s=r(1151);const n={title:"Custom Vector Source",tags:["VectorSource","VectorSource#features"],custom_props:{example_rel_path:"FillRasterLayer/CustomVectorSource.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/CustomVectorSource.js"},a=void 0,c={id:"examples/FillRasterLayer/CustomVectorSource",title:"Custom Vector Source",description:"CustomVectorSource.png}",source:"@site/docs/examples/FillRasterLayer/CustomVectorSource.md",sourceDirName:"examples/FillRasterLayer",slug:"/examples/FillRasterLayer/CustomVectorSource",permalink:"/docs/examples/FillRasterLayer/CustomVectorSource",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/CustomVectorSource.js",tags:[{inline:!0,label:"VectorSource",permalink:"/docs/tags/vector-source"},{inline:!0,label:"VectorSource#features",permalink:"/docs/tags/vector-source-features"}],version:"current",frontMatter:{title:"Custom Vector Source",tags:["VectorSource","VectorSource#features"],custom_props:{example_rel_path:"FillRasterLayer/CustomVectorSource.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/CustomVectorSource.js"},sidebar:"examplesSidebar",previous:{title:"Choropleth Layer By Zoom Level",permalink:"/docs/examples/FillRasterLayer/ChoroplethLayerByZoomLevel"},next:{title:"GeoJSON Source",permalink:"/docs/examples/FillRasterLayer/GeoJSONSource"}},l={},u=[];function i(e){const t={code:"code",img:"img",p:"p",pre:"pre",...(0,s.a)(),...e.components};return(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)(t.pre,{children:(0,o.jsx)(t.code,{className:"language-jsx",children:"import React from 'react';\nimport { MapView, Camera, VectorSource, FillLayer } from '@rnmapbox/maps';\n\nconst styles = {\n boxFill: {\n fillColor: [\n 'interpolate',\n ['linear'],\n ['get', 'box'],\n 0,\n 'green',\n 1,\n 'blue',\n ],\n\n fillAntialias: true,\n },\n matchParent: {\n flex: 1,\n },\n};\n\nconst VECTOR_SOURCE_URL =\n 'mapbox://nickitaliano.cj94go8xl18fl2qp92v8bdivv-4kgl9';\n\nclass CustomVectorSource extends React.PureComponent {\n state = {\n featuresCount: null,\n };\n\n queryFeatures = async () => {\n const features = await this._vectorSource.features([\n 'react-native-example',\n ]);\n this.setState({ featuresCount: features.features.length });\n };\n\n render() {\n return (\n \n \n\n {\n this._vectorSource = source;\n }}\n onPress={(e) => {\n console.log(`VectorSource onPress: ${e.features}`, e.features);\n }}\n >\n \n \n \n );\n }\n}\n\nexport default CustomVectorSource;\n\n\n"})}),"\n",(0,o.jsxs)(t.p,{children:[(0,o.jsx)(t.img,{alt:"CustomVectorSource.png",src:r(2577).Z+"",width:"295",height:"640"}),"}"]})]})}function m(e={}){const{wrapper:t}={...(0,s.a)(),...e.components};return t?(0,o.jsx)(t,{...e,children:(0,o.jsx)(i,{...e})}):i(e)}},2577:(e,t,r)=>{r.d(t,{Z:()=>o});const o=r.p+"assets/images/CustomVectorSource-2052381920dee26df9789ed3196d4e79.png"},1151:(e,t,r)=>{r.d(t,{a:()=>a});var o=r(7294);const s={},n=o.createContext(s);function a(e){const t=o.useContext(n);return o.useMemo((function(){return"function"==typeof e?e(t):{...t,...e}}),[t,e])}}}]); \ No newline at end of file diff --git a/assets/js/13369b41.6f932619.js b/assets/js/13369b41.bc712b17.js similarity index 96% rename from assets/js/13369b41.6f932619.js rename to assets/js/13369b41.bc712b17.js index 5453c31..cd6c4fc 100644 --- a/assets/js/13369b41.6f932619.js +++ b/assets/js/13369b41.bc712b17.js @@ -1 +1 @@ -"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[6826],{6607:(e,t,n)=>{n.r(t),n.d(t,{assets:()=>c,contentTitle:()=>i,default:()=>l,frontMatter:()=>o,metadata:()=>r,toc:()=>m});var s=n(5893),a=n(1151);const o={title:"Set Displacement",tags:["UserLocation","UserLocation#minDisplacement"],custom_props:{example_rel_path:"UserLocation/SetDisplacement.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/UserLocation/SetDisplacement.js"},i=void 0,r={id:"examples/UserLocation/SetDisplacement",title:"Set Displacement",description:"Change the minimum displacement required to update the user location.",source:"@site/docs/examples/UserLocation/SetDisplacement.md",sourceDirName:"examples/UserLocation",slug:"/examples/UserLocation/SetDisplacement",permalink:"/docs/examples/UserLocation/SetDisplacement",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/UserLocation/SetDisplacement.js",tags:[{inline:!0,label:"UserLocation",permalink:"/docs/tags/user-location"},{inline:!0,label:"UserLocation#minDisplacement",permalink:"/docs/tags/user-location-min-displacement"}],version:"current",frontMatter:{title:"Set Displacement",tags:["UserLocation","UserLocation#minDisplacement"],custom_props:{example_rel_path:"UserLocation/SetDisplacement.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/UserLocation/SetDisplacement.js"},sidebar:"examplesSidebar",previous:{title:"Custom Native UserLocation",permalink:"/docs/examples/UserLocation/CustomNativeUserLocation"},next:{title:"Set Tint Color",permalink:"/docs/examples/UserLocation/SetTintColor"}},c={},m=[];function p(e){const t={code:"code",img:"img",p:"p",pre:"pre",...(0,a.a)(),...e.components};return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(t.p,{children:"Change the minimum displacement required to update the user location."}),"\n",(0,s.jsx)(t.pre,{children:(0,s.jsx)(t.code,{className:"language-jsx",children:"import React from 'react';\nimport Mapbox, { MapView, UserLocation, Camera } from '@rnmapbox/maps';\nimport { SafeAreaView } from 'react-native';\nimport { ButtonGroup } from '@rneui/base';\n\nconst DISPLACEMENT = [0, 5, 10];\n\nconst styles = { matchParent: { flex: 1 } };\n\nclass SetDisplacement extends React.Component {\n state = { minDisplacement: DISPLACEMENT[0] };\n\n componentDidMount() {\n Mapbox.locationManager.start();\n }\n\n componentWillUnmount() {\n Mapbox.locationManager.stop();\n }\n\n onDisplacementChange = (index) => {\n this.setState({ minDisplacement: DISPLACEMENT[index] });\n };\n\n render() {\n return (\n \n \n \n\n \n \n `${i} meters`)}\n selectedIndex={DISPLACEMENT.indexOf(this.state.minDisplacement)}\n onPress={this.onDisplacementChange}\n />\n \n );\n }\n}\n\nexport default SetDisplacement;\n\n\n"})}),"\n",(0,s.jsxs)(t.p,{children:[(0,s.jsx)(t.img,{alt:"SetDisplacement.png",src:n(2252).Z+"",width:"295",height:"640"}),"}"]})]})}function l(e={}){const{wrapper:t}={...(0,a.a)(),...e.components};return t?(0,s.jsx)(t,{...e,children:(0,s.jsx)(p,{...e})}):p(e)}},2252:(e,t,n)=>{n.d(t,{Z:()=>s});const s=n.p+"assets/images/SetDisplacement-07e6dc9be4de8b7568c278cca1b58137.png"},1151:(e,t,n)=>{n.d(t,{a:()=>i});var s=n(7294);const a={},o=s.createContext(a);function i(e){const t=s.useContext(o);return s.useMemo((function(){return"function"==typeof e?e(t):{...t,...e}}),[t,e])}}}]); \ No newline at end of file +"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[6826],{6607:(e,t,n)=>{n.r(t),n.d(t,{assets:()=>c,contentTitle:()=>i,default:()=>l,frontMatter:()=>o,metadata:()=>r,toc:()=>m});var s=n(5893),a=n(1151);const o={title:"Set Displacement",tags:["UserLocation","UserLocation#minDisplacement"],custom_props:{example_rel_path:"UserLocation/SetDisplacement.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/UserLocation/SetDisplacement.js"},i=void 0,r={id:"examples/UserLocation/SetDisplacement",title:"Set Displacement",description:"Change the minimum displacement required to update the user location.",source:"@site/docs/examples/UserLocation/SetDisplacement.md",sourceDirName:"examples/UserLocation",slug:"/examples/UserLocation/SetDisplacement",permalink:"/docs/examples/UserLocation/SetDisplacement",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/UserLocation/SetDisplacement.js",tags:[{inline:!0,label:"UserLocation",permalink:"/docs/tags/user-location"},{inline:!0,label:"UserLocation#minDisplacement",permalink:"/docs/tags/user-location-min-displacement"}],version:"current",frontMatter:{title:"Set Displacement",tags:["UserLocation","UserLocation#minDisplacement"],custom_props:{example_rel_path:"UserLocation/SetDisplacement.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/UserLocation/SetDisplacement.js"},sidebar:"examplesSidebar",previous:{title:"Custom Native UserLocation",permalink:"/docs/examples/UserLocation/CustomNativeUserLocation"},next:{title:"Set Tint Color",permalink:"/docs/examples/UserLocation/SetTintColor"}},c={},m=[];function p(e){const t={code:"code",img:"img",p:"p",pre:"pre",...(0,a.a)(),...e.components};return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(t.p,{children:"Change the minimum displacement required to update the user location."}),"\n",(0,s.jsx)(t.pre,{children:(0,s.jsx)(t.code,{className:"language-jsx",children:"import React from 'react';\nimport Mapbox, { MapView, UserLocation, Camera } from '@rnmapbox/maps';\nimport { SafeAreaView } from 'react-native';\nimport { ButtonGroup } from '@rneui/base';\n\nconst DISPLACEMENT = [0, 5, 10];\n\nconst styles = { matchParent: { flex: 1 } };\n\nclass SetDisplacement extends React.Component {\n state = { minDisplacement: DISPLACEMENT[0] };\n\n componentDidMount() {\n Mapbox.locationManager.start();\n }\n\n componentWillUnmount() {\n Mapbox.locationManager.stop();\n }\n\n onDisplacementChange = (index) => {\n this.setState({ minDisplacement: DISPLACEMENT[index] });\n };\n\n render() {\n return (\n \n \n \n\n \n \n `${i} meters`)}\n selectedIndex={DISPLACEMENT.indexOf(this.state.minDisplacement)}\n onPress={this.onDisplacementChange}\n />\n \n );\n }\n}\n\nexport default SetDisplacement;\n\n\n"})}),"\n",(0,s.jsxs)(t.p,{children:[(0,s.jsx)(t.img,{alt:"SetDisplacement.png",src:n(2252).Z+"",width:"295",height:"640"}),"}"]})]})}function l(e={}){const{wrapper:t}={...(0,a.a)(),...e.components};return t?(0,s.jsx)(t,{...e,children:(0,s.jsx)(p,{...e})}):p(e)}},2252:(e,t,n)=>{n.d(t,{Z:()=>s});const s=n.p+"assets/images/SetDisplacement-4267953a60329020cbdeda23ebcda2f5.png"},1151:(e,t,n)=>{n.d(t,{a:()=>i});var s=n(7294);const a={},o=s.createContext(a);function i(e){const t=s.useContext(o);return s.useMemo((function(){return"function"==typeof e?e(t):{...t,...e}}),[t,e])}}}]); \ No newline at end of file diff --git a/assets/js/163132fa.7cd45313.js b/assets/js/163132fa.99ae7276.js similarity index 98% rename from assets/js/163132fa.7cd45313.js rename to assets/js/163132fa.99ae7276.js index bb7a8c1..f10f758 100644 --- a/assets/js/163132fa.7cd45313.js +++ b/assets/js/163132fa.99ae7276.js @@ -1 +1 @@ -"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[1003],{6654:(e,n,o)=>{o.r(n),o.d(n,{assets:()=>p,contentTitle:()=>s,default:()=>m,frontMatter:()=>a,metadata:()=>i,toc:()=>c});var t=o(5893),r=o(1151);const a={title:"Globe Projection",tags:["MapView#projection"],custom_props:{example_rel_path:"V10/GlobeProjection.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/V10/GlobeProjection.tsx"},s=void 0,i={id:"examples/V10/GlobeProjection",title:"Globe Projection",description:"Shows map with globe projection",source:"@site/docs/examples/V10/GlobeProjection.md",sourceDirName:"examples/V10",slug:"/examples/V10/GlobeProjection",permalink:"/docs/examples/V10/GlobeProjection",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/V10/GlobeProjection.tsx",tags:[{inline:!0,label:"MapView#projection",permalink:"/docs/tags/map-view-projection"}],version:"current",frontMatter:{title:"Globe Projection",tags:["MapView#projection"],custom_props:{example_rel_path:"V10/GlobeProjection.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/V10/GlobeProjection.tsx"},sidebar:"examplesSidebar",previous:{title:"Camera Animation",permalink:"/docs/examples/V10/CameraAnimation"},next:{title:"Map Handlers",permalink:"/docs/examples/V10/MapHandlers"}},p={},c=[];function l(e){const n={code:"code",img:"img",p:"p",pre:"pre",...(0,r.a)(),...e.components};return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(n.p,{children:"Shows map with globe projection"}),"\n",(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-jsx",children:"import React, { useState } from 'react';\nimport { Button } from 'react-native';\nimport {\n MapView,\n SkyLayer,\n Logger,\n Terrain,\n RasterDemSource,\n Atmosphere,\n Camera,\n} from '@rnmapbox/maps';\n\nimport { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc\n\nLogger.setLogLevel('verbose');\n\nconst GlobeProjection = () => {\n const [projection, setProjection] = useState<'globe' | 'mercator'>('globe');\n\n return (\n <>\n \n setProjection(projection === 'globe' ? 'mercator' : 'globe')\n }\n />\n \n \n \n \n \n \n \n \n \n );\n};\n\nexport default GlobeProjection;\n\n\n"})}),"\n",(0,t.jsxs)(n.p,{children:[(0,t.jsx)(n.img,{alt:"GlobeProjection.png",src:o(5847).Z+"",width:"295",height:"640"}),"}"]})]})}function m(e={}){const{wrapper:n}={...(0,r.a)(),...e.components};return n?(0,t.jsx)(n,{...e,children:(0,t.jsx)(l,{...e})}):l(e)}},5847:(e,n,o)=>{o.d(n,{Z:()=>t});const t=o.p+"assets/images/GlobeProjection-002de6d08f5e7dac7e0e8a364c118f7a.png"},1151:(e,n,o)=>{o.d(n,{a:()=>s});var t=o(7294);const r={},a=t.createContext(r);function s(e){const n=t.useContext(a);return t.useMemo((function(){return"function"==typeof e?e(n):{...n,...e}}),[n,e])}}}]); \ No newline at end of file +"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[1003],{6654:(e,n,o)=>{o.r(n),o.d(n,{assets:()=>p,contentTitle:()=>s,default:()=>m,frontMatter:()=>a,metadata:()=>i,toc:()=>c});var t=o(5893),r=o(1151);const a={title:"Globe Projection",tags:["MapView#projection"],custom_props:{example_rel_path:"V10/GlobeProjection.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/V10/GlobeProjection.tsx"},s=void 0,i={id:"examples/V10/GlobeProjection",title:"Globe Projection",description:"Shows map with globe projection",source:"@site/docs/examples/V10/GlobeProjection.md",sourceDirName:"examples/V10",slug:"/examples/V10/GlobeProjection",permalink:"/docs/examples/V10/GlobeProjection",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/V10/GlobeProjection.tsx",tags:[{inline:!0,label:"MapView#projection",permalink:"/docs/tags/map-view-projection"}],version:"current",frontMatter:{title:"Globe Projection",tags:["MapView#projection"],custom_props:{example_rel_path:"V10/GlobeProjection.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/V10/GlobeProjection.tsx"},sidebar:"examplesSidebar",previous:{title:"Camera Animation",permalink:"/docs/examples/V10/CameraAnimation"},next:{title:"Map Handlers",permalink:"/docs/examples/V10/MapHandlers"}},p={},c=[];function l(e){const n={code:"code",img:"img",p:"p",pre:"pre",...(0,r.a)(),...e.components};return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(n.p,{children:"Shows map with globe projection"}),"\n",(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-jsx",children:"import React, { useState } from 'react';\nimport { Button } from 'react-native';\nimport {\n MapView,\n SkyLayer,\n Logger,\n Terrain,\n RasterDemSource,\n Atmosphere,\n Camera,\n} from '@rnmapbox/maps';\n\nimport { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc\n\nLogger.setLogLevel('verbose');\n\nconst GlobeProjection = () => {\n const [projection, setProjection] = useState<'globe' | 'mercator'>('globe');\n\n return (\n <>\n \n setProjection(projection === 'globe' ? 'mercator' : 'globe')\n }\n />\n \n \n \n \n \n \n \n \n \n );\n};\n\nexport default GlobeProjection;\n\n\n"})}),"\n",(0,t.jsxs)(n.p,{children:[(0,t.jsx)(n.img,{alt:"GlobeProjection.png",src:o(5847).Z+"",width:"295",height:"640"}),"}"]})]})}function m(e={}){const{wrapper:n}={...(0,r.a)(),...e.components};return n?(0,t.jsx)(n,{...e,children:(0,t.jsx)(l,{...e})}):l(e)}},5847:(e,n,o)=>{o.d(n,{Z:()=>t});const t=o.p+"assets/images/GlobeProjection-fa32c0855303f845987917f85572b3ce.png"},1151:(e,n,o)=>{o.d(n,{a:()=>s});var t=o(7294);const r={},a=t.createContext(r);function s(e){const n=t.useContext(a);return t.useMemo((function(){return"function"==typeof e?e(n):{...n,...e}}),[n,e])}}}]); \ No newline at end of file diff --git a/assets/js/18b78d02.2b6c5f34.js b/assets/js/18b78d02.14535420.js similarity index 95% rename from assets/js/18b78d02.2b6c5f34.js rename to assets/js/18b78d02.14535420.js index 2c48416..0199e3f 100644 --- a/assets/js/18b78d02.2b6c5f34.js +++ b/assets/js/18b78d02.14535420.js @@ -1 +1 @@ -"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[8770],{8440:(e,a,s)=>{s.r(a),s.d(a,{assets:()=>n,contentTitle:()=>c,default:()=>m,frontMatter:()=>o,metadata:()=>i,toc:()=>p});var t=s(5893),l=s(1151);const o={title:"Localize Labels",tags:["MapView#localizeLabels"],custom_props:{example_rel_path:"Map/LocalizeLabels.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/LocalizeLabels.tsx"},c=void 0,i={id:"examples/Map/LocalizeLabels",title:"Localize Labels",description:"Localize labels to a specific locale(es).",source:"@site/docs/examples/Map/LocalizeLabels.md",sourceDirName:"examples/Map",slug:"/examples/Map/LocalizeLabels",permalink:"/docs/examples/Map/LocalizeLabels",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/LocalizeLabels.tsx",tags:[{inline:!0,label:"MapView#localizeLabels",permalink:"/docs/tags/map-view-localize-labels"}],version:"current",frontMatter:{title:"Localize Labels",tags:["MapView#localizeLabels"],custom_props:{example_rel_path:"Map/LocalizeLabels.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/LocalizeLabels.tsx"},sidebar:"examplesSidebar",previous:{title:"Dynamic URL",permalink:"/docs/examples/Map/DynamicUrl"},next:{title:"Map and React Navigation",permalink:"/docs/examples/Map/MapAndRNNavigation"}},n={},p=[];function r(e){const a={code:"code",img:"img",p:"p",pre:"pre",...(0,l.a)(),...e.components};return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(a.p,{children:"Localize labels to a specific locale(es)."}),"\n",(0,t.jsx)(a.pre,{children:(0,t.jsx)(a.code,{className:"language-jsx",children:"import React from 'react';\nimport { Camera, MapView } from '@rnmapbox/maps';\n\nconst CENTER_COORD = [-74.00597, 40.71427];\n\nimport { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc\n\nconst LocalizeLabels = () => {\n return (\n \n \n \n );\n};\n\nexport default LocalizeLabels;\n\n\n"})}),"\n",(0,t.jsxs)(a.p,{children:[(0,t.jsx)(a.img,{alt:"LocalizeLabels.png",src:s(4065).Z+"",width:"295",height:"640"}),"}"]})]})}function m(e={}){const{wrapper:a}={...(0,l.a)(),...e.components};return a?(0,t.jsx)(a,{...e,children:(0,t.jsx)(r,{...e})}):r(e)}},4065:(e,a,s)=>{s.d(a,{Z:()=>t});const t=s.p+"assets/images/LocalizeLabels-be31f7ea356fb021defeaf857dc65e06.png"},1151:(e,a,s)=>{s.d(a,{a:()=>c});var t=s(7294);const l={},o=t.createContext(l);function c(e){const a=t.useContext(o);return t.useMemo((function(){return"function"==typeof e?e(a):{...a,...e}}),[a,e])}}}]); \ No newline at end of file +"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[8770],{8440:(e,a,s)=>{s.r(a),s.d(a,{assets:()=>n,contentTitle:()=>c,default:()=>m,frontMatter:()=>o,metadata:()=>i,toc:()=>p});var t=s(5893),l=s(1151);const o={title:"Localize Labels",tags:["MapView#localizeLabels"],custom_props:{example_rel_path:"Map/LocalizeLabels.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/LocalizeLabels.tsx"},c=void 0,i={id:"examples/Map/LocalizeLabels",title:"Localize Labels",description:"Localize labels to a specific locale(es).",source:"@site/docs/examples/Map/LocalizeLabels.md",sourceDirName:"examples/Map",slug:"/examples/Map/LocalizeLabels",permalink:"/docs/examples/Map/LocalizeLabels",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/LocalizeLabels.tsx",tags:[{inline:!0,label:"MapView#localizeLabels",permalink:"/docs/tags/map-view-localize-labels"}],version:"current",frontMatter:{title:"Localize Labels",tags:["MapView#localizeLabels"],custom_props:{example_rel_path:"Map/LocalizeLabels.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/LocalizeLabels.tsx"},sidebar:"examplesSidebar",previous:{title:"Dynamic URL",permalink:"/docs/examples/Map/DynamicUrl"},next:{title:"Map and React Navigation",permalink:"/docs/examples/Map/MapAndRNNavigation"}},n={},p=[];function r(e){const a={code:"code",img:"img",p:"p",pre:"pre",...(0,l.a)(),...e.components};return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(a.p,{children:"Localize labels to a specific locale(es)."}),"\n",(0,t.jsx)(a.pre,{children:(0,t.jsx)(a.code,{className:"language-jsx",children:"import React from 'react';\nimport { Camera, MapView } from '@rnmapbox/maps';\n\nconst CENTER_COORD = [-74.00597, 40.71427];\n\nimport { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc\n\nconst LocalizeLabels = () => {\n return (\n \n \n \n );\n};\n\nexport default LocalizeLabels;\n\n\n"})}),"\n",(0,t.jsxs)(a.p,{children:[(0,t.jsx)(a.img,{alt:"LocalizeLabels.png",src:s(4065).Z+"",width:"295",height:"640"}),"}"]})]})}function m(e={}){const{wrapper:a}={...(0,l.a)(),...e.components};return a?(0,t.jsx)(a,{...e,children:(0,t.jsx)(r,{...e})}):r(e)}},4065:(e,a,s)=>{s.d(a,{Z:()=>t});const t=s.p+"assets/images/LocalizeLabels-51883db18d2642925671ed19626facec.png"},1151:(e,a,s)=>{s.d(a,{a:()=>c});var t=s(7294);const l={},o=t.createContext(l);function c(e){const a=t.useContext(o);return t.useMemo((function(){return"function"==typeof e?e(a):{...a,...e}}),[a,e])}}}]); \ No newline at end of file diff --git a/assets/js/1c473699.72f5205e.js b/assets/js/1c473699.b53c6075.js similarity index 98% rename from assets/js/1c473699.72f5205e.js rename to assets/js/1c473699.b53c6075.js index 4082f25..c27a96d 100644 --- a/assets/js/1c473699.72f5205e.js +++ b/assets/js/1c473699.b53c6075.js @@ -1 +1 @@ -"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[169],{9049:(e,n,t)=>{t.r(n),t.d(n,{assets:()=>g,contentTitle:()=>s,default:()=>l,frontMatter:()=>a,metadata:()=>r,toc:()=>p});var i=t(5893),o=t(1151);const a={title:"Show Region Did Change",tags:["MapView#onRegionWillChange","MapView#onRegionIsChanging","MapView#onRegionDidChange"],custom_props:{example_rel_path:"Map/ShowRegionDidChange.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/ShowRegionDidChange.js"},s=void 0,r={id:"examples/Map/ShowRegionDidChange",title:"Show Region Did Change",description:"Demonstates MapView region change events.",source:"@site/docs/examples/Map/ShowRegionDidChange.md",sourceDirName:"examples/Map",slug:"/examples/Map/ShowRegionDidChange",permalink:"/docs/examples/Map/ShowRegionDidChange",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/ShowRegionDidChange.js",tags:[{inline:!0,label:"MapView#onRegionWillChange",permalink:"/docs/tags/map-view-on-region-will-change"},{inline:!0,label:"MapView#onRegionIsChanging",permalink:"/docs/tags/map-view-on-region-is-changing"},{inline:!0,label:"MapView#onRegionDidChange",permalink:"/docs/tags/map-view-on-region-did-change"}],version:"current",frontMatter:{title:"Show Region Did Change",tags:["MapView#onRegionWillChange","MapView#onRegionIsChanging","MapView#onRegionDidChange"],custom_props:{example_rel_path:"Map/ShowRegionDidChange.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/ShowRegionDidChange.js"},sidebar:"examplesSidebar",previous:{title:"Show Map Local Style",permalink:"/docs/examples/Map/ShowMapLocalStyle"},next:{title:"Source Layer Visibility",permalink:"/docs/examples/Map/SourceLayerVisibility"}},g={},p=[];function h(e){const n={code:"code",img:"img",p:"p",pre:"pre",...(0,o.a)(),...e.components};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(n.p,{children:"Demonstates MapView region change events."}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-jsx",children:"import React from 'react';\nimport { Text } from 'react-native';\nimport { MapView, Camera } from '@rnmapbox/maps';\nimport { ButtonGroup } from '@rneui/base';\n\nimport sheet from '../../styles/sheet';\nimport { DEFAULT_CENTER_COORDINATE, SF_OFFICE_COORDINATE } from '../../utils';\nimport Bubble from '../common/Bubble';\n\nconst styles = {\n bubble: { marginBottom: 100 },\n};\n\nconst isValidCoordinate = (geometry) => {\n if (!geometry) {\n return false;\n }\n return geometry.coordinates[0] !== 0 && geometry.coordinates[1] !== 0;\n};\n\nclass ShowRegionDidChange extends React.Component {\n constructor(props) {\n super(props);\n\n this.state = {\n reason: '',\n cameraConfig: {\n centerCoordinate: DEFAULT_CENTER_COORDINATE,\n zoomLevel: 12,\n },\n regionFeature: undefined,\n selectedIndex: 0,\n };\n\n this._tabOptions = [\n { label: 'Fly To', data: SF_OFFICE_COORDINATE },\n {\n label: 'Fit Bounds',\n data: { ne: [-74.12641, 40.797968], sw: [-74.143727, 40.772177] },\n },\n { label: 'Zoom To', data: 16 },\n ];\n\n this.onRegionDidChange = this.onRegionDidChange.bind(this);\n this.onRegionWillChange = this.onRegionWillChange.bind(this);\n this.onRegionIsChanging = this.onRegionIsChanging.bind(this);\n this.onOptionPress = this.onOptionPress.bind(this);\n }\n\n async onOptionPress(optionIndex, optionData) {\n if (optionIndex === 0) {\n this.setState({\n cameraConfig: {\n triggerKey: Date.now(),\n centerCoordinate: optionData,\n animationMode: Camera.Mode.Flight,\n animationDuration: 2000,\n },\n });\n } else if (optionIndex === 1) {\n this.setState({\n cameraConfig: {\n triggerKey: Date.now(),\n bounds: optionData,\n },\n });\n } else if (optionIndex === 2) {\n this.setState({\n cameraConfig: {\n triggerKey: Date.now(),\n zoomLevel: optionData,\n },\n });\n }\n }\n\n onRegionWillChange(regionFeature) {\n this.setState({ reason: 'will change', regionFeature });\n }\n\n onRegionDidChange(regionFeature) {\n this.setState({ reason: 'did change', regionFeature });\n }\n\n onRegionIsChanging(regionFeature) {\n this.setState({ reason: 'is changing', regionFeature });\n }\n\n renderRegionChange() {\n if (\n !this.state.regionFeature ||\n !isValidCoordinate(this.state.regionFeature.geometry)\n ) {\n return (\n \n Move the map!\n \n );\n }\n\n const { geometry, properties } = this.state.regionFeature;\n\n const neCoord = properties.visibleBounds[0]\n .map((n) => n.toPrecision(6))\n .join(', ');\n const swCoord = properties.visibleBounds[1]\n .map((n) => n.toPrecision(6))\n .join(', ');\n\n return (\n \n {this.state.reason}\n Latitude: {geometry.coordinates[1]}\n Longitude: {geometry.coordinates[0]}\n Visible Bounds NE: {neCoord}\n Visible Bounds SW: {swCoord}\n Zoom Level: {properties.zoomLevel}\n Heading: {properties.heading}\n Pitch: {properties.pitch}\n \n Is User Interaction: {properties.isUserInteraction ? 'true' : 'false'}\n \n Animated: {properties.animated ? 'true' : 'false'}\n \n );\n }\n\n render() {\n return (\n <>\n i.label)}\n selectedIndex={this.state.selectedIndex}\n onPress={(index) => {\n this.setState({ selectedIndex: index });\n this.onOptionPress(index, this._tabOptions[index].data);\n }}\n />\n (this.map = c)}\n style={sheet.matchParent}\n onRegionWillChange={this.onRegionWillChange}\n onRegionIsChanging={this.onRegionIsChanging}\n onRegionDidChange={this.onRegionDidChange}\n >\n \n \n {this.renderRegionChange()}\n \n );\n }\n}\n\nexport default ShowRegionDidChange;\n\n\n"})}),"\n",(0,i.jsxs)(n.p,{children:[(0,i.jsx)(n.img,{alt:"ShowRegionDidChange.png",src:t(9418).Z+"",width:"295",height:"640"}),"}"]})]})}function l(e={}){const{wrapper:n}={...(0,o.a)(),...e.components};return n?(0,i.jsx)(n,{...e,children:(0,i.jsx)(h,{...e})}):h(e)}},9418:(e,n,t)=>{t.d(n,{Z:()=>i});const i=t.p+"assets/images/ShowRegionDidChange-430c5d840344f5db9e9a40265601a593.png"},1151:(e,n,t)=>{t.d(n,{a:()=>s});var i=t(7294);const o={},a=i.createContext(o);function s(e){const n=i.useContext(a);return i.useMemo((function(){return"function"==typeof e?e(n):{...n,...e}}),[n,e])}}}]); \ No newline at end of file +"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[169],{9049:(e,n,t)=>{t.r(n),t.d(n,{assets:()=>g,contentTitle:()=>s,default:()=>l,frontMatter:()=>a,metadata:()=>r,toc:()=>p});var i=t(5893),o=t(1151);const a={title:"Show Region Did Change",tags:["MapView#onRegionWillChange","MapView#onRegionIsChanging","MapView#onRegionDidChange"],custom_props:{example_rel_path:"Map/ShowRegionDidChange.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/ShowRegionDidChange.js"},s=void 0,r={id:"examples/Map/ShowRegionDidChange",title:"Show Region Did Change",description:"Demonstates MapView region change events.",source:"@site/docs/examples/Map/ShowRegionDidChange.md",sourceDirName:"examples/Map",slug:"/examples/Map/ShowRegionDidChange",permalink:"/docs/examples/Map/ShowRegionDidChange",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/ShowRegionDidChange.js",tags:[{inline:!0,label:"MapView#onRegionWillChange",permalink:"/docs/tags/map-view-on-region-will-change"},{inline:!0,label:"MapView#onRegionIsChanging",permalink:"/docs/tags/map-view-on-region-is-changing"},{inline:!0,label:"MapView#onRegionDidChange",permalink:"/docs/tags/map-view-on-region-did-change"}],version:"current",frontMatter:{title:"Show Region Did Change",tags:["MapView#onRegionWillChange","MapView#onRegionIsChanging","MapView#onRegionDidChange"],custom_props:{example_rel_path:"Map/ShowRegionDidChange.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/ShowRegionDidChange.js"},sidebar:"examplesSidebar",previous:{title:"Show Map Local Style",permalink:"/docs/examples/Map/ShowMapLocalStyle"},next:{title:"Source Layer Visibility",permalink:"/docs/examples/Map/SourceLayerVisibility"}},g={},p=[];function h(e){const n={code:"code",img:"img",p:"p",pre:"pre",...(0,o.a)(),...e.components};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(n.p,{children:"Demonstates MapView region change events."}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-jsx",children:"import React from 'react';\nimport { Text } from 'react-native';\nimport { MapView, Camera } from '@rnmapbox/maps';\nimport { ButtonGroup } from '@rneui/base';\n\nimport sheet from '../../styles/sheet';\nimport { DEFAULT_CENTER_COORDINATE, SF_OFFICE_COORDINATE } from '../../utils';\nimport Bubble from '../common/Bubble';\n\nconst styles = {\n bubble: { marginBottom: 100 },\n};\n\nconst isValidCoordinate = (geometry) => {\n if (!geometry) {\n return false;\n }\n return geometry.coordinates[0] !== 0 && geometry.coordinates[1] !== 0;\n};\n\nclass ShowRegionDidChange extends React.Component {\n constructor(props) {\n super(props);\n\n this.state = {\n reason: '',\n cameraConfig: {\n centerCoordinate: DEFAULT_CENTER_COORDINATE,\n zoomLevel: 12,\n },\n regionFeature: undefined,\n selectedIndex: 0,\n };\n\n this._tabOptions = [\n { label: 'Fly To', data: SF_OFFICE_COORDINATE },\n {\n label: 'Fit Bounds',\n data: { ne: [-74.12641, 40.797968], sw: [-74.143727, 40.772177] },\n },\n { label: 'Zoom To', data: 16 },\n ];\n\n this.onRegionDidChange = this.onRegionDidChange.bind(this);\n this.onRegionWillChange = this.onRegionWillChange.bind(this);\n this.onRegionIsChanging = this.onRegionIsChanging.bind(this);\n this.onOptionPress = this.onOptionPress.bind(this);\n }\n\n async onOptionPress(optionIndex, optionData) {\n if (optionIndex === 0) {\n this.setState({\n cameraConfig: {\n triggerKey: Date.now(),\n centerCoordinate: optionData,\n animationMode: Camera.Mode.Flight,\n animationDuration: 2000,\n },\n });\n } else if (optionIndex === 1) {\n this.setState({\n cameraConfig: {\n triggerKey: Date.now(),\n bounds: optionData,\n },\n });\n } else if (optionIndex === 2) {\n this.setState({\n cameraConfig: {\n triggerKey: Date.now(),\n zoomLevel: optionData,\n },\n });\n }\n }\n\n onRegionWillChange(regionFeature) {\n this.setState({ reason: 'will change', regionFeature });\n }\n\n onRegionDidChange(regionFeature) {\n this.setState({ reason: 'did change', regionFeature });\n }\n\n onRegionIsChanging(regionFeature) {\n this.setState({ reason: 'is changing', regionFeature });\n }\n\n renderRegionChange() {\n if (\n !this.state.regionFeature ||\n !isValidCoordinate(this.state.regionFeature.geometry)\n ) {\n return (\n \n Move the map!\n \n );\n }\n\n const { geometry, properties } = this.state.regionFeature;\n\n const neCoord = properties.visibleBounds[0]\n .map((n) => n.toPrecision(6))\n .join(', ');\n const swCoord = properties.visibleBounds[1]\n .map((n) => n.toPrecision(6))\n .join(', ');\n\n return (\n \n {this.state.reason}\n Latitude: {geometry.coordinates[1]}\n Longitude: {geometry.coordinates[0]}\n Visible Bounds NE: {neCoord}\n Visible Bounds SW: {swCoord}\n Zoom Level: {properties.zoomLevel}\n Heading: {properties.heading}\n Pitch: {properties.pitch}\n \n Is User Interaction: {properties.isUserInteraction ? 'true' : 'false'}\n \n Animated: {properties.animated ? 'true' : 'false'}\n \n );\n }\n\n render() {\n return (\n <>\n i.label)}\n selectedIndex={this.state.selectedIndex}\n onPress={(index) => {\n this.setState({ selectedIndex: index });\n this.onOptionPress(index, this._tabOptions[index].data);\n }}\n />\n (this.map = c)}\n style={sheet.matchParent}\n onRegionWillChange={this.onRegionWillChange}\n onRegionIsChanging={this.onRegionIsChanging}\n onRegionDidChange={this.onRegionDidChange}\n >\n \n \n {this.renderRegionChange()}\n \n );\n }\n}\n\nexport default ShowRegionDidChange;\n\n\n"})}),"\n",(0,i.jsxs)(n.p,{children:[(0,i.jsx)(n.img,{alt:"ShowRegionDidChange.png",src:t(9418).Z+"",width:"295",height:"640"}),"}"]})]})}function l(e={}){const{wrapper:n}={...(0,o.a)(),...e.components};return n?(0,i.jsx)(n,{...e,children:(0,i.jsx)(h,{...e})}):h(e)}},9418:(e,n,t)=>{t.d(n,{Z:()=>i});const i=t.p+"assets/images/ShowRegionDidChange-38d36d073b2d247d2158d300949f52b2.png"},1151:(e,n,t)=>{t.d(n,{a:()=>s});var i=t(7294);const o={},a=i.createContext(o);function s(e){const n=i.useContext(a);return i.useMemo((function(){return"function"==typeof e?e(n):{...n,...e}}),[n,e])}}}]); \ No newline at end of file diff --git a/assets/js/31c1c968.7d00aa88.js b/assets/js/31c1c968.7f634b7e.js similarity index 99% rename from assets/js/31c1c968.7d00aa88.js rename to assets/js/31c1c968.7f634b7e.js index c912ee5..b4df94f 100644 --- a/assets/js/31c1c968.7d00aa88.js +++ b/assets/js/31c1c968.7f634b7e.js @@ -1 +1 @@ -"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[7786],{5859:(e,t,n)=>{n.r(t),n.d(t,{assets:()=>c,contentTitle:()=>l,default:()=>u,frontMatter:()=>s,metadata:()=>o,toc:()=>i});var a=n(5893),r=n(1151);const s={title:"Earthquakes",tags:["ShapeSource","SymbolLayer","ShapeSource#getClusterLeaves","CircleLayer","CircleLayer#clusterProperties","expressions"],custom_props:{example_rel_path:"SymbolCircleLayer/Earthquakes.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/SymbolCircleLayer/Earthquakes.tsx"},l=void 0,o={id:"examples/SymbolCircleLayer/Earthquakes",title:"Earthquakes",description:"Renders earthqueke with clustering.",source:"@site/docs/examples/SymbolCircleLayer/Earthquakes.md",sourceDirName:"examples/SymbolCircleLayer",slug:"/examples/SymbolCircleLayer/Earthquakes",permalink:"/docs/examples/SymbolCircleLayer/Earthquakes",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/SymbolCircleLayer/Earthquakes.tsx",tags:[{inline:!0,label:"ShapeSource",permalink:"/docs/tags/shape-source"},{inline:!0,label:"SymbolLayer",permalink:"/docs/tags/symbol-layer"},{inline:!0,label:"ShapeSource#getClusterLeaves",permalink:"/docs/tags/shape-source-get-cluster-leaves"},{inline:!0,label:"CircleLayer",permalink:"/docs/tags/circle-layer"},{inline:!0,label:"CircleLayer#clusterProperties",permalink:"/docs/tags/circle-layer-cluster-properties"},{inline:!0,label:"expressions",permalink:"/docs/tags/expressions"}],version:"current",frontMatter:{title:"Earthquakes",tags:["ShapeSource","SymbolLayer","ShapeSource#getClusterLeaves","CircleLayer","CircleLayer#clusterProperties","expressions"],custom_props:{example_rel_path:"SymbolCircleLayer/Earthquakes.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/SymbolCircleLayer/Earthquakes.tsx"},sidebar:"examplesSidebar",previous:{title:"Data driven circle colors",permalink:"/docs/examples/SymbolCircleLayer/DataDrivenCircleColors"},next:{title:"Scaleable images",permalink:"/docs/examples/SymbolCircleLayer/ScalableImages"}},c={},i=[];function m(e){const t={code:"code",img:"img",p:"p",pre:"pre",...(0,r.a)(),...e.components};return(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(t.p,{children:"Renders earthqueke with clustering."}),"\n",(0,a.jsxs)(t.p,{children:["Click a cluster to show list of contents in the cluster ",(0,a.jsx)(t.code,{children:"getClusterLeaves"}),"."]}),"\n",(0,a.jsx)(t.pre,{children:(0,a.jsx)(t.code,{className:"language-jsx",children:"import { FAB, Icon, ListItem, Overlay } from '@rneui/base';\nimport MapboxGL, {\n Camera,\n CircleLayer,\n CircleLayerStyle,\n MapView,\n ShapeSource,\n SymbolLayer,\n SymbolLayerStyle,\n} from '@rnmapbox/maps';\nimport { FeatureCollection } from 'geojson';\nimport moment from 'moment';\nimport React, { useRef, useState } from 'react';\nimport { FlatList, SafeAreaView } from 'react-native';\n\nimport earthQuakesJSON from '../../assets/earthquakes.json';\nimport { SF_OFFICE_COORDINATE } from '../../utils';\nimport { ExampleWithMetadata } from '../common/ExampleMetadata';\n\nconst layerStyles: {\n singlePoint: CircleLayerStyle;\n clusteredPoints: CircleLayerStyle;\n clusterCount: SymbolLayerStyle;\n} = {\n singlePoint: {\n circleColor: 'green',\n circleOpacity: 0.84,\n circleStrokeWidth: 2,\n circleStrokeColor: 'white',\n circleRadius: 5,\n circlePitchAlignment: 'map',\n },\n\n clusteredPoints: {\n circlePitchAlignment: 'map',\n\n circleColor: [\n 'step',\n ['get', 'point_count'],\n '#51bbd6',\n 100,\n '#f1f075',\n 750,\n '#f28cb1',\n ],\n\n circleRadius: ['step', ['get', 'point_count'], 20, 100, 30, 750, 40],\n\n circleOpacity: 0.84,\n circleStrokeWidth: 2,\n circleStrokeColor: 'white',\n },\n\n clusterCount: {\n textField: [\n 'format',\n ['concat', ['get', 'point_count'], '\\n'],\n {},\n [\n 'concat',\n '>1: ',\n [\n '+',\n ['get', 'mag2'],\n ['get', 'mag3'],\n ['get', 'mag4'],\n ['get', 'mag5'],\n ],\n ],\n { 'font-scale': 0.8 },\n ],\n textSize: 12,\n textPitchAlignment: 'map',\n },\n};\n\nconst styles = {\n fab: {\n position: 'absolute',\n top: 10,\n right: 10,\n elevation: 9999,\n zIndex: 9999,\n },\n matchParent: {\n flex: 1,\n },\n} as const;\n\nconst mag1 = ['<', ['get', 'mag'], 2];\nconst mag2 = ['all', ['>=', ['get', 'mag'], 2], ['<', ['get', 'mag'], 3]];\nconst mag3 = ['all', ['>=', ['get', 'mag'], 3], ['<', ['get', 'mag'], 4]];\nconst mag4 = ['all', ['>=', ['get', 'mag'], 4], ['<', ['get', 'mag'], 5]];\nconst mag5 = ['>=', ['get', 'mag'], 5];\n\nconst Earthquakes = () => {\n const shapeSource = useRef(null);\n const [selectedCluster, setSelectedCluster] = useState();\n\n return (\n <>\n \n \n {\n setSelectedCluster(undefined);\n }}\n icon={}\n size=\"large\"\n style={styles.fab}\n />\n {selectedCluster && (\n {\n return earthquakeInfo?.code;\n }}\n data={selectedCluster.features}\n renderItem={({ item: { properties: earthquakeInfo } }) => {\n const magnitude = `Magnitude: ${earthquakeInfo?.mag}`;\n const place = `Place: ${earthquakeInfo?.place}`;\n const code = `Code: ${earthquakeInfo?.code}`;\n const time = `Time: ${moment(earthquakeInfo?.time).format(\n 'MMMM Do YYYY, h:mm:ss a',\n )}`;\n\n return (\n \n \n {earthquakeInfo?.title}\n {magnitude}\n {place}\n {code}\n {time}\n \n \n );\n }}\n />\n )}\n \n \n \n \n\n {\n if (shapeSource.current) {\n try {\n const [cluster] = pressedShape.features;\n\n const collection = await shapeSource.current.getClusterLeaves(\n cluster,\n 999,\n 0,\n );\n\n setSelectedCluster(collection);\n } catch {\n if (!pressedShape.features[0].properties?.cluster) {\n setSelectedCluster({\n type: 'FeatureCollection',\n features: [pressedShape.features[0]],\n });\n }\n }\n }\n }}\n ref={shapeSource}\n cluster\n clusterRadius={50}\n clusterMaxZoomLevel={14}\n clusterProperties={{\n mag1: [\n ['+', ['accumulated'], ['get', 'mag1']],\n ['case', mag1, 1, 0],\n ],\n mag2: [\n ['+', ['accumulated'], ['get', 'mag2']],\n ['case', mag2, 1, 0],\n ],\n mag3: [\n ['+', ['accumulated'], ['get', 'mag3']],\n ['case', mag3, 1, 0],\n ],\n mag4: [\n ['+', ['accumulated'], ['get', 'mag4']],\n ['case', mag4, 1, 0],\n ],\n mag5: [\n ['+', ['accumulated'], ['get', 'mag5']],\n ['case', mag5, 1, 0],\n ],\n }}\n shape={earthQuakesJSON as unknown as FeatureCollection}\n >\n \n\n \n\n \n \n \n \n );\n};\n\nexport default Earthquakes;\n\n\n"})}),"\n",(0,a.jsxs)(t.p,{children:[(0,a.jsx)(t.img,{alt:"Earthquakes.png",src:n(7729).Z+"",width:"295",height:"640"}),"}"]})]})}function u(e={}){const{wrapper:t}={...(0,r.a)(),...e.components};return t?(0,a.jsx)(t,{...e,children:(0,a.jsx)(m,{...e})}):m(e)}},7729:(e,t,n)=>{n.d(t,{Z:()=>a});const a=n.p+"assets/images/Earthquakes-0468a08367b71efa02a3ab4bf45b4c34.png"},1151:(e,t,n)=>{n.d(t,{a:()=>l});var a=n(7294);const r={},s=a.createContext(r);function l(e){const t=a.useContext(s);return a.useMemo((function(){return"function"==typeof e?e(t):{...t,...e}}),[t,e])}}}]); \ No newline at end of file +"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[7786],{5859:(e,t,n)=>{n.r(t),n.d(t,{assets:()=>c,contentTitle:()=>l,default:()=>u,frontMatter:()=>s,metadata:()=>o,toc:()=>i});var a=n(5893),r=n(1151);const s={title:"Earthquakes",tags:["ShapeSource","SymbolLayer","ShapeSource#getClusterLeaves","CircleLayer","CircleLayer#clusterProperties","expressions"],custom_props:{example_rel_path:"SymbolCircleLayer/Earthquakes.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/SymbolCircleLayer/Earthquakes.tsx"},l=void 0,o={id:"examples/SymbolCircleLayer/Earthquakes",title:"Earthquakes",description:"Renders earthqueke with clustering.",source:"@site/docs/examples/SymbolCircleLayer/Earthquakes.md",sourceDirName:"examples/SymbolCircleLayer",slug:"/examples/SymbolCircleLayer/Earthquakes",permalink:"/docs/examples/SymbolCircleLayer/Earthquakes",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/SymbolCircleLayer/Earthquakes.tsx",tags:[{inline:!0,label:"ShapeSource",permalink:"/docs/tags/shape-source"},{inline:!0,label:"SymbolLayer",permalink:"/docs/tags/symbol-layer"},{inline:!0,label:"ShapeSource#getClusterLeaves",permalink:"/docs/tags/shape-source-get-cluster-leaves"},{inline:!0,label:"CircleLayer",permalink:"/docs/tags/circle-layer"},{inline:!0,label:"CircleLayer#clusterProperties",permalink:"/docs/tags/circle-layer-cluster-properties"},{inline:!0,label:"expressions",permalink:"/docs/tags/expressions"}],version:"current",frontMatter:{title:"Earthquakes",tags:["ShapeSource","SymbolLayer","ShapeSource#getClusterLeaves","CircleLayer","CircleLayer#clusterProperties","expressions"],custom_props:{example_rel_path:"SymbolCircleLayer/Earthquakes.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/SymbolCircleLayer/Earthquakes.tsx"},sidebar:"examplesSidebar",previous:{title:"Data driven circle colors",permalink:"/docs/examples/SymbolCircleLayer/DataDrivenCircleColors"},next:{title:"Scaleable images",permalink:"/docs/examples/SymbolCircleLayer/ScalableImages"}},c={},i=[];function m(e){const t={code:"code",img:"img",p:"p",pre:"pre",...(0,r.a)(),...e.components};return(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(t.p,{children:"Renders earthqueke with clustering."}),"\n",(0,a.jsxs)(t.p,{children:["Click a cluster to show list of contents in the cluster ",(0,a.jsx)(t.code,{children:"getClusterLeaves"}),"."]}),"\n",(0,a.jsx)(t.pre,{children:(0,a.jsx)(t.code,{className:"language-jsx",children:"import { FAB, Icon, ListItem, Overlay } from '@rneui/base';\nimport MapboxGL, {\n Camera,\n CircleLayer,\n CircleLayerStyle,\n MapView,\n ShapeSource,\n SymbolLayer,\n SymbolLayerStyle,\n} from '@rnmapbox/maps';\nimport { FeatureCollection } from 'geojson';\nimport moment from 'moment';\nimport React, { useRef, useState } from 'react';\nimport { FlatList, SafeAreaView } from 'react-native';\n\nimport earthQuakesJSON from '../../assets/earthquakes.json';\nimport { SF_OFFICE_COORDINATE } from '../../utils';\nimport { ExampleWithMetadata } from '../common/ExampleMetadata';\n\nconst layerStyles: {\n singlePoint: CircleLayerStyle;\n clusteredPoints: CircleLayerStyle;\n clusterCount: SymbolLayerStyle;\n} = {\n singlePoint: {\n circleColor: 'green',\n circleOpacity: 0.84,\n circleStrokeWidth: 2,\n circleStrokeColor: 'white',\n circleRadius: 5,\n circlePitchAlignment: 'map',\n },\n\n clusteredPoints: {\n circlePitchAlignment: 'map',\n\n circleColor: [\n 'step',\n ['get', 'point_count'],\n '#51bbd6',\n 100,\n '#f1f075',\n 750,\n '#f28cb1',\n ],\n\n circleRadius: ['step', ['get', 'point_count'], 20, 100, 30, 750, 40],\n\n circleOpacity: 0.84,\n circleStrokeWidth: 2,\n circleStrokeColor: 'white',\n },\n\n clusterCount: {\n textField: [\n 'format',\n ['concat', ['get', 'point_count'], '\\n'],\n {},\n [\n 'concat',\n '>1: ',\n [\n '+',\n ['get', 'mag2'],\n ['get', 'mag3'],\n ['get', 'mag4'],\n ['get', 'mag5'],\n ],\n ],\n { 'font-scale': 0.8 },\n ],\n textSize: 12,\n textPitchAlignment: 'map',\n },\n};\n\nconst styles = {\n fab: {\n position: 'absolute',\n top: 10,\n right: 10,\n elevation: 9999,\n zIndex: 9999,\n },\n matchParent: {\n flex: 1,\n },\n} as const;\n\nconst mag1 = ['<', ['get', 'mag'], 2];\nconst mag2 = ['all', ['>=', ['get', 'mag'], 2], ['<', ['get', 'mag'], 3]];\nconst mag3 = ['all', ['>=', ['get', 'mag'], 3], ['<', ['get', 'mag'], 4]];\nconst mag4 = ['all', ['>=', ['get', 'mag'], 4], ['<', ['get', 'mag'], 5]];\nconst mag5 = ['>=', ['get', 'mag'], 5];\n\nconst Earthquakes = () => {\n const shapeSource = useRef(null);\n const [selectedCluster, setSelectedCluster] = useState();\n\n return (\n <>\n \n \n {\n setSelectedCluster(undefined);\n }}\n icon={}\n size=\"large\"\n style={styles.fab}\n />\n {selectedCluster && (\n {\n return earthquakeInfo?.code;\n }}\n data={selectedCluster.features}\n renderItem={({ item: { properties: earthquakeInfo } }) => {\n const magnitude = `Magnitude: ${earthquakeInfo?.mag}`;\n const place = `Place: ${earthquakeInfo?.place}`;\n const code = `Code: ${earthquakeInfo?.code}`;\n const time = `Time: ${moment(earthquakeInfo?.time).format(\n 'MMMM Do YYYY, h:mm:ss a',\n )}`;\n\n return (\n \n \n {earthquakeInfo?.title}\n {magnitude}\n {place}\n {code}\n {time}\n \n \n );\n }}\n />\n )}\n \n \n \n \n\n {\n if (shapeSource.current) {\n try {\n const [cluster] = pressedShape.features;\n\n const collection = await shapeSource.current.getClusterLeaves(\n cluster,\n 999,\n 0,\n );\n\n setSelectedCluster(collection);\n } catch {\n if (!pressedShape.features[0].properties?.cluster) {\n setSelectedCluster({\n type: 'FeatureCollection',\n features: [pressedShape.features[0]],\n });\n }\n }\n }\n }}\n ref={shapeSource}\n cluster\n clusterRadius={50}\n clusterMaxZoomLevel={14}\n clusterProperties={{\n mag1: [\n ['+', ['accumulated'], ['get', 'mag1']],\n ['case', mag1, 1, 0],\n ],\n mag2: [\n ['+', ['accumulated'], ['get', 'mag2']],\n ['case', mag2, 1, 0],\n ],\n mag3: [\n ['+', ['accumulated'], ['get', 'mag3']],\n ['case', mag3, 1, 0],\n ],\n mag4: [\n ['+', ['accumulated'], ['get', 'mag4']],\n ['case', mag4, 1, 0],\n ],\n mag5: [\n ['+', ['accumulated'], ['get', 'mag5']],\n ['case', mag5, 1, 0],\n ],\n }}\n shape={earthQuakesJSON as unknown as FeatureCollection}\n >\n \n\n \n\n \n \n \n \n );\n};\n\nexport default Earthquakes;\n\n\n"})}),"\n",(0,a.jsxs)(t.p,{children:[(0,a.jsx)(t.img,{alt:"Earthquakes.png",src:n(7729).Z+"",width:"295",height:"640"}),"}"]})]})}function u(e={}){const{wrapper:t}={...(0,r.a)(),...e.components};return t?(0,a.jsx)(t,{...e,children:(0,a.jsx)(m,{...e})}):m(e)}},7729:(e,t,n)=>{n.d(t,{Z:()=>a});const a=n.p+"assets/images/Earthquakes-68b7643b390a23afb5dc106aeeda5612.png"},1151:(e,t,n)=>{n.d(t,{a:()=>l});var a=n(7294);const r={},s=a.createContext(r);function l(e){const t=a.useContext(s);return a.useMemo((function(){return"function"==typeof e?e(t):{...t,...e}}),[t,e])}}}]); \ No newline at end of file diff --git a/assets/js/3364bf3a.9c72b4a5.js b/assets/js/3364bf3a.7afa93aa.js similarity index 98% rename from assets/js/3364bf3a.9c72b4a5.js rename to assets/js/3364bf3a.7afa93aa.js index 1399af4..1c4ec92 100644 --- a/assets/js/3364bf3a.9c72b4a5.js +++ b/assets/js/3364bf3a.7afa93aa.js @@ -1 +1 @@ -"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[2852],{3569:(e,t,n)=>{n.r(t),n.d(t,{assets:()=>l,contentTitle:()=>r,default:()=>p,frontMatter:()=>s,metadata:()=>i,toc:()=>c});var o=n(5893),a=n(1151);const s={title:"Custom Icon Native Asset",tags:["ShapeSource","ShapeSource#onPress","SymbolLayer","Images","SymbolLayer#iconImage"],custom_props:{example_rel_path:"SymbolCircleLayer/CustomIconNativeAsset.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/SymbolCircleLayer/CustomIconNativeAsset.tsx"},r=void 0,i={id:"examples/SymbolCircleLayer/CustomIconNativeAsset",title:"Custom Icon Native Asset",description:"Renders a symbol layer with custom icon (native asset) defined using the Images component. Clicking a location on a map add a new icon.",source:"@site/docs/examples/SymbolCircleLayer/CustomIconNativeAsset.md",sourceDirName:"examples/SymbolCircleLayer",slug:"/examples/SymbolCircleLayer/CustomIconNativeAsset",permalink:"/docs/examples/SymbolCircleLayer/CustomIconNativeAsset",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/SymbolCircleLayer/CustomIconNativeAsset.tsx",tags:[{inline:!0,label:"ShapeSource",permalink:"/docs/tags/shape-source"},{inline:!0,label:"ShapeSource#onPress",permalink:"/docs/tags/shape-source-on-press"},{inline:!0,label:"SymbolLayer",permalink:"/docs/tags/symbol-layer"},{inline:!0,label:"Images",permalink:"/docs/tags/images"},{inline:!0,label:"SymbolLayer#iconImage",permalink:"/docs/tags/symbol-layer-icon-image"}],version:"current",frontMatter:{title:"Custom Icon Native Asset",tags:["ShapeSource","ShapeSource#onPress","SymbolLayer","Images","SymbolLayer#iconImage"],custom_props:{example_rel_path:"SymbolCircleLayer/CustomIconNativeAsset.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/SymbolCircleLayer/CustomIconNativeAsset.tsx"},sidebar:"examplesSidebar",previous:{title:"Custom Icon",permalink:"/docs/examples/SymbolCircleLayer/CustomIcon"},next:{title:"Data driven circle colors",permalink:"/docs/examples/SymbolCircleLayer/DataDrivenCircleColors"}},l={},c=[];function m(e){const t={code:"code",img:"img",p:"p",pre:"pre",...(0,a.a)(),...e.components};return(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)(t.p,{children:"Renders a symbol layer with custom icon (native asset) defined using the Images component. Clicking a location on a map add a new icon."}),"\n",(0,o.jsx)(t.pre,{children:(0,o.jsx)(t.code,{className:"language-jsx",children:"import React, { useRef, memo, useState } from 'react';\nimport { Text } from 'react-native';\nimport MapboxGL, {\n MapView,\n Camera,\n ShapeSource,\n SymbolLayer,\n Images,\n} from '@rnmapbox/maps';\nimport { featureCollection, feature, point } from '@turf/helpers';\n\nimport Bubble from '../common/Bubble';\nimport type { ExampleWithMetadata } from '../common/ExampleMetadata';\n\nconst styles = {\n icon: {\n iconImage: 'pin',\n iconAllowOverlap: true,\n },\n};\n\nconst CustomIconNativeAsset = memo(() => {\n const cameraRef = useRef(null);\n const [stateFeatureCollection, setStateFeatureCollection] =\n useState(\n featureCollection([point([-73.970895, 40.723279])]),\n );\n\n const onPress = (e: GeoJSON.Feature) => {\n const aFeature = feature(e.geometry);\n aFeature.id = `${Date.now()}`;\n\n setStateFeatureCollection(\n featureCollection([...stateFeatureCollection.features, aFeature]),\n );\n };\n\n const onSourceLayerPress = (e: any) => {\n console.log(\n 'You pressed a layer here are your features:',\n e.features,\n e.coordinates,\n e.point,\n );\n };\n\n return (\n <>\n \n \n onSourceLayerPress(e)}\n shape={stateFeatureCollection}\n >\n \n \n \n \n \n Tap on Map to add an icon\n \n \n );\n});\n\nexport default CustomIconNativeAsset;\n\n"})}),"\n",(0,o.jsxs)(t.p,{children:[(0,o.jsx)(t.img,{alt:"CustomIconNativeAsset.png",src:n(4364).Z+"",width:"295",height:"640"}),"}"]})]})}function p(e={}){const{wrapper:t}={...(0,a.a)(),...e.components};return t?(0,o.jsx)(t,{...e,children:(0,o.jsx)(m,{...e})}):m(e)}},4364:(e,t,n)=>{n.d(t,{Z:()=>o});const o=n.p+"assets/images/CustomIconNativeAsset-acc92f6e6aae073c2392efd4f3c7c308.png"},1151:(e,t,n)=>{n.d(t,{a:()=>r});var o=n(7294);const a={},s=o.createContext(a);function r(e){const t=o.useContext(s);return o.useMemo((function(){return"function"==typeof e?e(t):{...t,...e}}),[t,e])}}}]); \ No newline at end of file +"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[2852],{3569:(e,t,n)=>{n.r(t),n.d(t,{assets:()=>l,contentTitle:()=>r,default:()=>p,frontMatter:()=>s,metadata:()=>i,toc:()=>c});var o=n(5893),a=n(1151);const s={title:"Custom Icon Native Asset",tags:["ShapeSource","ShapeSource#onPress","SymbolLayer","Images","SymbolLayer#iconImage"],custom_props:{example_rel_path:"SymbolCircleLayer/CustomIconNativeAsset.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/SymbolCircleLayer/CustomIconNativeAsset.tsx"},r=void 0,i={id:"examples/SymbolCircleLayer/CustomIconNativeAsset",title:"Custom Icon Native Asset",description:"Renders a symbol layer with custom icon (native asset) defined using the Images component. Clicking a location on a map add a new icon.",source:"@site/docs/examples/SymbolCircleLayer/CustomIconNativeAsset.md",sourceDirName:"examples/SymbolCircleLayer",slug:"/examples/SymbolCircleLayer/CustomIconNativeAsset",permalink:"/docs/examples/SymbolCircleLayer/CustomIconNativeAsset",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/SymbolCircleLayer/CustomIconNativeAsset.tsx",tags:[{inline:!0,label:"ShapeSource",permalink:"/docs/tags/shape-source"},{inline:!0,label:"ShapeSource#onPress",permalink:"/docs/tags/shape-source-on-press"},{inline:!0,label:"SymbolLayer",permalink:"/docs/tags/symbol-layer"},{inline:!0,label:"Images",permalink:"/docs/tags/images"},{inline:!0,label:"SymbolLayer#iconImage",permalink:"/docs/tags/symbol-layer-icon-image"}],version:"current",frontMatter:{title:"Custom Icon Native Asset",tags:["ShapeSource","ShapeSource#onPress","SymbolLayer","Images","SymbolLayer#iconImage"],custom_props:{example_rel_path:"SymbolCircleLayer/CustomIconNativeAsset.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/SymbolCircleLayer/CustomIconNativeAsset.tsx"},sidebar:"examplesSidebar",previous:{title:"Custom Icon",permalink:"/docs/examples/SymbolCircleLayer/CustomIcon"},next:{title:"Data driven circle colors",permalink:"/docs/examples/SymbolCircleLayer/DataDrivenCircleColors"}},l={},c=[];function m(e){const t={code:"code",img:"img",p:"p",pre:"pre",...(0,a.a)(),...e.components};return(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)(t.p,{children:"Renders a symbol layer with custom icon (native asset) defined using the Images component. Clicking a location on a map add a new icon."}),"\n",(0,o.jsx)(t.pre,{children:(0,o.jsx)(t.code,{className:"language-jsx",children:"import React, { useRef, memo, useState } from 'react';\nimport { Text } from 'react-native';\nimport MapboxGL, {\n MapView,\n Camera,\n ShapeSource,\n SymbolLayer,\n Images,\n} from '@rnmapbox/maps';\nimport { featureCollection, feature, point } from '@turf/helpers';\n\nimport Bubble from '../common/Bubble';\nimport type { ExampleWithMetadata } from '../common/ExampleMetadata';\n\nconst styles = {\n icon: {\n iconImage: 'pin',\n iconAllowOverlap: true,\n },\n};\n\nconst CustomIconNativeAsset = memo(() => {\n const cameraRef = useRef(null);\n const [stateFeatureCollection, setStateFeatureCollection] =\n useState(\n featureCollection([point([-73.970895, 40.723279])]),\n );\n\n const onPress = (e: GeoJSON.Feature) => {\n const aFeature = feature(e.geometry);\n aFeature.id = `${Date.now()}`;\n\n setStateFeatureCollection(\n featureCollection([...stateFeatureCollection.features, aFeature]),\n );\n };\n\n const onSourceLayerPress = (e: any) => {\n console.log(\n 'You pressed a layer here are your features:',\n e.features,\n e.coordinates,\n e.point,\n );\n };\n\n return (\n <>\n \n \n onSourceLayerPress(e)}\n shape={stateFeatureCollection}\n >\n \n \n \n \n \n Tap on Map to add an icon\n \n \n );\n});\n\nexport default CustomIconNativeAsset;\n\n"})}),"\n",(0,o.jsxs)(t.p,{children:[(0,o.jsx)(t.img,{alt:"CustomIconNativeAsset.png",src:n(4364).Z+"",width:"295",height:"640"}),"}"]})]})}function p(e={}){const{wrapper:t}={...(0,a.a)(),...e.components};return t?(0,o.jsx)(t,{...e,children:(0,o.jsx)(m,{...e})}):m(e)}},4364:(e,t,n)=>{n.d(t,{Z:()=>o});const o=n.p+"assets/images/CustomIconNativeAsset-f4861138fd9374123b2eff0c28bde10a.png"},1151:(e,t,n)=>{n.d(t,{a:()=>r});var o=n(7294);const a={},s=o.createContext(a);function r(e){const t=o.useContext(s);return o.useMemo((function(){return"function"==typeof e?e(t):{...t,...e}}),[t,e])}}}]); \ No newline at end of file diff --git a/assets/js/38286337.62c3b28a.js b/assets/js/38286337.a934140e.js similarity index 99% rename from assets/js/38286337.62c3b28a.js rename to assets/js/38286337.a934140e.js index b317c59..a72ef1b 100644 --- a/assets/js/38286337.62c3b28a.js +++ b/assets/js/38286337.a934140e.js @@ -1 +1 @@ -"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[7891],{9925:(e,n,a)=>{a.r(n),a.d(n,{assets:()=>c,contentTitle:()=>i,default:()=>p,frontMatter:()=>o,metadata:()=>r,toc:()=>m});var t=a(5893),s=a(1151);const o={title:"Shape Source Icons",tags:["ShapeSource","SymbolLayer","Images","Images#nativeAssetImages","Images#onImageMissing"],custom_props:{example_rel_path:"SymbolCircleLayer/ShapeSourceIcon.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/SymbolCircleLayer/ShapeSourceIcon.js"},i=void 0,r={id:"examples/SymbolCircleLayer/ShapeSourceIcon",title:"Shape Source Icons",description:"Render icons with various methods.",source:"@site/docs/examples/SymbolCircleLayer/ShapeSourceIcon.md",sourceDirName:"examples/SymbolCircleLayer",slug:"/examples/SymbolCircleLayer/ShapeSourceIcon",permalink:"/docs/examples/SymbolCircleLayer/ShapeSourceIcon",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/SymbolCircleLayer/ShapeSourceIcon.js",tags:[{inline:!0,label:"ShapeSource",permalink:"/docs/tags/shape-source"},{inline:!0,label:"SymbolLayer",permalink:"/docs/tags/symbol-layer"},{inline:!0,label:"Images",permalink:"/docs/tags/images"},{inline:!0,label:"Images#nativeAssetImages",permalink:"/docs/tags/images-native-asset-images"},{inline:!0,label:"Images#onImageMissing",permalink:"/docs/tags/images-on-image-missing"}],version:"current",frontMatter:{title:"Shape Source Icons",tags:["ShapeSource","SymbolLayer","Images","Images#nativeAssetImages","Images#onImageMissing"],custom_props:{example_rel_path:"SymbolCircleLayer/ShapeSourceIcon.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/SymbolCircleLayer/ShapeSourceIcon.js"},sidebar:"examplesSidebar",previous:{title:"Scaleable images",permalink:"/docs/examples/SymbolCircleLayer/ScalableImages"},next:{title:"Custom Native UserLocation",permalink:"/docs/examples/UserLocation/CustomNativeUserLocation"}},c={},m=[];function l(e){const n={code:"code",img:"img",li:"li",p:"p",pre:"pre",ul:"ul",...(0,s.a)(),...e.components};return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(n.p,{children:"Render icons with various methods."}),"\n",(0,t.jsxs)(n.ul,{children:["\n",(0,t.jsx)(n.li,{children:"pin-rn: Rendered with a React Native View"}),"\n",(0,t.jsx)(n.li,{children:"pin: Rendered with a native asset image"}),"\n",(0,t.jsx)(n.li,{children:"pin3: Resolved as a result of onImageMissing"}),"\n",(0,t.jsx)(n.li,{children:"example: Rendered with a js asset image (require)"}),"\n"]}),"\n",(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-jsx",children:"import React from 'react';\nimport {\n MapView,\n Images,\n Camera,\n Image,\n SymbolLayer,\n ShapeSource,\n} from '@rnmapbox/maps';\nimport { Text, View } from 'react-native';\n\nimport exampleIcon from '../../assets/example.png';\nimport pinIcon from '../../assets/pin.png';\n\nconst styles = {\n icon: {\n iconImage: ['get', 'icon'],\n\n iconSize: [\n 'match',\n ['get', 'icon'],\n 'example',\n 1.2,\n 'airport-15',\n 1.2,\n /* default */ 1,\n ],\n iconAllowOverlap: true,\n },\n matchParent: { flex: 1 },\n};\n\nconst featureCollection = {\n type: 'FeatureCollection',\n features: [\n {\n type: 'Feature',\n id: '9d10456e-bdda-4aa9-9269-04c1667d4552',\n properties: {\n icon: 'example',\n },\n geometry: {\n type: 'Point',\n coordinates: [-117.20611157485, 52.180961084261],\n },\n },\n {\n type: 'Feature',\n id: '9d10456e-bdda-4aa9-9269-04c1667d4552',\n properties: {\n icon: 'airport-15',\n },\n geometry: {\n type: 'Point',\n coordinates: [-117.205908, 52.180843],\n },\n },\n {\n type: 'Feature',\n id: '9d10456e-bdda-4aa9-9269-04c1667d4552',\n properties: {\n icon: 'pin',\n },\n geometry: {\n type: 'Point',\n coordinates: [-117.206562, 52.180797],\n },\n },\n {\n type: 'Feature',\n id: '9d10456e-bdda-4aa9-9269-04c1667d4553',\n properties: {\n icon: 'pin3',\n },\n geometry: {\n type: 'Point',\n coordinates: [-117.206862, 52.180897],\n },\n },\n {\n type: 'Feature',\n id: '9d10456e-bdda-4aa9-9269-04c1667d4555',\n properties: {\n icon: 'pin-rn',\n },\n geometry: {\n type: 'Point',\n coordinates: [-117.205862, 52.180697],\n },\n },\n ],\n};\n\nclass ShapeSourceIcon extends React.Component {\n state = {\n images: {\n example: exampleIcon,\n },\n };\n\n render() {\n const { images } = this.state;\n\n return (\n \n \n {\n if (imageKey != 'pin-rn') {\n this.setState({\n images: { ...this.state.images, [imageKey]: pinIcon },\n });\n }\n }}\n >\n \n \n \n \n RN Pin 3\n \n \n \n \n \n \n \n \n \n );\n }\n}\n\nexport default ShapeSourceIcon;\n\n\n"})}),"\n",(0,t.jsxs)(n.p,{children:[(0,t.jsx)(n.img,{alt:"ShapeSourceIcon.png",src:a(4373).Z+"",width:"295",height:"640"}),"}"]})]})}function p(e={}){const{wrapper:n}={...(0,s.a)(),...e.components};return n?(0,t.jsx)(n,{...e,children:(0,t.jsx)(l,{...e})}):l(e)}},4373:(e,n,a)=>{a.d(n,{Z:()=>t});const t=a.p+"assets/images/ShapeSourceIcon-ee6fcc2a8aadc792ec7d172f3c2661c9.png"},1151:(e,n,a)=>{a.d(n,{a:()=>i});var t=a(7294);const s={},o=t.createContext(s);function i(e){const n=t.useContext(o);return t.useMemo((function(){return"function"==typeof e?e(n):{...n,...e}}),[n,e])}}}]); \ No newline at end of file +"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[7891],{9925:(e,n,a)=>{a.r(n),a.d(n,{assets:()=>c,contentTitle:()=>i,default:()=>p,frontMatter:()=>o,metadata:()=>r,toc:()=>m});var t=a(5893),s=a(1151);const o={title:"Shape Source Icons",tags:["ShapeSource","SymbolLayer","Images","Images#nativeAssetImages","Images#onImageMissing"],custom_props:{example_rel_path:"SymbolCircleLayer/ShapeSourceIcon.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/SymbolCircleLayer/ShapeSourceIcon.js"},i=void 0,r={id:"examples/SymbolCircleLayer/ShapeSourceIcon",title:"Shape Source Icons",description:"Render icons with various methods.",source:"@site/docs/examples/SymbolCircleLayer/ShapeSourceIcon.md",sourceDirName:"examples/SymbolCircleLayer",slug:"/examples/SymbolCircleLayer/ShapeSourceIcon",permalink:"/docs/examples/SymbolCircleLayer/ShapeSourceIcon",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/SymbolCircleLayer/ShapeSourceIcon.js",tags:[{inline:!0,label:"ShapeSource",permalink:"/docs/tags/shape-source"},{inline:!0,label:"SymbolLayer",permalink:"/docs/tags/symbol-layer"},{inline:!0,label:"Images",permalink:"/docs/tags/images"},{inline:!0,label:"Images#nativeAssetImages",permalink:"/docs/tags/images-native-asset-images"},{inline:!0,label:"Images#onImageMissing",permalink:"/docs/tags/images-on-image-missing"}],version:"current",frontMatter:{title:"Shape Source Icons",tags:["ShapeSource","SymbolLayer","Images","Images#nativeAssetImages","Images#onImageMissing"],custom_props:{example_rel_path:"SymbolCircleLayer/ShapeSourceIcon.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/SymbolCircleLayer/ShapeSourceIcon.js"},sidebar:"examplesSidebar",previous:{title:"Scaleable images",permalink:"/docs/examples/SymbolCircleLayer/ScalableImages"},next:{title:"Custom Native UserLocation",permalink:"/docs/examples/UserLocation/CustomNativeUserLocation"}},c={},m=[];function l(e){const n={code:"code",img:"img",li:"li",p:"p",pre:"pre",ul:"ul",...(0,s.a)(),...e.components};return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(n.p,{children:"Render icons with various methods."}),"\n",(0,t.jsxs)(n.ul,{children:["\n",(0,t.jsx)(n.li,{children:"pin-rn: Rendered with a React Native View"}),"\n",(0,t.jsx)(n.li,{children:"pin: Rendered with a native asset image"}),"\n",(0,t.jsx)(n.li,{children:"pin3: Resolved as a result of onImageMissing"}),"\n",(0,t.jsx)(n.li,{children:"example: Rendered with a js asset image (require)"}),"\n"]}),"\n",(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-jsx",children:"import React from 'react';\nimport {\n MapView,\n Images,\n Camera,\n Image,\n SymbolLayer,\n ShapeSource,\n} from '@rnmapbox/maps';\nimport { Text, View } from 'react-native';\n\nimport exampleIcon from '../../assets/example.png';\nimport pinIcon from '../../assets/pin.png';\n\nconst styles = {\n icon: {\n iconImage: ['get', 'icon'],\n\n iconSize: [\n 'match',\n ['get', 'icon'],\n 'example',\n 1.2,\n 'airport-15',\n 1.2,\n /* default */ 1,\n ],\n iconAllowOverlap: true,\n },\n matchParent: { flex: 1 },\n};\n\nconst featureCollection = {\n type: 'FeatureCollection',\n features: [\n {\n type: 'Feature',\n id: '9d10456e-bdda-4aa9-9269-04c1667d4552',\n properties: {\n icon: 'example',\n },\n geometry: {\n type: 'Point',\n coordinates: [-117.20611157485, 52.180961084261],\n },\n },\n {\n type: 'Feature',\n id: '9d10456e-bdda-4aa9-9269-04c1667d4552',\n properties: {\n icon: 'airport-15',\n },\n geometry: {\n type: 'Point',\n coordinates: [-117.205908, 52.180843],\n },\n },\n {\n type: 'Feature',\n id: '9d10456e-bdda-4aa9-9269-04c1667d4552',\n properties: {\n icon: 'pin',\n },\n geometry: {\n type: 'Point',\n coordinates: [-117.206562, 52.180797],\n },\n },\n {\n type: 'Feature',\n id: '9d10456e-bdda-4aa9-9269-04c1667d4553',\n properties: {\n icon: 'pin3',\n },\n geometry: {\n type: 'Point',\n coordinates: [-117.206862, 52.180897],\n },\n },\n {\n type: 'Feature',\n id: '9d10456e-bdda-4aa9-9269-04c1667d4555',\n properties: {\n icon: 'pin-rn',\n },\n geometry: {\n type: 'Point',\n coordinates: [-117.205862, 52.180697],\n },\n },\n ],\n};\n\nclass ShapeSourceIcon extends React.Component {\n state = {\n images: {\n example: exampleIcon,\n },\n };\n\n render() {\n const { images } = this.state;\n\n return (\n \n \n {\n if (imageKey != 'pin-rn') {\n this.setState({\n images: { ...this.state.images, [imageKey]: pinIcon },\n });\n }\n }}\n >\n \n \n \n \n RN Pin 3\n \n \n \n \n \n \n \n \n \n );\n }\n}\n\nexport default ShapeSourceIcon;\n\n\n"})}),"\n",(0,t.jsxs)(n.p,{children:[(0,t.jsx)(n.img,{alt:"ShapeSourceIcon.png",src:a(4373).Z+"",width:"295",height:"640"}),"}"]})]})}function p(e={}){const{wrapper:n}={...(0,s.a)(),...e.components};return n?(0,t.jsx)(n,{...e,children:(0,t.jsx)(l,{...e})}):l(e)}},4373:(e,n,a)=>{a.d(n,{Z:()=>t});const t=a.p+"assets/images/ShapeSourceIcon-80996c858c16119b0cc36718b0ad87bf.png"},1151:(e,n,a)=>{a.d(n,{a:()=>i});var t=a(7294);const s={},o=t.createContext(s);function i(e){const n=t.useContext(o);return t.useMemo((function(){return"function"==typeof e?e(n):{...n,...e}}),[n,e])}}}]); \ No newline at end of file diff --git a/assets/js/3a4d34a4.1476b1b3.js b/assets/js/3a4d34a4.4ec9a8cb.js similarity index 98% rename from assets/js/3a4d34a4.1476b1b3.js rename to assets/js/3a4d34a4.4ec9a8cb.js index 8af077f..ddd49a6 100644 --- a/assets/js/3a4d34a4.1476b1b3.js +++ b/assets/js/3a4d34a4.4ec9a8cb.js @@ -1 +1 @@ -"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[100],{312:(e,n,t)=>{t.r(n),t.d(n,{assets:()=>l,contentTitle:()=>o,default:()=>c,frontMatter:()=>r,metadata:()=>i,toc:()=>p});var s=t(5893),a=t(1151);const r={title:"Map Handlers",tags:["MapView#onMapIdle"],custom_props:{example_rel_path:"V10/MapHandlers.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/V10/MapHandlers.tsx"},o=void 0,i={id:"examples/V10/MapHandlers",title:"Map Handlers",description:"Map Handlers",source:"@site/docs/examples/V10/MapHandlers.md",sourceDirName:"examples/V10",slug:"/examples/V10/MapHandlers",permalink:"/docs/examples/V10/MapHandlers",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/V10/MapHandlers.tsx",tags:[{inline:!0,label:"MapView#onMapIdle",permalink:"/docs/tags/map-view-on-map-idle"}],version:"current",frontMatter:{title:"Map Handlers",tags:["MapView#onMapIdle"],custom_props:{example_rel_path:"V10/MapHandlers.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/V10/MapHandlers.tsx"},sidebar:"examplesSidebar",previous:{title:"Globe Projection",permalink:"/docs/examples/V10/GlobeProjection"},next:{title:"Markers",permalink:"/docs/examples/V10/Markers"}},l={},p=[];function d(e){const n={code:"code",img:"img",p:"p",pre:"pre",...(0,a.a)(),...e.components};return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(n.p,{children:"Map Handlers"}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-jsx",children:"import { Divider, Text } from '@rneui/base';\nimport {\n Camera,\n CircleLayer,\n Logger,\n MapState,\n MapView,\n ShapeSource,\n} from '@rnmapbox/maps';\nimport {\n Feature,\n GeoJsonProperties,\n Geometry,\n Point,\n Polygon,\n Position,\n} from 'geojson';\nimport React, { useState } from 'react';\nimport { SafeAreaView, View } from 'react-native';\n\nimport colors from '../../styles/colors';\nimport { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc\n\nLogger.setLogLevel('verbose');\n\nconst styles = {\n map: {\n flex: 1,\n },\n info: {\n flex: 0,\n padding: 10,\n },\n divider: {\n marginVertical: 6,\n },\n fadedText: {\n color: 'gray',\n },\n};\n\nconst MapHandlers = () => {\n const [lastCallback, setLastCallback] = useState('');\n const [mapState, setMapState] = useState({\n properties: {\n center: [0, 0],\n bounds: {\n ne: [0, 0],\n sw: [0, 0],\n },\n zoom: 0,\n heading: 0,\n pitch: 0,\n },\n gestures: {\n isGestureActive: false,\n },\n });\n const [features, setFeatures] = useState[]>([]);\n\n const properties = mapState?.properties;\n const center = properties?.center;\n const bounds = properties?.bounds;\n const heading = properties?.heading;\n const gestures = mapState?.gestures;\n\n const buildShape = (feature: Feature): Geometry => {\n return {\n type: 'Point',\n coordinates: (feature as Feature).geometry.coordinates,\n };\n };\n\n const addFeature = (feature: Feature, kind: string) => {\n const _feature: Feature = { ...feature };\n if (_feature.properties) {\n _feature.properties.kind = kind;\n }\n setFeatures((prev) => [...prev, _feature]);\n };\n\n const displayCoord = (position: Position) => {\n if (!position) {\n return '';\n }\n return `${position[1].toFixed(3)}, ${position[0].toFixed(3)}`;\n };\n\n return (\n <>\n ) => {\n addFeature(_feature, 'press');\n }}\n onLongPress={(_feature: Feature) => {\n addFeature(_feature, 'longPress');\n }}\n onCameraChanged={(_state) => {\n setLastCallback('onCameraChanged');\n setMapState(_state);\n }}\n onMapIdle={(_state) => {\n setLastCallback('onMapIdle');\n setMapState(_state);\n }}\n >\n \n {features.map((f, i) => {\n const id = JSON.stringify(\n (f as Feature).geometry.coordinates,\n );\n const circleStyle =\n f.properties?.kind === 'press'\n ? {\n circleColor: colors.primary.blue,\n circleRadius: 6,\n }\n : {\n circleColor: colors.primary.pink,\n circleRadius: 12,\n };\n return (\n \n \n \n );\n })}\n \n\n \n \n \n Tap or long-press to create a marker.\n \n\n \n\n center\n {displayCoord(center)}\n\n \n\n bounds\n NE: {displayCoord(bounds?.ne)}\n SW: {displayCoord(bounds?.sw)}\n\n \n\n heading\n {heading?.toFixed(2)}\n\n \n\n lastCallback\n {lastCallback}\n\n \n\n \n \n isGestureActive\n {gestures?.isGestureActive ? 'Yes' : 'No'}\n \n \n \n \n \n );\n};\n\nexport default MapHandlers;\n\n\n"})}),"\n",(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.img,{alt:"MapHandlers.png",src:t(5802).Z+"",width:"295",height:"640"}),"}"]})]})}function c(e={}){const{wrapper:n}={...(0,a.a)(),...e.components};return n?(0,s.jsx)(n,{...e,children:(0,s.jsx)(d,{...e})}):d(e)}},5802:(e,n,t)=>{t.d(n,{Z:()=>s});const s=t.p+"assets/images/MapHandlers-6e0beabf88ef393478ec96930e56a12a.png"},1151:(e,n,t)=>{t.d(n,{a:()=>o});var s=t(7294);const a={},r=s.createContext(a);function o(e){const n=s.useContext(r);return s.useMemo((function(){return"function"==typeof e?e(n):{...n,...e}}),[n,e])}}}]); \ No newline at end of file +"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[100],{312:(e,n,t)=>{t.r(n),t.d(n,{assets:()=>l,contentTitle:()=>o,default:()=>c,frontMatter:()=>r,metadata:()=>i,toc:()=>p});var s=t(5893),a=t(1151);const r={title:"Map Handlers",tags:["MapView#onMapIdle"],custom_props:{example_rel_path:"V10/MapHandlers.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/V10/MapHandlers.tsx"},o=void 0,i={id:"examples/V10/MapHandlers",title:"Map Handlers",description:"Map Handlers",source:"@site/docs/examples/V10/MapHandlers.md",sourceDirName:"examples/V10",slug:"/examples/V10/MapHandlers",permalink:"/docs/examples/V10/MapHandlers",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/V10/MapHandlers.tsx",tags:[{inline:!0,label:"MapView#onMapIdle",permalink:"/docs/tags/map-view-on-map-idle"}],version:"current",frontMatter:{title:"Map Handlers",tags:["MapView#onMapIdle"],custom_props:{example_rel_path:"V10/MapHandlers.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/V10/MapHandlers.tsx"},sidebar:"examplesSidebar",previous:{title:"Globe Projection",permalink:"/docs/examples/V10/GlobeProjection"},next:{title:"Markers",permalink:"/docs/examples/V10/Markers"}},l={},p=[];function d(e){const n={code:"code",img:"img",p:"p",pre:"pre",...(0,a.a)(),...e.components};return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(n.p,{children:"Map Handlers"}),"\n",(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-jsx",children:"import { Divider, Text } from '@rneui/base';\nimport {\n Camera,\n CircleLayer,\n Logger,\n MapState,\n MapView,\n ShapeSource,\n} from '@rnmapbox/maps';\nimport {\n Feature,\n GeoJsonProperties,\n Geometry,\n Point,\n Polygon,\n Position,\n} from 'geojson';\nimport React, { useState } from 'react';\nimport { SafeAreaView, View } from 'react-native';\n\nimport colors from '../../styles/colors';\nimport { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc\n\nLogger.setLogLevel('verbose');\n\nconst styles = {\n map: {\n flex: 1,\n },\n info: {\n flex: 0,\n padding: 10,\n },\n divider: {\n marginVertical: 6,\n },\n fadedText: {\n color: 'gray',\n },\n};\n\nconst MapHandlers = () => {\n const [lastCallback, setLastCallback] = useState('');\n const [mapState, setMapState] = useState({\n properties: {\n center: [0, 0],\n bounds: {\n ne: [0, 0],\n sw: [0, 0],\n },\n zoom: 0,\n heading: 0,\n pitch: 0,\n },\n gestures: {\n isGestureActive: false,\n },\n });\n const [features, setFeatures] = useState[]>([]);\n\n const properties = mapState?.properties;\n const center = properties?.center;\n const bounds = properties?.bounds;\n const heading = properties?.heading;\n const gestures = mapState?.gestures;\n\n const buildShape = (feature: Feature): Geometry => {\n return {\n type: 'Point',\n coordinates: (feature as Feature).geometry.coordinates,\n };\n };\n\n const addFeature = (feature: Feature, kind: string) => {\n const _feature: Feature = { ...feature };\n if (_feature.properties) {\n _feature.properties.kind = kind;\n }\n setFeatures((prev) => [...prev, _feature]);\n };\n\n const displayCoord = (position: Position) => {\n if (!position) {\n return '';\n }\n return `${position[1].toFixed(3)}, ${position[0].toFixed(3)}`;\n };\n\n return (\n <>\n ) => {\n addFeature(_feature, 'press');\n }}\n onLongPress={(_feature: Feature) => {\n addFeature(_feature, 'longPress');\n }}\n onCameraChanged={(_state) => {\n setLastCallback('onCameraChanged');\n setMapState(_state);\n }}\n onMapIdle={(_state) => {\n setLastCallback('onMapIdle');\n setMapState(_state);\n }}\n >\n \n {features.map((f, i) => {\n const id = JSON.stringify(\n (f as Feature).geometry.coordinates,\n );\n const circleStyle =\n f.properties?.kind === 'press'\n ? {\n circleColor: colors.primary.blue,\n circleRadius: 6,\n }\n : {\n circleColor: colors.primary.pink,\n circleRadius: 12,\n };\n return (\n \n \n \n );\n })}\n \n\n \n \n \n Tap or long-press to create a marker.\n \n\n \n\n center\n {displayCoord(center)}\n\n \n\n bounds\n NE: {displayCoord(bounds?.ne)}\n SW: {displayCoord(bounds?.sw)}\n\n \n\n heading\n {heading?.toFixed(2)}\n\n \n\n lastCallback\n {lastCallback}\n\n \n\n \n \n isGestureActive\n {gestures?.isGestureActive ? 'Yes' : 'No'}\n \n \n \n \n \n );\n};\n\nexport default MapHandlers;\n\n\n"})}),"\n",(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.img,{alt:"MapHandlers.png",src:t(5802).Z+"",width:"295",height:"640"}),"}"]})]})}function c(e={}){const{wrapper:n}={...(0,a.a)(),...e.components};return n?(0,s.jsx)(n,{...e,children:(0,s.jsx)(d,{...e})}):d(e)}},5802:(e,n,t)=>{t.d(n,{Z:()=>s});const s=t.p+"assets/images/MapHandlers-ab143930c90d76bc1195d7fa0184dddf.png"},1151:(e,n,t)=>{t.d(n,{a:()=>o});var s=t(7294);const a={},r=s.createContext(a);function o(e){const n=s.useContext(r);return s.useMemo((function(){return"function"==typeof e?e(n):{...n,...e}}),[n,e])}}}]); \ No newline at end of file diff --git a/assets/js/3e686edc.a65e4e2e.js b/assets/js/3e686edc.6209abbe.js similarity index 98% rename from assets/js/3e686edc.a65e4e2e.js rename to assets/js/3e686edc.6209abbe.js index 0b65180..88d2661 100644 --- a/assets/js/3e686edc.a65e4e2e.js +++ b/assets/js/3e686edc.6209abbe.js @@ -1 +1 @@ -"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[6216],{3834:(n,t,e)=>{e.r(t),e.d(t,{assets:()=>l,contentTitle:()=>r,default:()=>m,frontMatter:()=>i,metadata:()=>s,toc:()=>p});var o=e(5893),a=e(1151);const i={title:"Marker View",tags:["PointAnnotation","MarkerView"],custom_props:{example_rel_path:"Annotations/MarkerView.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Annotations/MarkerView.tsx"},r=void 0,s={id:"examples/Annotations/MarkerView",title:"Marker View",description:"Shows marker view and poitn annotations",source:"@site/docs/examples/Annotations/MarkerView.md",sourceDirName:"examples/Annotations",slug:"/examples/Annotations/MarkerView",permalink:"/docs/examples/Annotations/MarkerView",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Annotations/MarkerView.tsx",tags:[{inline:!0,label:"PointAnnotation",permalink:"/docs/tags/point-annotation"},{inline:!0,label:"MarkerView",permalink:"/docs/tags/marker-view"}],version:"current",frontMatter:{title:"Marker View",tags:["PointAnnotation","MarkerView"],custom_props:{example_rel_path:"Annotations/MarkerView.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Annotations/MarkerView.tsx"},sidebar:"examplesSidebar",previous:{title:"Heatmap",permalink:"/docs/examples/Annotations/Heatmap"},next:{title:"Point Annotation Anchors",permalink:"/docs/examples/Annotations/PointAnnotationAnchors"}},l={},p=[];function c(n){const t={code:"code",img:"img",p:"p",pre:"pre",...(0,a.a)(),...n.components};return(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)(t.p,{children:"Shows marker view and poitn annotations"}),"\n",(0,o.jsx)(t.pre,{children:(0,o.jsx)(t.code,{className:"language-jsx",children:"import React from 'react';\nimport { Button, StyleSheet, View, Text, TouchableOpacity } from 'react-native';\nimport Mapbox from '@rnmapbox/maps';\n\nimport Bubble from '../common/Bubble';\n\nconst styles = StyleSheet.create({\n touchableContainer: { borderColor: 'black', borderWidth: 1.0, width: 60 },\n touchable: {\n backgroundColor: 'blue',\n width: 40,\n height: 40,\n borderRadius: 20,\n alignItems: 'center',\n justifyContent: 'center',\n },\n touchableText: {\n color: 'white',\n fontWeight: 'bold',\n },\n matchParent: { flex: 1 },\n});\n\nconst AnnotationContent = ({ title }: { title: string }) => (\n \n {title}\n \n Btn\n \n \n);\nconst INITIAL_COORDINATES: [number, number][] = [\n [-73.99155, 40.73581],\n [-73.99155, 40.73681],\n];\n\nconst ShowMarkerView = () => {\n const [pointList, setPointList] =\n React.useState(INITIAL_COORDINATES);\n const [allowOverlapWithPuck, setAllowOverlapWithPuck] =\n React.useState(false);\n\n const onPressMap = (e: GeoJSON.Feature) => {\n const geometry = e.geometry as GeoJSON.Point;\n setPointList((pl) => [...pl, geometry.coordinates]);\n };\n\n return (\n <>\n setAllowOverlapWithPuck((prev) => !prev)}\n />\n \n \n\n \n \n \n\n \n \n \n\n {pointList.slice(2).map((coordinate, index) => (\n \n \n \n ))}\n\n \n \n\n \n Tap on map to add a point annotation\n \n \n );\n};\n\nexport default ShowMarkerView;\n\n\n"})}),"\n",(0,o.jsxs)(t.p,{children:[(0,o.jsx)(t.img,{alt:"MarkerView.png",src:e(7971).Z+"",width:"295",height:"640"}),"}"]})]})}function m(n={}){const{wrapper:t}={...(0,a.a)(),...n.components};return t?(0,o.jsx)(t,{...n,children:(0,o.jsx)(c,{...n})}):c(n)}},7971:(n,t,e)=>{e.d(t,{Z:()=>o});const o=e.p+"assets/images/MarkerView-6c19b0708ffb8daa8ab820afb0d1fa2a.png"},1151:(n,t,e)=>{e.d(t,{a:()=>r});var o=e(7294);const a={},i=o.createContext(a);function r(n){const t=o.useContext(i);return o.useMemo((function(){return"function"==typeof n?n(t):{...t,...n}}),[t,n])}}}]); \ No newline at end of file +"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[6216],{3834:(n,t,e)=>{e.r(t),e.d(t,{assets:()=>l,contentTitle:()=>r,default:()=>m,frontMatter:()=>i,metadata:()=>s,toc:()=>p});var o=e(5893),a=e(1151);const i={title:"Marker View",tags:["PointAnnotation","MarkerView"],custom_props:{example_rel_path:"Annotations/MarkerView.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Annotations/MarkerView.tsx"},r=void 0,s={id:"examples/Annotations/MarkerView",title:"Marker View",description:"Shows marker view and poitn annotations",source:"@site/docs/examples/Annotations/MarkerView.md",sourceDirName:"examples/Annotations",slug:"/examples/Annotations/MarkerView",permalink:"/docs/examples/Annotations/MarkerView",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Annotations/MarkerView.tsx",tags:[{inline:!0,label:"PointAnnotation",permalink:"/docs/tags/point-annotation"},{inline:!0,label:"MarkerView",permalink:"/docs/tags/marker-view"}],version:"current",frontMatter:{title:"Marker View",tags:["PointAnnotation","MarkerView"],custom_props:{example_rel_path:"Annotations/MarkerView.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Annotations/MarkerView.tsx"},sidebar:"examplesSidebar",previous:{title:"Heatmap",permalink:"/docs/examples/Annotations/Heatmap"},next:{title:"Point Annotation Anchors",permalink:"/docs/examples/Annotations/PointAnnotationAnchors"}},l={},p=[];function c(n){const t={code:"code",img:"img",p:"p",pre:"pre",...(0,a.a)(),...n.components};return(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)(t.p,{children:"Shows marker view and poitn annotations"}),"\n",(0,o.jsx)(t.pre,{children:(0,o.jsx)(t.code,{className:"language-jsx",children:"import React from 'react';\nimport { Button, StyleSheet, View, Text, TouchableOpacity } from 'react-native';\nimport Mapbox from '@rnmapbox/maps';\n\nimport Bubble from '../common/Bubble';\n\nconst styles = StyleSheet.create({\n touchableContainer: { borderColor: 'black', borderWidth: 1.0, width: 60 },\n touchable: {\n backgroundColor: 'blue',\n width: 40,\n height: 40,\n borderRadius: 20,\n alignItems: 'center',\n justifyContent: 'center',\n },\n touchableText: {\n color: 'white',\n fontWeight: 'bold',\n },\n matchParent: { flex: 1 },\n});\n\nconst AnnotationContent = ({ title }: { title: string }) => (\n \n {title}\n \n Btn\n \n \n);\nconst INITIAL_COORDINATES: [number, number][] = [\n [-73.99155, 40.73581],\n [-73.99155, 40.73681],\n];\n\nconst ShowMarkerView = () => {\n const [pointList, setPointList] =\n React.useState(INITIAL_COORDINATES);\n const [allowOverlapWithPuck, setAllowOverlapWithPuck] =\n React.useState(false);\n\n const onPressMap = (e: GeoJSON.Feature) => {\n const geometry = e.geometry as GeoJSON.Point;\n setPointList((pl) => [...pl, geometry.coordinates]);\n };\n\n return (\n <>\n setAllowOverlapWithPuck((prev) => !prev)}\n />\n \n \n\n \n \n \n\n \n \n \n\n {pointList.slice(2).map((coordinate, index) => (\n \n \n \n ))}\n\n \n \n\n \n Tap on map to add a point annotation\n \n \n );\n};\n\nexport default ShowMarkerView;\n\n\n"})}),"\n",(0,o.jsxs)(t.p,{children:[(0,o.jsx)(t.img,{alt:"MarkerView.png",src:e(7971).Z+"",width:"295",height:"640"}),"}"]})]})}function m(n={}){const{wrapper:t}={...(0,a.a)(),...n.components};return t?(0,o.jsx)(t,{...n,children:(0,o.jsx)(c,{...n})}):c(n)}},7971:(n,t,e)=>{e.d(t,{Z:()=>o});const o=e.p+"assets/images/MarkerView-86458f0690c4b61f14a7d6ad65b81fc5.png"},1151:(n,t,e)=>{e.d(t,{a:()=>r});var o=e(7294);const a={},i=o.createContext(a);function r(n){const t=o.useContext(i);return o.useMemo((function(){return"function"==typeof n?n(t):{...t,...n}}),[t,n])}}}]); \ No newline at end of file diff --git a/assets/js/496ac0ab.8368532b.js b/assets/js/496ac0ab.2ef8d523.js similarity index 96% rename from assets/js/496ac0ab.8368532b.js rename to assets/js/496ac0ab.2ef8d523.js index cdf3c77..4ce0bd1 100644 --- a/assets/js/496ac0ab.8368532b.js +++ b/assets/js/496ac0ab.2ef8d523.js @@ -1 +1 @@ -"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[7774],{6007:(e,t,n)=>{n.r(t),n.d(t,{assets:()=>c,contentTitle:()=>i,default:()=>m,frontMatter:()=>a,metadata:()=>r,toc:()=>l});var s=n(5893),o=n(1151);const a={title:"Show Click",tags:["MapView#onPress"],custom_props:{example_rel_path:"Map/ShowClick.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/ShowClick.js"},i=void 0,r={id:"examples/Map/ShowClick",title:"Show Click",description:"Demonstates onPress event and how to get the screen point of the click.",source:"@site/docs/examples/Map/ShowClick.md",sourceDirName:"examples/Map",slug:"/examples/Map/ShowClick",permalink:"/docs/examples/Map/ShowClick",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/ShowClick.js",tags:[{inline:!0,label:"MapView#onPress",permalink:"/docs/tags/map-view-on-press"}],version:"current",frontMatter:{title:"Show Click",tags:["MapView#onPress"],custom_props:{example_rel_path:"Map/ShowClick.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/ShowClick.js"},sidebar:"examplesSidebar",previous:{title:"Show and hide layer",permalink:"/docs/examples/Map/ShowAndHideLayer"},next:{title:"Show Map",permalink:"/docs/examples/Map/ShowMap"}},c={},l=[];function p(e){const t={code:"code",img:"img",p:"p",pre:"pre",...(0,o.a)(),...e.components};return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(t.p,{children:"Demonstates onPress event and how to get the screen point of the click."}),"\n",(0,s.jsx)(t.pre,{children:(0,s.jsx)(t.code,{className:"language-jsx",children:"import React from 'react';\nimport { Text } from 'react-native';\nimport { MapView, Camera } from '@rnmapbox/maps';\n\nimport Bubble from '../common/Bubble';\n\nconst styles = { matchParent: { flex: 1 } };\n\nclass ShowClick extends React.Component {\n constructor(props) {\n super(props);\n\n this.state = {\n latitude: undefined,\n longitude: undefined,\n screenPointX: undefined,\n screenPointY: undefined,\n };\n\n this.onPress = this.onPress.bind(this);\n }\n\n get hasValidLastClick() {\n return (\n typeof this.state.latitude === 'number' &&\n typeof this.state.longitude === 'number'\n );\n }\n\n onPress(event) {\n const { geometry, properties } = event;\n\n this.setState({\n latitude: geometry.coordinates[1],\n longitude: geometry.coordinates[0],\n screenPointX: properties.screenPointX,\n screenPointY: properties.screenPointY,\n });\n }\n\n renderLastClicked() {\n if (!this.hasValidLastClick) {\n return (\n \n Click the map!\n \n );\n }\n\n return (\n \n \n Latitude: {this.state.latitude}\n \n \n Longitude: {this.state.longitude}\n \n Screen Point X: {this.state.screenPointX}\n Screen Point Y: {this.state.screenPointY}\n \n );\n }\n\n render() {\n return (\n <>\n \n \n \n {this.renderLastClicked()}\n \n );\n }\n}\n\nexport default ShowClick;\n\n\n"})}),"\n",(0,s.jsxs)(t.p,{children:[(0,s.jsx)(t.img,{alt:"ShowClick.png",src:n(7820).Z+"",width:"295",height:"640"}),"}"]})]})}function m(e={}){const{wrapper:t}={...(0,o.a)(),...e.components};return t?(0,s.jsx)(t,{...e,children:(0,s.jsx)(p,{...e})}):p(e)}},7820:(e,t,n)=>{n.d(t,{Z:()=>s});const s=n.p+"assets/images/ShowClick-0a2b4662ddf339e372d1ac5698bc41a8.png"},1151:(e,t,n)=>{n.d(t,{a:()=>i});var s=n(7294);const o={},a=s.createContext(o);function i(e){const t=s.useContext(a);return s.useMemo((function(){return"function"==typeof e?e(t):{...t,...e}}),[t,e])}}}]); \ No newline at end of file +"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[7774],{6007:(e,t,n)=>{n.r(t),n.d(t,{assets:()=>c,contentTitle:()=>i,default:()=>m,frontMatter:()=>a,metadata:()=>r,toc:()=>l});var s=n(5893),o=n(1151);const a={title:"Show Click",tags:["MapView#onPress"],custom_props:{example_rel_path:"Map/ShowClick.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/ShowClick.js"},i=void 0,r={id:"examples/Map/ShowClick",title:"Show Click",description:"Demonstates onPress event and how to get the screen point of the click.",source:"@site/docs/examples/Map/ShowClick.md",sourceDirName:"examples/Map",slug:"/examples/Map/ShowClick",permalink:"/docs/examples/Map/ShowClick",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/ShowClick.js",tags:[{inline:!0,label:"MapView#onPress",permalink:"/docs/tags/map-view-on-press"}],version:"current",frontMatter:{title:"Show Click",tags:["MapView#onPress"],custom_props:{example_rel_path:"Map/ShowClick.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/ShowClick.js"},sidebar:"examplesSidebar",previous:{title:"Show and hide layer",permalink:"/docs/examples/Map/ShowAndHideLayer"},next:{title:"Show Map",permalink:"/docs/examples/Map/ShowMap"}},c={},l=[];function p(e){const t={code:"code",img:"img",p:"p",pre:"pre",...(0,o.a)(),...e.components};return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(t.p,{children:"Demonstates onPress event and how to get the screen point of the click."}),"\n",(0,s.jsx)(t.pre,{children:(0,s.jsx)(t.code,{className:"language-jsx",children:"import React from 'react';\nimport { Text } from 'react-native';\nimport { MapView, Camera } from '@rnmapbox/maps';\n\nimport Bubble from '../common/Bubble';\n\nconst styles = { matchParent: { flex: 1 } };\n\nclass ShowClick extends React.Component {\n constructor(props) {\n super(props);\n\n this.state = {\n latitude: undefined,\n longitude: undefined,\n screenPointX: undefined,\n screenPointY: undefined,\n };\n\n this.onPress = this.onPress.bind(this);\n }\n\n get hasValidLastClick() {\n return (\n typeof this.state.latitude === 'number' &&\n typeof this.state.longitude === 'number'\n );\n }\n\n onPress(event) {\n const { geometry, properties } = event;\n\n this.setState({\n latitude: geometry.coordinates[1],\n longitude: geometry.coordinates[0],\n screenPointX: properties.screenPointX,\n screenPointY: properties.screenPointY,\n });\n }\n\n renderLastClicked() {\n if (!this.hasValidLastClick) {\n return (\n \n Click the map!\n \n );\n }\n\n return (\n \n \n Latitude: {this.state.latitude}\n \n \n Longitude: {this.state.longitude}\n \n Screen Point X: {this.state.screenPointX}\n Screen Point Y: {this.state.screenPointY}\n \n );\n }\n\n render() {\n return (\n <>\n \n \n \n {this.renderLastClicked()}\n \n );\n }\n}\n\nexport default ShowClick;\n\n\n"})}),"\n",(0,s.jsxs)(t.p,{children:[(0,s.jsx)(t.img,{alt:"ShowClick.png",src:n(7820).Z+"",width:"295",height:"640"}),"}"]})]})}function m(e={}){const{wrapper:t}={...(0,o.a)(),...e.components};return t?(0,s.jsx)(t,{...e,children:(0,s.jsx)(p,{...e})}):p(e)}},7820:(e,t,n)=>{n.d(t,{Z:()=>s});const s=n.p+"assets/images/ShowClick-502607fb8ab6b2a4d75f394473df743f.png"},1151:(e,t,n)=>{n.d(t,{a:()=>i});var s=n(7294);const o={},a=s.createContext(o);function i(e){const t=s.useContext(a);return s.useMemo((function(){return"function"==typeof e?e(t):{...t,...e}}),[t,e])}}}]); \ No newline at end of file diff --git a/assets/js/4ce86281.32a18e50.js b/assets/js/4ce86281.9c5629b5.js similarity index 98% rename from assets/js/4ce86281.32a18e50.js rename to assets/js/4ce86281.9c5629b5.js index ddf29ac..929aa9b 100644 --- a/assets/js/4ce86281.32a18e50.js +++ b/assets/js/4ce86281.9c5629b5.js @@ -1 +1 @@ -"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[3316],{3009:(e,n,t)=>{t.r(n),t.d(n,{assets:()=>l,contentTitle:()=>a,default:()=>m,frontMatter:()=>o,metadata:()=>i,toc:()=>c});var s=t(5893),r=t(1151);const o={title:"Query Features Bounding Box",tags:[],custom_props:{example_rel_path:"FillRasterLayer/QueryWithRect.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/QueryWithRect.js"},a=void 0,i={id:"examples/FillRasterLayer/QueryWithRect",title:"Query Features Bounding Box",description:"QueryWithRect.png}",source:"@site/docs/examples/FillRasterLayer/QueryWithRect.md",sourceDirName:"examples/FillRasterLayer",slug:"/examples/FillRasterLayer/QueryWithRect",permalink:"/docs/examples/FillRasterLayer/QueryWithRect",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/QueryWithRect.js",tags:[],version:"current",frontMatter:{title:"Query Features Bounding Box",tags:[],custom_props:{example_rel_path:"FillRasterLayer/QueryWithRect.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/QueryWithRect.js"},sidebar:"examplesSidebar",previous:{title:"Query Source Features",permalink:"/docs/examples/FillRasterLayer/QuerySourceFeatures"},next:{title:"Raster Source",permalink:"/docs/examples/FillRasterLayer/RasterSource"}},l={},c=[];function p(e){const n={code:"code",img:"img",p:"p",pre:"pre",...(0,r.a)(),...e.components};return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-jsx",children:"import React from 'react';\nimport { Text } from 'react-native';\nimport MapboxGL from '@rnmapbox/maps';\n\nimport sheet from '../../styles/sheet';\nimport nycJSON from '../../assets/nyc_geojson.json';\nimport BaseExamplePropTypes from '../common/BaseExamplePropTypes';\nimport Page from '../common/Page';\nimport Bubble from '../common/Bubble';\n\nconst styles = {\n neighborhoods: {\n fillAntialias: true,\n fillColor: 'blue',\n fillOutlineColor: 'black',\n fillOpacity: 0.84,\n },\n selectedNeighborhoods: {\n fillAntialias: true,\n fillColor: 'green',\n fillOpacity: 0.84,\n },\n bubbleText: { textAlign: 'center' },\n};\n\nclass QueryWithRect extends React.Component {\n static propTypes = {\n ...BaseExamplePropTypes,\n };\n\n constructor(props) {\n super(props);\n\n this.state = {\n screenCoords: [],\n selectedGeoJSON: null,\n };\n\n this.onPress = this.onPress.bind(this);\n }\n\n async onPress(e) {\n const { screenPointX, screenPointY } = e.properties;\n\n const screenCoords = Object.assign([], this.state.screenCoords);\n screenCoords.push([screenPointX, screenPointY]);\n\n if (screenCoords.length === 2) {\n const featureCollection = await this._map.queryRenderedFeaturesInRect(\n this.getBoundingBox(screenCoords),\n null,\n ['nycFill'],\n );\n\n this.setState({\n screenCoords: [],\n selectedGeoJSON: featureCollection.features.length\n ? featureCollection\n : null,\n });\n } else {\n this.setState({ screenCoords });\n }\n }\n\n getBoundingBox(screenCoords) {\n const maxX = Math.max(screenCoords[0][0], screenCoords[1][0]);\n const minX = Math.min(screenCoords[0][0], screenCoords[1][0]);\n const maxY = Math.max(screenCoords[0][1], screenCoords[1][1]);\n const minY = Math.min(screenCoords[0][1], screenCoords[1][1]);\n // Rect -> [top, right, bottom, left]\n return [minY, maxX, maxY, minX];\n }\n\n get message() {\n if (this.state.screenCoords.length === 1) {\n return 'Press in one more location to close the rect';\n }\n return 'Press in two different locations to form a rect to query with';\n }\n\n render() {\n return (\n \n (this._map = c)}\n onPress={this.onPress}\n style={sheet.matchParent}\n styleURL={MapboxGL.StyleURL.Light}\n >\n \n\n \n \n \n\n {this.state.selectedGeoJSON ? (\n \n \n \n ) : null}\n \n\n \n {this.message}\n \n \n );\n }\n}\n\nexport default QueryWithRect;\n\n\n"})}),"\n",(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.img,{alt:"QueryWithRect.png",src:t(4706).Z+"",width:"295",height:"640"}),"}"]})]})}function m(e={}){const{wrapper:n}={...(0,r.a)(),...e.components};return n?(0,s.jsx)(n,{...e,children:(0,s.jsx)(p,{...e})}):p(e)}},4706:(e,n,t)=>{t.d(n,{Z:()=>s});const s=t.p+"assets/images/QueryWithRect-703c72919e231d78016e01aedb3b9335.png"},1151:(e,n,t)=>{t.d(n,{a:()=>a});var s=t(7294);const r={},o=s.createContext(r);function a(e){const n=s.useContext(o);return s.useMemo((function(){return"function"==typeof e?e(n):{...n,...e}}),[n,e])}}}]); \ No newline at end of file +"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[3316],{3009:(e,n,t)=>{t.r(n),t.d(n,{assets:()=>l,contentTitle:()=>a,default:()=>m,frontMatter:()=>o,metadata:()=>i,toc:()=>c});var s=t(5893),r=t(1151);const o={title:"Query Features Bounding Box",tags:[],custom_props:{example_rel_path:"FillRasterLayer/QueryWithRect.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/QueryWithRect.js"},a=void 0,i={id:"examples/FillRasterLayer/QueryWithRect",title:"Query Features Bounding Box",description:"QueryWithRect.png}",source:"@site/docs/examples/FillRasterLayer/QueryWithRect.md",sourceDirName:"examples/FillRasterLayer",slug:"/examples/FillRasterLayer/QueryWithRect",permalink:"/docs/examples/FillRasterLayer/QueryWithRect",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/QueryWithRect.js",tags:[],version:"current",frontMatter:{title:"Query Features Bounding Box",tags:[],custom_props:{example_rel_path:"FillRasterLayer/QueryWithRect.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/QueryWithRect.js"},sidebar:"examplesSidebar",previous:{title:"Query Source Features",permalink:"/docs/examples/FillRasterLayer/QuerySourceFeatures"},next:{title:"Raster Source",permalink:"/docs/examples/FillRasterLayer/RasterSource"}},l={},c=[];function p(e){const n={code:"code",img:"img",p:"p",pre:"pre",...(0,r.a)(),...e.components};return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(n.pre,{children:(0,s.jsx)(n.code,{className:"language-jsx",children:"import React from 'react';\nimport { Text } from 'react-native';\nimport MapboxGL from '@rnmapbox/maps';\n\nimport sheet from '../../styles/sheet';\nimport nycJSON from '../../assets/nyc_geojson.json';\nimport BaseExamplePropTypes from '../common/BaseExamplePropTypes';\nimport Page from '../common/Page';\nimport Bubble from '../common/Bubble';\n\nconst styles = {\n neighborhoods: {\n fillAntialias: true,\n fillColor: 'blue',\n fillOutlineColor: 'black',\n fillOpacity: 0.84,\n },\n selectedNeighborhoods: {\n fillAntialias: true,\n fillColor: 'green',\n fillOpacity: 0.84,\n },\n bubbleText: { textAlign: 'center' },\n};\n\nclass QueryWithRect extends React.Component {\n static propTypes = {\n ...BaseExamplePropTypes,\n };\n\n constructor(props) {\n super(props);\n\n this.state = {\n screenCoords: [],\n selectedGeoJSON: null,\n };\n\n this.onPress = this.onPress.bind(this);\n }\n\n async onPress(e) {\n const { screenPointX, screenPointY } = e.properties;\n\n const screenCoords = Object.assign([], this.state.screenCoords);\n screenCoords.push([screenPointX, screenPointY]);\n\n if (screenCoords.length === 2) {\n const featureCollection = await this._map.queryRenderedFeaturesInRect(\n this.getBoundingBox(screenCoords),\n null,\n ['nycFill'],\n );\n\n this.setState({\n screenCoords: [],\n selectedGeoJSON: featureCollection.features.length\n ? featureCollection\n : null,\n });\n } else {\n this.setState({ screenCoords });\n }\n }\n\n getBoundingBox(screenCoords) {\n const maxX = Math.max(screenCoords[0][0], screenCoords[1][0]);\n const minX = Math.min(screenCoords[0][0], screenCoords[1][0]);\n const maxY = Math.max(screenCoords[0][1], screenCoords[1][1]);\n const minY = Math.min(screenCoords[0][1], screenCoords[1][1]);\n // Rect -> [top, right, bottom, left]\n return [minY, maxX, maxY, minX];\n }\n\n get message() {\n if (this.state.screenCoords.length === 1) {\n return 'Press in one more location to close the rect';\n }\n return 'Press in two different locations to form a rect to query with';\n }\n\n render() {\n return (\n \n (this._map = c)}\n onPress={this.onPress}\n style={sheet.matchParent}\n styleURL={MapboxGL.StyleURL.Light}\n >\n \n\n \n \n \n\n {this.state.selectedGeoJSON ? (\n \n \n \n ) : null}\n \n\n \n {this.message}\n \n \n );\n }\n}\n\nexport default QueryWithRect;\n\n\n"})}),"\n",(0,s.jsxs)(n.p,{children:[(0,s.jsx)(n.img,{alt:"QueryWithRect.png",src:t(4706).Z+"",width:"295",height:"640"}),"}"]})]})}function m(e={}){const{wrapper:n}={...(0,r.a)(),...e.components};return n?(0,s.jsx)(n,{...e,children:(0,s.jsx)(p,{...e})}):p(e)}},4706:(e,n,t)=>{t.d(n,{Z:()=>s});const s=t.p+"assets/images/QueryWithRect-4adcb6c95e95e7f2f4432a77b3c30bc0.png"},1151:(e,n,t)=>{t.d(n,{a:()=>a});var s=t(7294);const r={},o=s.createContext(r);function a(e){const n=s.useContext(o);return s.useMemo((function(){return"function"==typeof e?e(n):{...n,...e}}),[n,e])}}}]); \ No newline at end of file diff --git a/assets/js/4f8af149.b9cbaa77.js b/assets/js/4f8af149.897018c3.js similarity index 98% rename from assets/js/4f8af149.b9cbaa77.js rename to assets/js/4f8af149.897018c3.js index 6267cd4..74b6b17 100644 --- a/assets/js/4f8af149.b9cbaa77.js +++ b/assets/js/4f8af149.897018c3.js @@ -1 +1 @@ -"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[4885],{8480:(e,a,t)=>{t.r(a),t.d(a,{assets:()=>l,contentTitle:()=>o,default:()=>p,frontMatter:()=>s,metadata:()=>m,toc:()=>i});var r=t(5893),n=t(1151);const s={title:"Image Overlay",tags:["RasterLayer","ImageSource"],custom_props:{example_rel_path:"FillRasterLayer/ImageOverlay.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/ImageOverlay.js"},o=void 0,m={id:"examples/FillRasterLayer/ImageOverlay",title:"Image Overlay",description:"ImageOverlay.png}",source:"@site/docs/examples/FillRasterLayer/ImageOverlay.md",sourceDirName:"examples/FillRasterLayer",slug:"/examples/FillRasterLayer/ImageOverlay",permalink:"/docs/examples/FillRasterLayer/ImageOverlay",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/ImageOverlay.js",tags:[{inline:!0,label:"RasterLayer",permalink:"/docs/tags/raster-layer"},{inline:!0,label:"ImageSource",permalink:"/docs/tags/image-source"}],version:"current",frontMatter:{title:"Image Overlay",tags:["RasterLayer","ImageSource"],custom_props:{example_rel_path:"FillRasterLayer/ImageOverlay.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/ImageOverlay.js"},sidebar:"examplesSidebar",previous:{title:"GeoJSON Source",permalink:"/docs/examples/FillRasterLayer/GeoJSONSource"},next:{title:"Indoor Building Map",permalink:"/docs/examples/FillRasterLayer/IndoorBuilding"}},l={},i=[];function c(e){const a={code:"code",img:"img",p:"p",pre:"pre",...(0,n.a)(),...e.components};return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(a.pre,{children:(0,r.jsx)(a.code,{className:"language-jsx",children:"import React from 'react';\nimport Mapbox from '@rnmapbox/maps';\nimport { Text } from 'react-native';\n\nimport Bubble from '../common/Bubble';\nimport sheet from '../../styles/sheet';\nimport radar0 from '../../assets/radar.png';\nimport radar1 from '../../assets/radar1.png';\nimport radar2 from '../../assets/radar2.png';\n\nconst styles = {\n rasterLayer: { rasterOpacity: 0.6 },\n bubble: { bottom: 100 },\n};\n\nconst frames = [radar0, radar1, radar2];\nconst coordQuads = [\n [\n [-80.425, 46.437], // top left\n [-71.516, 46.437], // top right\n [-71.516, 37.936], // bottom right\n [-80.425, 37.936], // bottom left\n ],\n [\n [-85.425, 45.437], // top left\n [-75.516, 45.437], // top right\n [-75.516, 36.936], // bottom right\n [-85.425, 36.936], // bottom left\n ],\n];\n\nclass ImageOverlay extends React.Component {\n state = {\n radarFrameIndex: 0,\n coords: coordQuads[0],\n dynamic: false,\n };\n\n _timeout = null;\n\n componentDidMount() {\n this.heartbeat();\n }\n\n heartbeat() {\n this._timeout = setTimeout(() => {\n requestAnimationFrame(() => {\n let nextFrame = this.state.radarFrameIndex + 1;\n if (nextFrame > 1) {\n nextFrame = 0;\n }\n\n if (this.state.dynamic) {\n this.setState({\n radarFrameIndex: nextFrame,\n coords: coordQuads[nextFrame],\n });\n } else {\n this.setState({ radarFrameIndex: nextFrame });\n }\n this.heartbeat();\n });\n }, 1000);\n }\n\n componentWillUnmount() {\n if (this._timeout) {\n clearTimeout(this._timeout);\n }\n }\n\n render() {\n const bubbleText = this.state.dynamic\n ? 'Static coordinates'\n : 'Dynamic coordinates';\n return (\n <>\n (this.map = ref)}\n style={sheet.matchParent}\n styleURL={Mapbox.StyleURL.Satellite}\n >\n \n\n \n \n \n \n {\n this.setState({ dynamic: !this.state.dynamic });\n }}\n style={styles.bubble}\n >\n {bubbleText}\n \n \n );\n }\n}\n\nexport default ImageOverlay;\n\n\n"})}),"\n",(0,r.jsxs)(a.p,{children:[(0,r.jsx)(a.img,{alt:"ImageOverlay.png",src:t(2629).Z+"",width:"295",height:"640"}),"}"]})]})}function p(e={}){const{wrapper:a}={...(0,n.a)(),...e.components};return a?(0,r.jsx)(a,{...e,children:(0,r.jsx)(c,{...e})}):c(e)}},2629:(e,a,t)=>{t.d(a,{Z:()=>r});const r=t.p+"assets/images/ImageOverlay-4692a84c61470466f2314c1655dc25f7.png"},1151:(e,a,t)=>{t.d(a,{a:()=>o});var r=t(7294);const n={},s=r.createContext(n);function o(e){const a=r.useContext(s);return r.useMemo((function(){return"function"==typeof e?e(a):{...a,...e}}),[a,e])}}}]); \ No newline at end of file +"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[4885],{8480:(e,a,t)=>{t.r(a),t.d(a,{assets:()=>l,contentTitle:()=>o,default:()=>p,frontMatter:()=>s,metadata:()=>m,toc:()=>i});var r=t(5893),n=t(1151);const s={title:"Image Overlay",tags:["RasterLayer","ImageSource"],custom_props:{example_rel_path:"FillRasterLayer/ImageOverlay.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/ImageOverlay.js"},o=void 0,m={id:"examples/FillRasterLayer/ImageOverlay",title:"Image Overlay",description:"ImageOverlay.png}",source:"@site/docs/examples/FillRasterLayer/ImageOverlay.md",sourceDirName:"examples/FillRasterLayer",slug:"/examples/FillRasterLayer/ImageOverlay",permalink:"/docs/examples/FillRasterLayer/ImageOverlay",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/ImageOverlay.js",tags:[{inline:!0,label:"RasterLayer",permalink:"/docs/tags/raster-layer"},{inline:!0,label:"ImageSource",permalink:"/docs/tags/image-source"}],version:"current",frontMatter:{title:"Image Overlay",tags:["RasterLayer","ImageSource"],custom_props:{example_rel_path:"FillRasterLayer/ImageOverlay.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/FillRasterLayer/ImageOverlay.js"},sidebar:"examplesSidebar",previous:{title:"GeoJSON Source",permalink:"/docs/examples/FillRasterLayer/GeoJSONSource"},next:{title:"Indoor Building Map",permalink:"/docs/examples/FillRasterLayer/IndoorBuilding"}},l={},i=[];function c(e){const a={code:"code",img:"img",p:"p",pre:"pre",...(0,n.a)(),...e.components};return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)(a.pre,{children:(0,r.jsx)(a.code,{className:"language-jsx",children:"import React from 'react';\nimport Mapbox from '@rnmapbox/maps';\nimport { Text } from 'react-native';\n\nimport Bubble from '../common/Bubble';\nimport sheet from '../../styles/sheet';\nimport radar0 from '../../assets/radar.png';\nimport radar1 from '../../assets/radar1.png';\nimport radar2 from '../../assets/radar2.png';\n\nconst styles = {\n rasterLayer: { rasterOpacity: 0.6 },\n bubble: { bottom: 100 },\n};\n\nconst frames = [radar0, radar1, radar2];\nconst coordQuads = [\n [\n [-80.425, 46.437], // top left\n [-71.516, 46.437], // top right\n [-71.516, 37.936], // bottom right\n [-80.425, 37.936], // bottom left\n ],\n [\n [-85.425, 45.437], // top left\n [-75.516, 45.437], // top right\n [-75.516, 36.936], // bottom right\n [-85.425, 36.936], // bottom left\n ],\n];\n\nclass ImageOverlay extends React.Component {\n state = {\n radarFrameIndex: 0,\n coords: coordQuads[0],\n dynamic: false,\n };\n\n _timeout = null;\n\n componentDidMount() {\n this.heartbeat();\n }\n\n heartbeat() {\n this._timeout = setTimeout(() => {\n requestAnimationFrame(() => {\n let nextFrame = this.state.radarFrameIndex + 1;\n if (nextFrame > 1) {\n nextFrame = 0;\n }\n\n if (this.state.dynamic) {\n this.setState({\n radarFrameIndex: nextFrame,\n coords: coordQuads[nextFrame],\n });\n } else {\n this.setState({ radarFrameIndex: nextFrame });\n }\n this.heartbeat();\n });\n }, 1000);\n }\n\n componentWillUnmount() {\n if (this._timeout) {\n clearTimeout(this._timeout);\n }\n }\n\n render() {\n const bubbleText = this.state.dynamic\n ? 'Static coordinates'\n : 'Dynamic coordinates';\n return (\n <>\n (this.map = ref)}\n style={sheet.matchParent}\n styleURL={Mapbox.StyleURL.Satellite}\n >\n \n\n \n \n \n \n {\n this.setState({ dynamic: !this.state.dynamic });\n }}\n style={styles.bubble}\n >\n {bubbleText}\n \n \n );\n }\n}\n\nexport default ImageOverlay;\n\n\n"})}),"\n",(0,r.jsxs)(a.p,{children:[(0,r.jsx)(a.img,{alt:"ImageOverlay.png",src:t(2629).Z+"",width:"295",height:"640"}),"}"]})]})}function p(e={}){const{wrapper:a}={...(0,n.a)(),...e.components};return a?(0,r.jsx)(a,{...e,children:(0,r.jsx)(c,{...e})}):c(e)}},2629:(e,a,t)=>{t.d(a,{Z:()=>r});const r=t.p+"assets/images/ImageOverlay-0e71f7eede38a230c24aeee6fd861cbe.png"},1151:(e,a,t)=>{t.d(a,{a:()=>o});var r=t(7294);const n={},s=r.createContext(n);function o(e){const a=r.useContext(s);return r.useMemo((function(){return"function"==typeof e?e(a):{...a,...e}}),[a,e])}}}]); \ No newline at end of file diff --git a/assets/js/51768be3.010d5305.js b/assets/js/51768be3.9f3ed184.js similarity index 98% rename from assets/js/51768be3.010d5305.js rename to assets/js/51768be3.9f3ed184.js index 983bb9c..81d86f4 100644 --- a/assets/js/51768be3.010d5305.js +++ b/assets/js/51768be3.9f3ed184.js @@ -1 +1 @@ -"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[2520],{4613:(e,n,t)=>{t.r(n),t.d(n,{assets:()=>l,contentTitle:()=>o,default:()=>u,frontMatter:()=>i,metadata:()=>s,toc:()=>m});var a=t(5893),r=t(1151);const i={title:"Query Terrain Elevation",tags:["MapView#queryTerrainElevation","AnimatedShape","AnimatedRouteCoordinatesArray","AnimatedExtractCoordinateFromArray"],custom_props:{example_rel_path:"V10/QueryTerrainElevation.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/V10/QueryTerrainElevation.js"},o=void 0,s={id:"examples/V10/QueryTerrainElevation",title:"Query Terrain Elevation",description:"This is a fairly complex example demonstraing the use of AnimatedShape, Camera animation, queryTerrainElevation and AnimatedMarkerView",source:"@site/docs/examples/V10/QueryTerrainElevation.md",sourceDirName:"examples/V10",slug:"/examples/V10/QueryTerrainElevation",permalink:"/docs/examples/V10/QueryTerrainElevation",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/V10/QueryTerrainElevation.js",tags:[{inline:!0,label:"MapView#queryTerrainElevation",permalink:"/docs/tags/map-view-query-terrain-elevation"},{inline:!0,label:"AnimatedShape",permalink:"/docs/tags/animated-shape"},{inline:!0,label:"AnimatedRouteCoordinatesArray",permalink:"/docs/tags/animated-route-coordinates-array"},{inline:!0,label:"AnimatedExtractCoordinateFromArray",permalink:"/docs/tags/animated-extract-coordinate-from-array"}],version:"current",frontMatter:{title:"Query Terrain Elevation",tags:["MapView#queryTerrainElevation","AnimatedShape","AnimatedRouteCoordinatesArray","AnimatedExtractCoordinateFromArray"],custom_props:{example_rel_path:"V10/QueryTerrainElevation.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/V10/QueryTerrainElevation.js"},sidebar:"examplesSidebar",previous:{title:"Markers",permalink:"/docs/examples/V10/Markers"},next:{title:"Simple Model Layer",permalink:"/docs/examples/V10/SimpleModelLayer"}},l={},m=[];function d(e){const n={code:"code",img:"img",p:"p",pre:"pre",...(0,r.a)(),...e.components};return(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(n.p,{children:"This is a fairly complex example demonstraing the use of AnimatedShape, Camera animation, queryTerrainElevation and AnimatedMarkerView"}),"\n",(0,a.jsx)(n.pre,{children:(0,a.jsx)(n.code,{className:"language-jsx",children:"import React, { useState, useEffect, useRef } from 'react';\nimport { Easing, Button, View, Text } from 'react-native';\nimport length from '@turf/length';\nimport { lineString } from '@turf/helpers';\nimport { Animated as RNAnimated } from 'react-native';\nimport {\n MapView,\n SkyLayer,\n Camera,\n Logger,\n Terrain,\n RasterDemSource,\n Animated,\n AnimatedShape,\n AnimatedRouteCoordinatesArray,\n AnimatedExtractCoordinateFromArray,\n MarkerView,\n Atmosphere,\n} from '@rnmapbox/maps';\n\nLogger.setLogLevel('verbose');\n\nconst AnimatedMarkerView = RNAnimated.createAnimatedComponent(MarkerView);\n\nconst styles = {\n mapView: { flex: 1 },\n triangleStyle: (size, color) => ({\n width: 0,\n height: 0,\n backgroundColor: 'transparent',\n borderStyle: 'solid',\n borderLeftWidth: size,\n borderRightWidth: size,\n borderTopWidth: size * 1.3,\n borderLeftColor: 'transparent',\n borderRightColor: 'transparent',\n borderTopColor: color,\n }),\n};\n\nconst QueryTerrainElevation = () => {\n let [animatedRoute, setAnimatedRoute] = useState(null);\n let [actPoint, setActPoint] = useState(null);\n let camera = useRef();\n let [altitude, setAltitude] = useState(null);\n let updateAltitudeInterval = useRef();\n let map = useRef();\n useEffect(() => {\n return () => {\n clearInterval(updateAltitudeInterval.current);\n updateAltitudeInterval.current = null;\n };\n }, []);\n\n function startAnimation(animatedRoute) {\n const ts = lineString(animatedRoute.__getValue());\n const total = length(ts, { units: 'meters' });\n const points = animatedRoute.__getValue();\n const endPoint = points[points.length - 1];\n\n animatedRoute\n .timing({\n toValue: { end: { point: endPoint, from: total } },\n duration: 20000,\n easing: Easing.linear,\n })\n .start(() => {\n clearInterval(updateAltitudeInterval.current);\n updateAltitudeInterval.current = null;\n });\n\n camera.current.setCamera({\n heading: 60,\n zoomLevel: 13.5,\n animationDuration: 20000,\n });\n\n updateAltitudeInterval.current = setInterval(async () => {\n setAltitude(\n Math.floor(\n await map.current.queryTerrainElevation(actPoint.__getValue()),\n ),\n );\n }, 2000);\n }\n\n useEffect(() => {\n (async () => {\n let response = await fetch(\n 'https://docs.mapbox.com/mapbox-gl-js/assets/route-pin.geojson',\n );\n let featureCollection = await response.json();\n\n let pinRoute = featureCollection.features[0].geometry.coordinates;\n\n let animatedRoute = new AnimatedRouteCoordinatesArray(pinRoute, {\n end: {\n from: length(lineString(pinRoute)),\n },\n });\n setAnimatedRoute(animatedRoute);\n setActPoint(new AnimatedExtractCoordinateFromArray(animatedRoute, -1));\n })();\n }, []);\n return (\n <>\n \n \n \n );\n};\n\nexport default ShowPointAnnotation;\n\n\n"})}),"\n",(0,o.jsxs)(t.p,{children:[(0,o.jsx)(t.img,{alt:"ShowPointAnnotation.png",src:e(1901).Z+"",width:"295",height:"640"}),"}"]})]})}function m(n={}){const{wrapper:t}={...(0,a.a)(),...n.components};return t?(0,o.jsx)(t,{...n,children:(0,o.jsx)(c,{...n})}):c(n)}},1901:(n,t,e)=>{e.d(t,{Z:()=>o});const o=e.p+"assets/images/ShowPointAnnotation-a82e9d3d7de5a5100051152ad08554ec.png"},1151:(n,t,e)=>{e.d(t,{a:()=>r});var o=e(7294);const a={},i=o.createContext(a);function r(n){const t=o.useContext(i);return o.useMemo((function(){return"function"==typeof n?n(t):{...t,...n}}),[t,n])}}}]); \ No newline at end of file +"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[2175],{2720:(n,t,o)=>{o.r(t),o.d(t,{assets:()=>l,contentTitle:()=>r,default:()=>m,frontMatter:()=>i,metadata:()=>s,toc:()=>c});var e=o(5893),a=o(1151);const i={title:"Show Point Annotations",tags:["PointAnnotation","MapView#deselectAnnotationOnTap","PointAnnotation#refresh","getAnnotationsLayerID"],custom_props:{example_rel_path:"Annotations/ShowPointAnnotation.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Annotations/ShowPointAnnotation.tsx"},r=void 0,s={id:"examples/Annotations/ShowPointAnnotation",title:"Show Point Annotations",description:"Shows Point annotation with images",source:"@site/docs/examples/Annotations/ShowPointAnnotation.md",sourceDirName:"examples/Annotations",slug:"/examples/Annotations/ShowPointAnnotation",permalink:"/docs/examples/Annotations/ShowPointAnnotation",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Annotations/ShowPointAnnotation.tsx",tags:[{inline:!0,label:"PointAnnotation",permalink:"/docs/tags/point-annotation"},{inline:!0,label:"MapView#deselectAnnotationOnTap",permalink:"/docs/tags/map-view-deselect-annotation-on-tap"},{inline:!0,label:"PointAnnotation#refresh",permalink:"/docs/tags/point-annotation-refresh"},{inline:!0,label:"getAnnotationsLayerID",permalink:"/docs/tags/get-annotations-layer-id"}],version:"current",frontMatter:{title:"Show Point Annotations",tags:["PointAnnotation","MapView#deselectAnnotationOnTap","PointAnnotation#refresh","getAnnotationsLayerID"],custom_props:{example_rel_path:"Annotations/ShowPointAnnotation.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Annotations/ShowPointAnnotation.tsx"},sidebar:"examplesSidebar",previous:{title:"Point Annotation Anchors",permalink:"/docs/examples/Annotations/PointAnnotationAnchors"},next:{title:"Fit",permalink:"/docs/examples/Camera/Fit"}},l={},c=[];function d(n){const t={code:"code",img:"img",p:"p",pre:"pre",...(0,a.a)(),...n.components};return(0,e.jsxs)(e.Fragment,{children:[(0,e.jsx)(t.p,{children:"Shows Point annotation with images"}),"\n",(0,e.jsx)(t.pre,{children:(0,e.jsx)(t.code,{className:"language-jsx",children:"import React, { useRef, useState } from 'react';\nimport { View, Text, StyleSheet, Image } from 'react-native';\nimport {\n Callout,\n Camera,\n FillLayer,\n MapView,\n PointAnnotation,\n ShapeSource,\n getAnnotationsLayerID,\n} from '@rnmapbox/maps';\nimport { Point, Position } from 'geojson';\nimport { Button } from '@rneui/base';\n\nimport Bubble from '../common/Bubble';\nimport { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc\n\nconst ANNOTATION_SIZE = 40;\n\nconst styles = {\n annotationContainer: {\n alignItems: 'center',\n backgroundColor: 'white',\n borderColor: 'rgba(0, 0, 0, 0.45)',\n borderRadius: ANNOTATION_SIZE / 2,\n borderWidth: StyleSheet.hairlineWidth,\n height: ANNOTATION_SIZE,\n justifyContent: 'center',\n overflow: 'hidden',\n width: ANNOTATION_SIZE,\n },\n matchParent: {\n flex: 1,\n },\n} as const;\n\ntype AnnotationWithRemoteImageProps = {\n id: string;\n title: string;\n coordinate: Position;\n};\n\nconst AnnotationWithRemoteImage = ({\n id,\n coordinate,\n title,\n}: AnnotationWithRemoteImageProps) => {\n const pointAnnotation = useRef(null);\n\n return (\n \n console.log('onSelected:', feature.id, feature.geometry.coordinates)\n }\n onDrag={(feature) =>\n console.log('onDrag:', feature.id, feature.geometry.coordinates)\n }\n onDragStart={(feature) =>\n console.log('onDragStart:', feature.id, feature.geometry.coordinates)\n }\n onDragEnd={(feature) =>\n console.log('onDragEnd:', feature.id, feature.geometry.coordinates)\n }\n ref={pointAnnotation}\n >\n \n pointAnnotation.current?.refresh()}\n // Prevent rendering bitmap at unknown animation state\n fadeDuration={0}\n />\n \n \n \n );\n};\n\nconst ShowPointAnnotation = () => {\n const [coordinates, setCoordinates] = useState([\n [-73.99155, 40.73581],\n [-73.99155, 40.73681],\n ]);\n const [layerRendering, setLayerRendering] = useState<'below' | 'above'>(\n 'below',\n );\n\n const renderAnnotations = () => {\n const items = [];\n\n for (let i = 0; i < coordinates.length; i++) {\n const coordinate = coordinates[i];\n\n const title = `Lon: ${coordinate[0]} Lat: ${coordinate[1]}`;\n const id = `pointAnnotation${i}`;\n\n if (i % 2 === 1) {\n items.push(\n null,\n ,\n );\n } else {\n items.push(\n null,\n \n \n \n ,\n );\n }\n }\n\n return items;\n };\n\n return (\n <>\n {\n setCoordinates((prevState) => [\n ...prevState,\n (feature.geometry as Point).coordinates,\n ]);\n }}\n style={styles.matchParent}\n deselectAnnotationOnTap={true}\n >\n \n\n {renderAnnotations()}\n\n \n \n \n \n\n \n \n Click to add a point annotation\n \n \n setLayerRendering(\n (prevState) =>\n (({ above: 'below', below: 'above' } as const)[prevState]),\n )\n }\n >\n Render Polygon {{ above: 'below', below: 'above' }[layerRendering]}\n \n \n \n );\n};\n\nexport default ShowPointAnnotation;\n\n\n"})}),"\n",(0,e.jsxs)(t.p,{children:[(0,e.jsx)(t.img,{alt:"ShowPointAnnotation.png",src:o(1901).Z+"",width:"295",height:"640"}),"}"]})]})}function m(n={}){const{wrapper:t}={...(0,a.a)(),...n.components};return t?(0,e.jsx)(t,{...n,children:(0,e.jsx)(d,{...n})}):d(n)}},1901:(n,t,o)=>{o.d(t,{Z:()=>e});const e=o.p+"assets/images/ShowPointAnnotation-b78b59740cd58d77d46f0411554775c6.png"},1151:(n,t,o)=>{o.d(t,{a:()=>r});var e=o(7294);const a={},i=e.createContext(a);function r(n){const t=e.useContext(i);return e.useMemo((function(){return"function"==typeof n?n(t):{...t,...n}}),[t,n])}}}]); \ No newline at end of file diff --git a/assets/js/efc0eea7.4ef1ff8e.js b/assets/js/efc0eea7.58e05fd7.js similarity index 98% rename from assets/js/efc0eea7.4ef1ff8e.js rename to assets/js/efc0eea7.58e05fd7.js index cc60b6f..f70710c 100644 --- a/assets/js/efc0eea7.4ef1ff8e.js +++ b/assets/js/efc0eea7.58e05fd7.js @@ -1 +1 @@ -"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[6698],{1446:(e,r,n)=>{n.r(r),n.d(r,{assets:()=>p,contentTitle:()=>o,default:()=>c,frontMatter:()=>s,metadata:()=>m,toc:()=>i});var t=n(5893),a=n(1151);const s={title:"Terrain, Sky, & Atmosphere",tags:["RasterDemSource","Terrain","Atmosphere","SkyLayer"],custom_props:{example_rel_path:"V10/TerrainSkyAtmosphere.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/V10/TerrainSkyAtmosphere.tsx"},o=void 0,m={id:"examples/V10/TerrainSkyAtmosphere",title:"Terrain, Sky, & Atmosphere",description:"Demostrates use of Terran, Atmosphere and SkyLayer.",source:"@site/docs/examples/V10/TerrainSkyAtmosphere.md",sourceDirName:"examples/V10",slug:"/examples/V10/TerrainSkyAtmosphere",permalink:"/docs/examples/V10/TerrainSkyAtmosphere",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/V10/TerrainSkyAtmosphere.tsx",tags:[{inline:!0,label:"RasterDemSource",permalink:"/docs/tags/raster-dem-source"},{inline:!0,label:"Terrain",permalink:"/docs/tags/terrain"},{inline:!0,label:"Atmosphere",permalink:"/docs/tags/atmosphere"},{inline:!0,label:"SkyLayer",permalink:"/docs/tags/sky-layer"}],version:"current",frontMatter:{title:"Terrain, Sky, & Atmosphere",tags:["RasterDemSource","Terrain","Atmosphere","SkyLayer"],custom_props:{example_rel_path:"V10/TerrainSkyAtmosphere.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/V10/TerrainSkyAtmosphere.tsx"},sidebar:"examplesSidebar",previous:{title:"Simple Model Layer",permalink:"/docs/examples/V10/SimpleModelLayer"},next:{title:"Style Import Config",permalink:"/docs/examples/V11/StyleImportConfig"}},p={},i=[];function l(e){const r={code:"code",img:"img",p:"p",pre:"pre",...(0,a.a)(),...e.components};return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(r.p,{children:"Demostrates use of Terran, Atmosphere and SkyLayer."}),"\n",(0,t.jsx)(r.pre,{children:(0,t.jsx)(r.code,{className:"language-jsx",children:"import React, { useRef } from 'react';\nimport { Button } from 'react-native';\nimport {\n MapView,\n SkyLayer,\n Logger,\n Terrain,\n RasterDemSource,\n Atmosphere,\n Camera,\n} from '@rnmapbox/maps';\n\nLogger.setLogLevel('verbose');\n\nconst TerrainSkyAtmosphere = () => {\n const cameraRef = useRef(null);\n\n return (\n <>\n \n cameraRef.current?.setCamera({\n heading: 60,\n zoomLevel: 13.5,\n animationDuration: 20000,\n })\n }\n />\n \n \n \n \n \n \n \n \n \n );\n};\n\nexport default TerrainSkyAtmosphere;\n\n\n"})}),"\n",(0,t.jsxs)(r.p,{children:[(0,t.jsx)(r.img,{alt:"TerrainSkyAtmosphere.png",src:n(7566).Z+"",width:"295",height:"640"}),"}"]})]})}function c(e={}){const{wrapper:r}={...(0,a.a)(),...e.components};return r?(0,t.jsx)(r,{...e,children:(0,t.jsx)(l,{...e})}):l(e)}},7566:(e,r,n)=>{n.d(r,{Z:()=>t});const t=n.p+"assets/images/TerrainSkyAtmosphere-80af5aff81939d5ff2737c48e4e98c71.png"},1151:(e,r,n)=>{n.d(r,{a:()=>o});var t=n(7294);const a={},s=t.createContext(a);function o(e){const r=t.useContext(s);return t.useMemo((function(){return"function"==typeof e?e(r):{...r,...e}}),[r,e])}}}]); \ No newline at end of file +"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[6698],{1446:(e,r,n)=>{n.r(r),n.d(r,{assets:()=>p,contentTitle:()=>o,default:()=>c,frontMatter:()=>s,metadata:()=>m,toc:()=>i});var t=n(5893),a=n(1151);const s={title:"Terrain, Sky, & Atmosphere",tags:["RasterDemSource","Terrain","Atmosphere","SkyLayer"],custom_props:{example_rel_path:"V10/TerrainSkyAtmosphere.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/V10/TerrainSkyAtmosphere.tsx"},o=void 0,m={id:"examples/V10/TerrainSkyAtmosphere",title:"Terrain, Sky, & Atmosphere",description:"Demostrates use of Terran, Atmosphere and SkyLayer.",source:"@site/docs/examples/V10/TerrainSkyAtmosphere.md",sourceDirName:"examples/V10",slug:"/examples/V10/TerrainSkyAtmosphere",permalink:"/docs/examples/V10/TerrainSkyAtmosphere",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/V10/TerrainSkyAtmosphere.tsx",tags:[{inline:!0,label:"RasterDemSource",permalink:"/docs/tags/raster-dem-source"},{inline:!0,label:"Terrain",permalink:"/docs/tags/terrain"},{inline:!0,label:"Atmosphere",permalink:"/docs/tags/atmosphere"},{inline:!0,label:"SkyLayer",permalink:"/docs/tags/sky-layer"}],version:"current",frontMatter:{title:"Terrain, Sky, & Atmosphere",tags:["RasterDemSource","Terrain","Atmosphere","SkyLayer"],custom_props:{example_rel_path:"V10/TerrainSkyAtmosphere.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/V10/TerrainSkyAtmosphere.tsx"},sidebar:"examplesSidebar",previous:{title:"Simple Model Layer",permalink:"/docs/examples/V10/SimpleModelLayer"},next:{title:"Style Import Config",permalink:"/docs/examples/V11/StyleImportConfig"}},p={},i=[];function l(e){const r={code:"code",img:"img",p:"p",pre:"pre",...(0,a.a)(),...e.components};return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(r.p,{children:"Demostrates use of Terran, Atmosphere and SkyLayer."}),"\n",(0,t.jsx)(r.pre,{children:(0,t.jsx)(r.code,{className:"language-jsx",children:"import React, { useRef } from 'react';\nimport { Button } from 'react-native';\nimport {\n MapView,\n SkyLayer,\n Logger,\n Terrain,\n RasterDemSource,\n Atmosphere,\n Camera,\n} from '@rnmapbox/maps';\n\nLogger.setLogLevel('verbose');\n\nconst TerrainSkyAtmosphere = () => {\n const cameraRef = useRef(null);\n\n return (\n <>\n \n cameraRef.current?.setCamera({\n heading: 60,\n zoomLevel: 13.5,\n animationDuration: 20000,\n })\n }\n />\n \n \n \n \n \n \n \n \n \n );\n};\n\nexport default TerrainSkyAtmosphere;\n\n\n"})}),"\n",(0,t.jsxs)(r.p,{children:[(0,t.jsx)(r.img,{alt:"TerrainSkyAtmosphere.png",src:n(7566).Z+"",width:"295",height:"640"}),"}"]})]})}function c(e={}){const{wrapper:r}={...(0,a.a)(),...e.components};return r?(0,t.jsx)(r,{...e,children:(0,t.jsx)(l,{...e})}):l(e)}},7566:(e,r,n)=>{n.d(r,{Z:()=>t});const t=n.p+"assets/images/TerrainSkyAtmosphere-53b2c21d03ff156b5f95e2aa3697dfdc.png"},1151:(e,r,n)=>{n.d(r,{a:()=>o});var t=n(7294);const a={},s=t.createContext(a);function o(e){const r=t.useContext(s);return t.useMemo((function(){return"function"==typeof e?e(r):{...r,...e}}),[r,e])}}}]); \ No newline at end of file diff --git a/assets/js/f7bfd607.c036af70.js b/assets/js/f7bfd607.94be251e.js similarity index 98% rename from assets/js/f7bfd607.c036af70.js rename to assets/js/f7bfd607.94be251e.js index 6d356f9..092e306 100644 --- a/assets/js/f7bfd607.c036af70.js +++ b/assets/js/f7bfd607.94be251e.js @@ -1 +1 @@ -"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[8254],{5246:(e,n,t)=>{t.r(n),t.d(n,{assets:()=>r,contentTitle:()=>o,default:()=>l,frontMatter:()=>s,metadata:()=>p,toc:()=>m});var i=t(5893),a=t(1151);const s={title:"Point in Map View",tags:["MapView#pointInMapView"],custom_props:{example_rel_path:"Map/PointInMapView.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/PointInMapView.js"},o=void 0,p={id:"examples/Map/PointInMapView",title:"Point in Map View",description:"Converts a coordinate to a point in the current view.",source:"@site/docs/examples/Map/PointInMapView.md",sourceDirName:"examples/Map",slug:"/examples/Map/PointInMapView",permalink:"/docs/examples/Map/PointInMapView",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/PointInMapView.js",tags:[{inline:!0,label:"MapView#pointInMapView",permalink:"/docs/tags/map-view-point-in-map-view"}],version:"current",frontMatter:{title:"Point in Map View",tags:["MapView#pointInMapView"],custom_props:{example_rel_path:"Map/PointInMapView.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/PointInMapView.js"},sidebar:"examplesSidebar",previous:{title:"Ornaments",permalink:"/docs/examples/Map/Ornaments"},next:{title:"Show and hide layer",permalink:"/docs/examples/Map/ShowAndHideLayer"}},r={},m=[];function c(e){const n={code:"code",img:"img",p:"p",pre:"pre",...(0,a.a)(),...e.components};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(n.p,{children:"Converts a coordinate to a point in the current view."}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-jsx",children:"import React from 'react';\nimport { Text } from 'react-native';\nimport { MapView, Camera } from '@rnmapbox/maps';\n\nimport Bubble from '../common/Bubble';\n\nconst styles = {\n mapView: { flex: 1 },\n};\n\nclass PointInMapView extends React.Component {\n constructor(props) {\n super(props);\n\n this.state = {\n pointInView: null,\n };\n\n this.onPress = this.onPress.bind(this);\n }\n\n async onPress(e) {\n const pointInView = await this._map.getPointInView(e.geometry.coordinates);\n this.setState({ pointInView });\n }\n\n renderPointInView() {\n if (!this.state.pointInView) {\n return Touch map to see xy pixel location;\n }\n\n return [\n x: {this.state.pointInView[0]},\n y: {this.state.pointInView[1]},\n ];\n }\n\n render() {\n return (\n <>\n (this._map = c)}\n onPress={this.onPress}\n style={styles.mapView}\n >\n \n \n\n {this.renderPointInView()}\n \n );\n }\n}\n\nexport default PointInMapView;\n\n\n"})}),"\n",(0,i.jsxs)(n.p,{children:[(0,i.jsx)(n.img,{alt:"PointInMapView.png",src:t(9731).Z+"",width:"295",height:"640"}),"}"]})]})}function l(e={}){const{wrapper:n}={...(0,a.a)(),...e.components};return n?(0,i.jsx)(n,{...e,children:(0,i.jsx)(c,{...e})}):c(e)}},9731:(e,n,t)=>{t.d(n,{Z:()=>i});const i=t.p+"assets/images/PointInMapView-62316a0ff11a5c3f12b3ab11d20ae212.png"},1151:(e,n,t)=>{t.d(n,{a:()=>o});var i=t(7294);const a={},s=i.createContext(a);function o(e){const n=i.useContext(s);return i.useMemo((function(){return"function"==typeof e?e(n):{...n,...e}}),[n,e])}}}]); \ No newline at end of file +"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[8254],{5246:(e,n,t)=>{t.r(n),t.d(n,{assets:()=>r,contentTitle:()=>o,default:()=>l,frontMatter:()=>s,metadata:()=>p,toc:()=>m});var i=t(5893),a=t(1151);const s={title:"Point in Map View",tags:["MapView#pointInMapView"],custom_props:{example_rel_path:"Map/PointInMapView.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/PointInMapView.js"},o=void 0,p={id:"examples/Map/PointInMapView",title:"Point in Map View",description:"Converts a coordinate to a point in the current view.",source:"@site/docs/examples/Map/PointInMapView.md",sourceDirName:"examples/Map",slug:"/examples/Map/PointInMapView",permalink:"/docs/examples/Map/PointInMapView",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/PointInMapView.js",tags:[{inline:!0,label:"MapView#pointInMapView",permalink:"/docs/tags/map-view-point-in-map-view"}],version:"current",frontMatter:{title:"Point in Map View",tags:["MapView#pointInMapView"],custom_props:{example_rel_path:"Map/PointInMapView.js"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Map/PointInMapView.js"},sidebar:"examplesSidebar",previous:{title:"Ornaments",permalink:"/docs/examples/Map/Ornaments"},next:{title:"Show and hide layer",permalink:"/docs/examples/Map/ShowAndHideLayer"}},r={},m=[];function c(e){const n={code:"code",img:"img",p:"p",pre:"pre",...(0,a.a)(),...e.components};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(n.p,{children:"Converts a coordinate to a point in the current view."}),"\n",(0,i.jsx)(n.pre,{children:(0,i.jsx)(n.code,{className:"language-jsx",children:"import React from 'react';\nimport { Text } from 'react-native';\nimport { MapView, Camera } from '@rnmapbox/maps';\n\nimport Bubble from '../common/Bubble';\n\nconst styles = {\n mapView: { flex: 1 },\n};\n\nclass PointInMapView extends React.Component {\n constructor(props) {\n super(props);\n\n this.state = {\n pointInView: null,\n };\n\n this.onPress = this.onPress.bind(this);\n }\n\n async onPress(e) {\n const pointInView = await this._map.getPointInView(e.geometry.coordinates);\n this.setState({ pointInView });\n }\n\n renderPointInView() {\n if (!this.state.pointInView) {\n return Touch map to see xy pixel location;\n }\n\n return [\n x: {this.state.pointInView[0]},\n y: {this.state.pointInView[1]},\n ];\n }\n\n render() {\n return (\n <>\n (this._map = c)}\n onPress={this.onPress}\n style={styles.mapView}\n >\n \n \n\n {this.renderPointInView()}\n \n );\n }\n}\n\nexport default PointInMapView;\n\n\n"})}),"\n",(0,i.jsxs)(n.p,{children:[(0,i.jsx)(n.img,{alt:"PointInMapView.png",src:t(9731).Z+"",width:"295",height:"640"}),"}"]})]})}function l(e={}){const{wrapper:n}={...(0,a.a)(),...e.components};return n?(0,i.jsx)(n,{...e,children:(0,i.jsx)(c,{...e})}):c(e)}},9731:(e,n,t)=>{t.d(n,{Z:()=>i});const i=t.p+"assets/images/PointInMapView-ca477f94ab14c7f8882ee0481f1b898f.png"},1151:(e,n,t)=>{t.d(n,{a:()=>o});var i=t(7294);const a={},s=i.createContext(a);function o(e){const n=i.useContext(s);return i.useMemo((function(){return"function"==typeof e?e(n):{...n,...e}}),[n,e])}}}]); \ No newline at end of file diff --git a/assets/js/fad28139.4700d067.js b/assets/js/fad28139.1469282d.js similarity index 97% rename from assets/js/fad28139.4700d067.js rename to assets/js/fad28139.1469282d.js index 016141f..5c95fcd 100644 --- a/assets/js/fad28139.4700d067.js +++ b/assets/js/fad28139.1469282d.js @@ -1 +1 @@ -"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[690],{2078:(e,t,n)=>{n.r(t),n.d(t,{assets:()=>i,contentTitle:()=>r,default:()=>c,frontMatter:()=>s,metadata:()=>l,toc:()=>m});var o=n(5893),a=n(1151);const s={title:"Custom Callout",tags:["MarkerView"],custom_props:{example_rel_path:"Annotations/CustomCallout.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Annotations/CustomCallout.tsx"},r=void 0,l={id:"examples/Annotations/CustomCallout",title:"Custom Callout",description:"Use MarkerView to create a custom callout.",source:"@site/docs/examples/Annotations/CustomCallout.md",sourceDirName:"examples/Annotations",slug:"/examples/Annotations/CustomCallout",permalink:"/docs/examples/Annotations/CustomCallout",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Annotations/CustomCallout.tsx",tags:[{inline:!0,label:"MarkerView",permalink:"/docs/tags/marker-view"}],version:"current",frontMatter:{title:"Custom Callout",tags:["MarkerView"],custom_props:{example_rel_path:"Annotations/CustomCallout.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Annotations/CustomCallout.tsx"},sidebar:"examplesSidebar",previous:{title:"Introduction",permalink:"/docs/examples/"},next:{title:"Heatmap",permalink:"/docs/examples/Annotations/Heatmap"}},i={},m=[];function u(e){const t={code:"code",img:"img",p:"p",pre:"pre",...(0,a.a)(),...e.components};return(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)(t.p,{children:"Use MarkerView to create a custom callout."}),"\n",(0,o.jsx)(t.pre,{children:(0,o.jsx)(t.code,{className:"language-jsx",children:"import Mapbox, { type SymbolLayerStyle } from '@rnmapbox/maps';\nimport { Feature } from '@turf/helpers';\nimport React, { useState } from 'react';\nimport { StyleProp, Text, TextStyle, View, ViewStyle } from 'react-native';\n\nimport exampleIcon from '../../assets/pin.png';\nimport sheet from '../../styles/sheet';\nimport { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc\n\nconst defaultCamera = {\n centerCoordinate: [12.338, 45.4385],\n zoomLevel: 17.4,\n};\n\nconst featureCollection: GeoJSON.FeatureCollection = {\n type: 'FeatureCollection',\n features: [\n {\n type: 'Feature',\n id: '9d10456e-bdda-4aa9-9269-04c1667d4552',\n properties: {\n icon: 'example',\n message: 'Hello!',\n },\n geometry: {\n type: 'Point',\n coordinates: [12.338, 45.4385],\n },\n },\n ],\n};\n\ntype CustomCalloutViewProps = {\n message: string;\n};\n\nconst CustomCalloutView = ({ message }: CustomCalloutViewProps) => {\n return (\n \n {message}\n \n );\n};\n\nconst CustomCallout = () => {\n const [selectedFeature, setSelectedFeature] =\n useState>();\n\n const onPinPress = (e: { features: Array }): void => {\n if (selectedFeature) {\n setSelectedFeature(undefined);\n return;\n }\n\n const feature = e?.features[0] as Feature;\n setSelectedFeature(feature);\n };\n\n return (\n \n \n \n \n \n \n {selectedFeature && (\n \n \n \n )}\n \n );\n};\n\nconst styles: {\n matchParent: StyleProp;\n mapPinLayer: SymbolLayerStyle;\n customCalloutText: StyleProp;\n calloutContainerStyle: StyleProp;\n} = {\n matchParent: {\n flex: 1,\n },\n mapPinLayer: {\n iconAllowOverlap: true,\n iconAnchor: 'bottom',\n iconSize: 1.0,\n iconImage: 'exampleIcon',\n },\n customCalloutText: {\n color: 'black',\n fontSize: 16,\n },\n calloutContainerStyle: {\n backgroundColor: 'white',\n width: 60,\n height: 40,\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n },\n};\n\nexport default CustomCallout;\n\n\n"})}),"\n",(0,o.jsxs)(t.p,{children:[(0,o.jsx)(t.img,{alt:"CustomCallout.png",src:n(8993).Z+"",width:"295",height:"640"}),"}"]})]})}function c(e={}){const{wrapper:t}={...(0,a.a)(),...e.components};return t?(0,o.jsx)(t,{...e,children:(0,o.jsx)(u,{...e})}):u(e)}},8993:(e,t,n)=>{n.d(t,{Z:()=>o});const o=n.p+"assets/images/CustomCallout-616138bdf24baf3d9a0e10074695dcc5.png"},1151:(e,t,n)=>{n.d(t,{a:()=>r});var o=n(7294);const a={},s=o.createContext(a);function r(e){const t=o.useContext(s);return o.useMemo((function(){return"function"==typeof e?e(t):{...t,...e}}),[t,e])}}}]); \ No newline at end of file +"use strict";(self.webpackChunkmap_docs=self.webpackChunkmap_docs||[]).push([[690],{2078:(e,t,n)=>{n.r(t),n.d(t,{assets:()=>i,contentTitle:()=>r,default:()=>c,frontMatter:()=>s,metadata:()=>l,toc:()=>m});var o=n(5893),a=n(1151);const s={title:"Custom Callout",tags:["MarkerView"],custom_props:{example_rel_path:"Annotations/CustomCallout.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Annotations/CustomCallout.tsx"},r=void 0,l={id:"examples/Annotations/CustomCallout",title:"Custom Callout",description:"Use MarkerView to create a custom callout.",source:"@site/docs/examples/Annotations/CustomCallout.md",sourceDirName:"examples/Annotations",slug:"/examples/Annotations/CustomCallout",permalink:"/docs/examples/Annotations/CustomCallout",draft:!1,unlisted:!1,editUrl:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Annotations/CustomCallout.tsx",tags:[{inline:!0,label:"MarkerView",permalink:"/docs/tags/marker-view"}],version:"current",frontMatter:{title:"Custom Callout",tags:["MarkerView"],custom_props:{example_rel_path:"Annotations/CustomCallout.tsx"},custom_edit_url:"https://github.com/rnmapbox/maps/tree/master/example/src/examples/Annotations/CustomCallout.tsx"},sidebar:"examplesSidebar",previous:{title:"Introduction",permalink:"/docs/examples/"},next:{title:"Heatmap",permalink:"/docs/examples/Annotations/Heatmap"}},i={},m=[];function u(e){const t={code:"code",img:"img",p:"p",pre:"pre",...(0,a.a)(),...e.components};return(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)(t.p,{children:"Use MarkerView to create a custom callout."}),"\n",(0,o.jsx)(t.pre,{children:(0,o.jsx)(t.code,{className:"language-jsx",children:"import Mapbox, { type SymbolLayerStyle } from '@rnmapbox/maps';\nimport { Feature } from '@turf/helpers';\nimport React, { useState } from 'react';\nimport { StyleProp, Text, TextStyle, View, ViewStyle } from 'react-native';\n\nimport exampleIcon from '../../assets/pin.png';\nimport sheet from '../../styles/sheet';\nimport { ExampleWithMetadata } from '../common/ExampleMetadata'; // exclude-from-doc\n\nconst defaultCamera = {\n centerCoordinate: [12.338, 45.4385],\n zoomLevel: 17.4,\n};\n\nconst featureCollection: GeoJSON.FeatureCollection = {\n type: 'FeatureCollection',\n features: [\n {\n type: 'Feature',\n id: '9d10456e-bdda-4aa9-9269-04c1667d4552',\n properties: {\n icon: 'example',\n message: 'Hello!',\n },\n geometry: {\n type: 'Point',\n coordinates: [12.338, 45.4385],\n },\n },\n ],\n};\n\ntype CustomCalloutViewProps = {\n message: string;\n};\n\nconst CustomCalloutView = ({ message }: CustomCalloutViewProps) => {\n return (\n \n {message}\n \n );\n};\n\nconst CustomCallout = () => {\n const [selectedFeature, setSelectedFeature] =\n useState>();\n\n const onPinPress = (e: { features: Array }): void => {\n if (selectedFeature) {\n setSelectedFeature(undefined);\n return;\n }\n\n const feature = e?.features[0] as Feature;\n setSelectedFeature(feature);\n };\n\n return (\n \n \n \n \n \n \n {selectedFeature && (\n \n \n \n )}\n \n );\n};\n\nconst styles: {\n matchParent: StyleProp;\n mapPinLayer: SymbolLayerStyle;\n customCalloutText: StyleProp;\n calloutContainerStyle: StyleProp;\n} = {\n matchParent: {\n flex: 1,\n },\n mapPinLayer: {\n iconAllowOverlap: true,\n iconAnchor: 'bottom',\n iconSize: 1.0,\n iconImage: 'exampleIcon',\n },\n customCalloutText: {\n color: 'black',\n fontSize: 16,\n },\n calloutContainerStyle: {\n backgroundColor: 'white',\n width: 60,\n height: 40,\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n },\n};\n\nexport default CustomCallout;\n\n\n"})}),"\n",(0,o.jsxs)(t.p,{children:[(0,o.jsx)(t.img,{alt:"CustomCallout.png",src:n(8993).Z+"",width:"295",height:"640"}),"}"]})]})}function c(e={}){const{wrapper:t}={...(0,a.a)(),...e.components};return t?(0,o.jsx)(t,{...e,children:(0,o.jsx)(u,{...e})}):u(e)}},8993:(e,t,n)=>{n.d(t,{Z:()=>o});const o=n.p+"assets/images/CustomCallout-59966c8db5822c4b59ecc9ae4b67d8cd.png"},1151:(e,t,n)=>{n.d(t,{a:()=>r});var o=n(7294);const a={},s=o.createContext(a);function r(e){const t=o.useContext(s);return o.useMemo((function(){return"function"==typeof e?e(t):{...t,...e}}),[t,e])}}}]); \ No newline at end of file diff --git a/assets/js/runtime~main.860dbdaa.js b/assets/js/runtime~main.51e88eb1.js similarity index 71% rename from assets/js/runtime~main.860dbdaa.js rename to assets/js/runtime~main.51e88eb1.js index 1e02830..a1219e6 100644 --- a/assets/js/runtime~main.860dbdaa.js +++ b/assets/js/runtime~main.51e88eb1.js @@ -1 +1 @@ -(()=>{"use strict";var e,a,c,f,d,b={},t={};function r(e){var a=t[e];if(void 0!==a)return a.exports;var c=t[e]={exports:{}};return b[e].call(c.exports,c,c.exports,r),c.exports}r.m=b,e=[],r.O=(a,c,f,d)=>{if(!c){var b=1/0;for(i=0;i=d)&&Object.keys(r.O).every((e=>r.O[e](c[o])))?c.splice(o--,1):(t=!1,d0&&e[i-1][2]>d;i--)e[i]=e[i-1];e[i]=[c,f,d]},r.n=e=>{var a=e&&e.__esModule?()=>e.default:()=>e;return r.d(a,{a:a}),a},c=Object.getPrototypeOf?e=>Object.getPrototypeOf(e):e=>e.__proto__,r.t=function(e,f){if(1&f&&(e=this(e)),8&f)return e;if("object"==typeof e&&e){if(4&f&&e.__esModule)return e;if(16&f&&"function"==typeof e.then)return e}var d=Object.create(null);r.r(d);var b={};a=a||[null,c({}),c([]),c(c)];for(var t=2&f&&e;"object"==typeof t&&!~a.indexOf(t);t=c(t))Object.getOwnPropertyNames(t).forEach((a=>b[a]=()=>e[a]));return b.default=()=>e,r.d(d,b),d},r.d=(e,a)=>{for(var c in a)r.o(a,c)&&!r.o(e,c)&&Object.defineProperty(e,c,{enumerable:!0,get:a[c]})},r.f={},r.e=e=>Promise.all(Object.keys(r.f).reduce(((a,c)=>(r.f[c](e,a),a)),[])),r.u=e=>"assets/js/"+({35:"46e07f22",68:"86a9e106",100:"3a4d34a4",169:"1c473699",197:"452ca03d",204:"e47e0d66",316:"5ba21c60",422:"989f8913",478:"d4b91e16",646:"e5aefb32",669:"291eecb5",690:"fad28139",700:"5c554389",795:"c579c9d5",814:"46a34776",822:"5cbdb68b",827:"80672435",890:"4f423213",906:"5942b011",948:"8717b14a",955:"d979248c",956:"8d690f83",961:"46a10cb0",973:"f5cb1005",993:"b56693a5",995:"f4aed320",1003:"163132fa",1004:"c141421f",1159:"77883ee0",1181:"0f33b5a0",1184:"b0231ac1",1218:"6b2d7eab",1282:"5f7bbd13",1326:"f578f36f",1476:"a33d13d7",1496:"fef1c6ce",1532:"774fa26e",1537:"a77c5620",1605:"04ea8698",1775:"3c27faaf",1914:"d9f32620",2001:"38379c4e",2162:"cb7ffda8",2175:"ef4ba5ad",2267:"59362658",2272:"5ee29e23",2298:"d8902fcc",2349:"a1ed6f1c",2362:"e273c56f",2380:"8dac1041",2432:"6d5a3e93",2503:"d42da95e",2520:"51768be3",2535:"814f3328",2594:"7cca1b9d",2613:"330dc111",2619:"46a9a46c",2736:"5775363c",2768:"288e25b0",2795:"cef5cc3c",2823:"c9588a75",2852:"3364bf3a",2893:"8420653b",2897:"c5d94311",2914:"966495f6",2931:"03a30274",3015:"6e967b28",3027:"3229c66e",3085:"1f391b9e",3089:"a6aa9e1f",3095:"31cfe636",3250:"0e384b89",3292:"5b3ec575",3316:"4ce86281",3336:"427de7f9",3402:"a76282a6",3424:"ddffc12b",3427:"eac6da66",3507:"3f3f3e04",3514:"73664a40",3535:"96c2f7d6",3608:"9e4087bc",3629:"aba21aa0",3651:"01729fb2",3668:"4df25f71",3676:"6d0d9e3a",3710:"38535e97",3723:"c115105f",3751:"3720c009",3763:"17993280",3943:"547cb5d0",3954:"898514b1",3963:"12b6bc25",4013:"01a85c17",4031:"f81c1134",4038:"f3399ff4",4055:"9b93ab06",4060:"daaaf687",4061:"815f8246",4082:"8b117445",4088:"0058b4c6",4128:"a343d9b7",4131:"b7edfec4",4171:"464677f0",4195:"c4f5d8e4",4200:"93db065f",4220:"8c4a08c1",4232:"1c14c0d8",4290:"862952af",4331:"7b816787",4363:"ec7aad68",4368:"a94703ab",4449:"09e16a24",4481:"2994c633",4530:"4285872d",4578:"dcbd927b",4666:"11e9027a",4672:"bde0464f",4681:"1e806f68",4692:"738b06b1",4847:"04f93229",4850:"659f2bcf",4852:"c031a935",4878:"c04ce839",4885:"4f8af149",4893:"69fe9340",5011:"8cbdf981",5182:"8ac80767",5244:"5c15c9b7",5254:"e346864f",5265:"3217192f",5276:"bb3642ad",5280:"c6a4560a",5302:"b1f4e2a5",5352:"41ab0200",5356:"6ab2e55f",5364:"00f847ac",5392:"d6a1e0e9",5413:"906ea606",5484:"86ec3cfb",5490:"b4fc381c",5543:"cf215d16",5650:"5d2acf3c",5662:"f0b67563",5684:"7a3342d3",5809:"9b18272e",5818:"c6dfe076",5869:"ce49394d",5980:"a7456010",6023:"9c50fbe7",6038:"4f2c9e02",6103:"ccc49370",6105:"780afde6",6152:"f027a196",6156:"fa93c8bd",6200:"81e7cf41",6205:"b95799e0",6216:"3e686edc",6229:"f5c99320",6390:"b311c601",6427:"8d3d6164",6433:"4c314a12",6470:"34e9dd98",6633:"69ade99f",6642:"c15d9823",6677:"87052ec2",6698:"efc0eea7",6826:"13369b41",6832:"07badaf3",6939:"3b1950e6",6978:"d152cda6",7133:"e4a7c5ab",7156:"b6df69e7",7327:"8b1f332b",7375:"c18a971d",7393:"acecf23e",7398:"7c8bb838",7414:"393be207",7450:"6e5ef60f",7536:"6339ac36",7662:"ba18253d",7698:"95259ea0",7774:"496ac0ab",7779:"b6300ee2",7786:"31c1c968",7886:"e2508be1",7891:"38286337",7918:"17896441",7920:"1a4e3797",7924:"85e5b3f1",7927:"67501116",7943:"c4de80f8",7998:"25550387",8028:"22edd90a",8068:"84421286",8254:"f7bfd607",8263:"53223ecf",8273:"5a16d0cc",8348:"bb16fc39",8380:"e2c4e012",8398:"c6a0e813",8470:"66cd880a",8508:"87e99b5e",8518:"a7bd4aaa",8521:"e32388c0",8551:"58bb7da0",8554:"5e90a9b3",8610:"6875c492",8626:"f82cd581",8628:"4199ce38",8636:"f4f34a3a",8765:"dfd0626d",8770:"18b78d02",8833:"19a83d05",8882:"cd23a23e",8914:"a307de4a",9003:"925b3f96",9107:"6d1ce1ea",9208:"36994c47",9257:"4188a2b0",9320:"245ce2cf",9361:"3a2db09e",9367:"9c155e26",9469:"b94991c3",9642:"7661071f",9658:"8f5e5656",9661:"5e95c892",9781:"92ce638f",9852:"63747f2c",9868:"3f966df8",9892:"ef09af6b",9898:"9f37591a",9924:"df203c0f",9960:"64d316a4"}[e]||e)+"."+{35:"43bff63e",68:"4ff83856",100:"1476b1b3",169:"72f5205e",197:"253ffae0",204:"f384e2e5",316:"55d9f02e",422:"e8149d4a",478:"9101f218",646:"ef8eed1a",669:"79fd8d24",690:"4700d067",700:"39734948",795:"5ecbe18b",814:"32ecb163",822:"71f9accc",827:"f6b1adb5",890:"db57dd5b",906:"186b4b16",948:"8e436efa",955:"6a18b803",956:"5deda499",961:"f86199b1",973:"56cd2d34",993:"e07f5cdc",995:"cf204cef",1003:"7cd45313",1004:"777c33c8",1159:"7bd59f76",1181:"5c53748e",1184:"f06eb791",1218:"8d74cd11",1282:"95fd0c20",1326:"c9c7315d",1426:"704928ad",1476:"010f8847",1496:"6e65c791",1532:"60322868",1537:"381459ba",1605:"1282c3dd",1772:"7fb5deef",1775:"2a1e5cf6",1914:"eb958a60",2001:"781a3114",2162:"f8d667ad",2175:"d30b33b1",2267:"72480c00",2272:"c24fc136",2298:"ff83f988",2349:"2642f5cb",2362:"d842ea52",2380:"b6d9a594",2432:"b712effb",2503:"63cbbf9b",2520:"010d5305",2535:"76666e0c",2594:"8d0f299c",2613:"34a4696f",2619:"2b43f790",2736:"056e3cf5",2768:"2f01b3ee",2795:"d3b7032d",2823:"b2656dc6",2852:"9c72b4a5",2893:"2d406dba",2897:"0a433a0c",2914:"8ed3b0db",2931:"30a314e7",3015:"f5791b1e",3027:"f8881c0c",3085:"18e977c9",3089:"af7cc727",3095:"abf2d38b",3250:"be88762e",3292:"8e026ae2",3316:"32a18e50",3336:"43f0b582",3402:"310babe5",3424:"4e5d9bcf",3427:"daac5de6",3507:"aa68bffa",3514:"8eae44f3",3535:"70feb36c",3608:"33ed8f0e",3629:"a6dfebcf",3651:"fbdca51b",3668:"019eeadf",3676:"af55af04",3710:"5eaa99dd",3723:"438c44a9",3751:"16e24e14",3763:"f40535ab",3943:"e3c76a7b",3954:"3e8cf9e8",3963:"c1978a5c",4013:"81758779",4031:"1a3e5295",4038:"cc6a82fc",4055:"57505bbf",4060:"a51b2e6b",4061:"2f608c3e",4082:"9373011b",4088:"4281ae9b",4128:"4fe8dd65",4131:"8e338ac9",4171:"58cd87be",4195:"63b58109",4200:"2740f49d",4220:"7a264482",4232:"28a12665",4290:"220daf75",4331:"de4f57b1",4363:"a06c3087",4368:"3a6bae8a",4449:"82dd259b",4481:"9830eaff",4530:"2ca656ca",4578:"e7796dbc",4666:"067cf3d6",4672:"68500a8b",4681:"31fe181c",4692:"bf1ae56d",4847:"e51207f3",4850:"f6661664",4852:"81d215a4",4878:"55ea762e",4885:"b9cbaa77",4893:"3ed00f27",5011:"bb71c8ba",5182:"2bf4e3ce",5244:"fc2aaf46",5254:"4d47fdb6",5265:"f83aecd2",5276:"58971696",5280:"af68687f",5302:"907e465e",5352:"97e73bf4",5356:"1d70f9b7",5364:"8aa2b815",5392:"cf782aea",5413:"f5424218",5484:"3c848e8d",5490:"ee31fd4d",5543:"d7c84b1e",5650:"04bf0ffe",5662:"44c76985",5684:"3e6e42f9",5809:"2af73984",5818:"94797225",5869:"3a56e85c",5980:"5fa17229",6023:"b216ec8e",6038:"7550e73e",6103:"031188f7",6105:"30a667f9",6152:"77ccf203",6156:"3ffee4f4",6200:"1f01f814",6205:"4eb2a80b",6216:"a65e4e2e",6229:"d335c83e",6390:"0c78607b",6427:"12af3365",6433:"b8909b9e",6470:"4e2c7510",6633:"7f9c9d07",6642:"510a5101",6677:"4f324f08",6698:"4ef1ff8e",6826:"6f932619",6832:"75dda5c3",6939:"5bf13ced",6945:"b11d0f48",6978:"f7079904",7133:"78202a7b",7156:"89dbc8d5",7327:"1956bee7",7375:"05101504",7393:"f13d9bf9",7398:"76792324",7414:"fb0a7bfd",7450:"d8d35c1b",7534:"c7abb920",7536:"6fa435f5",7662:"5a815cd7",7698:"00f31e65",7774:"8368532b",7779:"8f4753b6",7786:"7d00aa88",7886:"a7228fbd",7891:"62c3b28a",7918:"0e9f1d01",7920:"bc15e035",7924:"26763780",7927:"c95cbbe1",7943:"666964f6",7998:"84068bad",8028:"53a1a56c",8068:"2c9cf904",8254:"c036af70",8263:"d4dbe061",8273:"4ae48e39",8348:"62345d7c",8380:"66a20c6c",8398:"738e506b",8470:"88387022",8508:"6fbbfb48",8518:"619c3e0e",8521:"70e6748d",8551:"e3a8595a",8554:"89e32186",8610:"970c8203",8626:"756eb391",8628:"5e411302",8636:"d303a54f",8765:"f20376c7",8770:"2b6c5f34",8833:"cf4f80d9",8882:"b593de7f",8894:"f9c3f983",8914:"683f5056",9003:"59109393",9107:"6ad9fd5b",9208:"64e529a3",9257:"4fed9540",9320:"e4f1fd7d",9361:"f35232c7",9367:"c65bb11a",9469:"bcb4e0b8",9642:"5438d496",9658:"d5e54b5b",9661:"8dbfd1cb",9781:"3c58a501",9850:"5db75e30",9852:"1b44be4e",9868:"bec6c150",9892:"de53cd14",9898:"2f75c0de",9924:"90c9d38a",9960:"df8cd4f9"}[e]+".js",r.miniCssF=e=>{},r.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),r.o=(e,a)=>Object.prototype.hasOwnProperty.call(e,a),f={},d="map-docs:",r.l=(e,a,c,b)=>{if(f[e])f[e].push(a);else{var t,o;if(void 0!==c)for(var n=document.getElementsByTagName("script"),i=0;i{t.onerror=t.onload=null,clearTimeout(s);var d=f[e];if(delete f[e],t.parentNode&&t.parentNode.removeChild(t),d&&d.forEach((e=>e(c))),a)return a(c)},s=setTimeout(l.bind(null,void 0,{type:"timeout",target:t}),12e4);t.onerror=l.bind(null,t.onerror),t.onload=l.bind(null,t.onload),o&&document.head.appendChild(t)}},r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.p="/",r.gca=function(e){return e={17896441:"7918",17993280:"3763",25550387:"7998",38286337:"7891",59362658:"2267",67501116:"7927",80672435:"827",84421286:"8068","46e07f22":"35","86a9e106":"68","3a4d34a4":"100","1c473699":"169","452ca03d":"197",e47e0d66:"204","5ba21c60":"316","989f8913":"422",d4b91e16:"478",e5aefb32:"646","291eecb5":"669",fad28139:"690","5c554389":"700",c579c9d5:"795","46a34776":"814","5cbdb68b":"822","4f423213":"890","5942b011":"906","8717b14a":"948",d979248c:"955","8d690f83":"956","46a10cb0":"961",f5cb1005:"973",b56693a5:"993",f4aed320:"995","163132fa":"1003",c141421f:"1004","77883ee0":"1159","0f33b5a0":"1181",b0231ac1:"1184","6b2d7eab":"1218","5f7bbd13":"1282",f578f36f:"1326",a33d13d7:"1476",fef1c6ce:"1496","774fa26e":"1532",a77c5620:"1537","04ea8698":"1605","3c27faaf":"1775",d9f32620:"1914","38379c4e":"2001",cb7ffda8:"2162",ef4ba5ad:"2175","5ee29e23":"2272",d8902fcc:"2298",a1ed6f1c:"2349",e273c56f:"2362","8dac1041":"2380","6d5a3e93":"2432",d42da95e:"2503","51768be3":"2520","814f3328":"2535","7cca1b9d":"2594","330dc111":"2613","46a9a46c":"2619","5775363c":"2736","288e25b0":"2768",cef5cc3c:"2795",c9588a75:"2823","3364bf3a":"2852","8420653b":"2893",c5d94311:"2897","966495f6":"2914","03a30274":"2931","6e967b28":"3015","3229c66e":"3027","1f391b9e":"3085",a6aa9e1f:"3089","31cfe636":"3095","0e384b89":"3250","5b3ec575":"3292","4ce86281":"3316","427de7f9":"3336",a76282a6:"3402",ddffc12b:"3424",eac6da66:"3427","3f3f3e04":"3507","73664a40":"3514","96c2f7d6":"3535","9e4087bc":"3608",aba21aa0:"3629","01729fb2":"3651","4df25f71":"3668","6d0d9e3a":"3676","38535e97":"3710",c115105f:"3723","3720c009":"3751","547cb5d0":"3943","898514b1":"3954","12b6bc25":"3963","01a85c17":"4013",f81c1134:"4031",f3399ff4:"4038","9b93ab06":"4055",daaaf687:"4060","815f8246":"4061","8b117445":"4082","0058b4c6":"4088",a343d9b7:"4128",b7edfec4:"4131","464677f0":"4171",c4f5d8e4:"4195","93db065f":"4200","8c4a08c1":"4220","1c14c0d8":"4232","862952af":"4290","7b816787":"4331",ec7aad68:"4363",a94703ab:"4368","09e16a24":"4449","2994c633":"4481","4285872d":"4530",dcbd927b:"4578","11e9027a":"4666",bde0464f:"4672","1e806f68":"4681","738b06b1":"4692","04f93229":"4847","659f2bcf":"4850",c031a935:"4852",c04ce839:"4878","4f8af149":"4885","69fe9340":"4893","8cbdf981":"5011","8ac80767":"5182","5c15c9b7":"5244",e346864f:"5254","3217192f":"5265",bb3642ad:"5276",c6a4560a:"5280",b1f4e2a5:"5302","41ab0200":"5352","6ab2e55f":"5356","00f847ac":"5364",d6a1e0e9:"5392","906ea606":"5413","86ec3cfb":"5484",b4fc381c:"5490",cf215d16:"5543","5d2acf3c":"5650",f0b67563:"5662","7a3342d3":"5684","9b18272e":"5809",c6dfe076:"5818",ce49394d:"5869",a7456010:"5980","9c50fbe7":"6023","4f2c9e02":"6038",ccc49370:"6103","780afde6":"6105",f027a196:"6152",fa93c8bd:"6156","81e7cf41":"6200",b95799e0:"6205","3e686edc":"6216",f5c99320:"6229",b311c601:"6390","8d3d6164":"6427","4c314a12":"6433","34e9dd98":"6470","69ade99f":"6633",c15d9823:"6642","87052ec2":"6677",efc0eea7:"6698","13369b41":"6826","07badaf3":"6832","3b1950e6":"6939",d152cda6:"6978",e4a7c5ab:"7133",b6df69e7:"7156","8b1f332b":"7327",c18a971d:"7375",acecf23e:"7393","7c8bb838":"7398","393be207":"7414","6e5ef60f":"7450","6339ac36":"7536",ba18253d:"7662","95259ea0":"7698","496ac0ab":"7774",b6300ee2:"7779","31c1c968":"7786",e2508be1:"7886","1a4e3797":"7920","85e5b3f1":"7924",c4de80f8:"7943","22edd90a":"8028",f7bfd607:"8254","53223ecf":"8263","5a16d0cc":"8273",bb16fc39:"8348",e2c4e012:"8380",c6a0e813:"8398","66cd880a":"8470","87e99b5e":"8508",a7bd4aaa:"8518",e32388c0:"8521","58bb7da0":"8551","5e90a9b3":"8554","6875c492":"8610",f82cd581:"8626","4199ce38":"8628",f4f34a3a:"8636",dfd0626d:"8765","18b78d02":"8770","19a83d05":"8833",cd23a23e:"8882",a307de4a:"8914","925b3f96":"9003","6d1ce1ea":"9107","36994c47":"9208","4188a2b0":"9257","245ce2cf":"9320","3a2db09e":"9361","9c155e26":"9367",b94991c3:"9469","7661071f":"9642","8f5e5656":"9658","5e95c892":"9661","92ce638f":"9781","63747f2c":"9852","3f966df8":"9868",ef09af6b:"9892","9f37591a":"9898",df203c0f:"9924","64d316a4":"9960"}[e]||e,r.p+r.u(e)},(()=>{var e={1303:0,532:0};r.f.j=(a,c)=>{var f=r.o(e,a)?e[a]:void 0;if(0!==f)if(f)c.push(f[2]);else if(/^(1303|532)$/.test(a))e[a]=0;else{var d=new Promise(((c,d)=>f=e[a]=[c,d]));c.push(f[2]=d);var b=r.p+r.u(a),t=new Error;r.l(b,(c=>{if(r.o(e,a)&&(0!==(f=e[a])&&(e[a]=void 0),f)){var d=c&&("load"===c.type?"missing":c.type),b=c&&c.target&&c.target.src;t.message="Loading chunk "+a+" failed.\n("+d+": "+b+")",t.name="ChunkLoadError",t.type=d,t.request=b,f[1](t)}}),"chunk-"+a,a)}},r.O.j=a=>0===e[a];var a=(a,c)=>{var f,d,b=c[0],t=c[1],o=c[2],n=0;if(b.some((a=>0!==e[a]))){for(f in t)r.o(t,f)&&(r.m[f]=t[f]);if(o)var i=o(r)}for(a&&a(c);n{"use strict";var e,c,a,f,d,b={},t={};function r(e){var c=t[e];if(void 0!==c)return c.exports;var a=t[e]={exports:{}};return b[e].call(a.exports,a,a.exports,r),a.exports}r.m=b,e=[],r.O=(c,a,f,d)=>{if(!a){var b=1/0;for(i=0;i=d)&&Object.keys(r.O).every((e=>r.O[e](a[o])))?a.splice(o--,1):(t=!1,d0&&e[i-1][2]>d;i--)e[i]=e[i-1];e[i]=[a,f,d]},r.n=e=>{var c=e&&e.__esModule?()=>e.default:()=>e;return r.d(c,{a:c}),c},a=Object.getPrototypeOf?e=>Object.getPrototypeOf(e):e=>e.__proto__,r.t=function(e,f){if(1&f&&(e=this(e)),8&f)return e;if("object"==typeof e&&e){if(4&f&&e.__esModule)return e;if(16&f&&"function"==typeof e.then)return e}var d=Object.create(null);r.r(d);var b={};c=c||[null,a({}),a([]),a(a)];for(var t=2&f&&e;"object"==typeof t&&!~c.indexOf(t);t=a(t))Object.getOwnPropertyNames(t).forEach((c=>b[c]=()=>e[c]));return b.default=()=>e,r.d(d,b),d},r.d=(e,c)=>{for(var a in c)r.o(c,a)&&!r.o(e,a)&&Object.defineProperty(e,a,{enumerable:!0,get:c[a]})},r.f={},r.e=e=>Promise.all(Object.keys(r.f).reduce(((c,a)=>(r.f[a](e,c),c)),[])),r.u=e=>"assets/js/"+({35:"46e07f22",68:"86a9e106",100:"3a4d34a4",169:"1c473699",197:"452ca03d",204:"e47e0d66",316:"5ba21c60",422:"989f8913",478:"d4b91e16",646:"e5aefb32",669:"291eecb5",690:"fad28139",700:"5c554389",795:"c579c9d5",814:"46a34776",822:"5cbdb68b",827:"80672435",890:"4f423213",906:"5942b011",948:"8717b14a",955:"d979248c",956:"8d690f83",961:"46a10cb0",973:"f5cb1005",993:"b56693a5",995:"f4aed320",1003:"163132fa",1004:"c141421f",1159:"77883ee0",1181:"0f33b5a0",1184:"b0231ac1",1218:"6b2d7eab",1282:"5f7bbd13",1326:"f578f36f",1476:"a33d13d7",1496:"fef1c6ce",1532:"774fa26e",1537:"a77c5620",1605:"04ea8698",1775:"3c27faaf",1914:"d9f32620",2001:"38379c4e",2162:"cb7ffda8",2175:"ef4ba5ad",2267:"59362658",2272:"5ee29e23",2298:"d8902fcc",2349:"a1ed6f1c",2362:"e273c56f",2380:"8dac1041",2432:"6d5a3e93",2503:"d42da95e",2520:"51768be3",2535:"814f3328",2594:"7cca1b9d",2613:"330dc111",2619:"46a9a46c",2736:"5775363c",2768:"288e25b0",2795:"cef5cc3c",2823:"c9588a75",2852:"3364bf3a",2893:"8420653b",2897:"c5d94311",2914:"966495f6",2931:"03a30274",3015:"6e967b28",3027:"3229c66e",3085:"1f391b9e",3089:"a6aa9e1f",3095:"31cfe636",3250:"0e384b89",3292:"5b3ec575",3316:"4ce86281",3336:"427de7f9",3402:"a76282a6",3424:"ddffc12b",3427:"eac6da66",3507:"3f3f3e04",3514:"73664a40",3535:"96c2f7d6",3608:"9e4087bc",3629:"aba21aa0",3651:"01729fb2",3668:"4df25f71",3676:"6d0d9e3a",3710:"38535e97",3723:"c115105f",3751:"3720c009",3763:"17993280",3943:"547cb5d0",3954:"898514b1",3963:"12b6bc25",4013:"01a85c17",4031:"f81c1134",4038:"f3399ff4",4055:"9b93ab06",4060:"daaaf687",4061:"815f8246",4082:"8b117445",4088:"0058b4c6",4128:"a343d9b7",4131:"b7edfec4",4171:"464677f0",4195:"c4f5d8e4",4200:"93db065f",4220:"8c4a08c1",4232:"1c14c0d8",4290:"862952af",4331:"7b816787",4363:"ec7aad68",4368:"a94703ab",4449:"09e16a24",4481:"2994c633",4530:"4285872d",4578:"dcbd927b",4666:"11e9027a",4672:"bde0464f",4681:"1e806f68",4692:"738b06b1",4847:"04f93229",4850:"659f2bcf",4852:"c031a935",4878:"c04ce839",4885:"4f8af149",4893:"69fe9340",5011:"8cbdf981",5182:"8ac80767",5244:"5c15c9b7",5254:"e346864f",5265:"3217192f",5276:"bb3642ad",5280:"c6a4560a",5302:"b1f4e2a5",5352:"41ab0200",5356:"6ab2e55f",5364:"00f847ac",5392:"d6a1e0e9",5413:"906ea606",5484:"86ec3cfb",5490:"b4fc381c",5543:"cf215d16",5650:"5d2acf3c",5662:"f0b67563",5684:"7a3342d3",5809:"9b18272e",5818:"c6dfe076",5869:"ce49394d",5980:"a7456010",6023:"9c50fbe7",6038:"4f2c9e02",6103:"ccc49370",6105:"780afde6",6152:"f027a196",6156:"fa93c8bd",6200:"81e7cf41",6205:"b95799e0",6216:"3e686edc",6229:"f5c99320",6390:"b311c601",6427:"8d3d6164",6433:"4c314a12",6470:"34e9dd98",6633:"69ade99f",6642:"c15d9823",6677:"87052ec2",6698:"efc0eea7",6826:"13369b41",6832:"07badaf3",6939:"3b1950e6",6978:"d152cda6",7133:"e4a7c5ab",7156:"b6df69e7",7327:"8b1f332b",7375:"c18a971d",7393:"acecf23e",7398:"7c8bb838",7414:"393be207",7450:"6e5ef60f",7536:"6339ac36",7662:"ba18253d",7698:"95259ea0",7774:"496ac0ab",7779:"b6300ee2",7786:"31c1c968",7886:"e2508be1",7891:"38286337",7918:"17896441",7920:"1a4e3797",7924:"85e5b3f1",7927:"67501116",7943:"c4de80f8",7998:"25550387",8028:"22edd90a",8068:"84421286",8254:"f7bfd607",8263:"53223ecf",8273:"5a16d0cc",8348:"bb16fc39",8380:"e2c4e012",8398:"c6a0e813",8470:"66cd880a",8508:"87e99b5e",8518:"a7bd4aaa",8521:"e32388c0",8551:"58bb7da0",8554:"5e90a9b3",8610:"6875c492",8626:"f82cd581",8628:"4199ce38",8636:"f4f34a3a",8765:"dfd0626d",8770:"18b78d02",8833:"19a83d05",8882:"cd23a23e",8914:"a307de4a",9003:"925b3f96",9107:"6d1ce1ea",9208:"36994c47",9257:"4188a2b0",9320:"245ce2cf",9361:"3a2db09e",9367:"9c155e26",9469:"b94991c3",9642:"7661071f",9658:"8f5e5656",9661:"5e95c892",9781:"92ce638f",9852:"63747f2c",9868:"3f966df8",9892:"ef09af6b",9898:"9f37591a",9924:"df203c0f",9960:"64d316a4"}[e]||e)+"."+{35:"43bff63e",68:"445c2c92",100:"4ec9a8cb",169:"b53c6075",197:"253ffae0",204:"f384e2e5",316:"55d9f02e",422:"e8149d4a",478:"9101f218",646:"ef8eed1a",669:"79fd8d24",690:"1469282d",700:"39734948",795:"5ecbe18b",814:"32ecb163",822:"71f9accc",827:"f6b1adb5",890:"db57dd5b",906:"91c0c845",948:"8e436efa",955:"6a18b803",956:"5deda499",961:"f86199b1",973:"56cd2d34",993:"e07f5cdc",995:"cf204cef",1003:"99ae7276",1004:"777c33c8",1159:"7bd59f76",1181:"5c53748e",1184:"f06eb791",1218:"8d74cd11",1282:"95fd0c20",1326:"c9c7315d",1426:"704928ad",1476:"010f8847",1496:"6e65c791",1532:"60322868",1537:"381459ba",1605:"fc6a1610",1772:"7fb5deef",1775:"2a1e5cf6",1914:"eb958a60",2001:"781a3114",2162:"f8d667ad",2175:"9f03f7bd",2267:"72480c00",2272:"c24fc136",2298:"ff83f988",2349:"2642f5cb",2362:"d842ea52",2380:"b6d9a594",2432:"b712effb",2503:"10eb2ec1",2520:"9f3ed184",2535:"76666e0c",2594:"8d0f299c",2613:"34a4696f",2619:"2b43f790",2736:"056e3cf5",2768:"2f01b3ee",2795:"d3b7032d",2823:"b2656dc6",2852:"7afa93aa",2893:"2d406dba",2897:"0a433a0c",2914:"8ed3b0db",2931:"30a314e7",3015:"f5791b1e",3027:"f8881c0c",3085:"18e977c9",3089:"af7cc727",3095:"abf2d38b",3250:"be88762e",3292:"8e026ae2",3316:"9c5629b5",3336:"43f0b582",3402:"442d85ce",3424:"4e5d9bcf",3427:"daac5de6",3507:"aa68bffa",3514:"8eae44f3",3535:"70feb36c",3608:"33ed8f0e",3629:"a6dfebcf",3651:"fbdca51b",3668:"019eeadf",3676:"1d338d6a",3710:"5eaa99dd",3723:"f2367100",3751:"16e24e14",3763:"f40535ab",3943:"b917b2ae",3954:"3e8cf9e8",3963:"c1978a5c",4013:"81758779",4031:"1a3e5295",4038:"cc6a82fc",4055:"57505bbf",4060:"a51b2e6b",4061:"2f608c3e",4082:"45522924",4088:"4281ae9b",4128:"27765b0b",4131:"8e338ac9",4171:"58cd87be",4195:"63b58109",4200:"2740f49d",4220:"7a264482",4232:"28a12665",4290:"da26127e",4331:"de4f57b1",4363:"a06c3087",4368:"3a6bae8a",4449:"82dd259b",4481:"9830eaff",4530:"2ca656ca",4578:"e7796dbc",4666:"067cf3d6",4672:"68500a8b",4681:"31fe181c",4692:"e68a718f",4847:"e51207f3",4850:"04ca1324",4852:"f569bc55",4878:"55ea762e",4885:"897018c3",4893:"3ed00f27",5011:"bb71c8ba",5182:"2bf4e3ce",5244:"fc2aaf46",5254:"eb0f982f",5265:"f83aecd2",5276:"58971696",5280:"7b328fb4",5302:"96e625b2",5352:"97e73bf4",5356:"1d70f9b7",5364:"85f5d7c1",5392:"cf782aea",5413:"f5424218",5484:"3c848e8d",5490:"ee31fd4d",5543:"63d161f2",5650:"04bf0ffe",5662:"44c76985",5684:"3e6e42f9",5809:"2af73984",5818:"94797225",5869:"3a56e85c",5980:"5fa17229",6023:"b216ec8e",6038:"7550e73e",6103:"031188f7",6105:"30a667f9",6152:"77ccf203",6156:"3ffee4f4",6200:"1f01f814",6205:"4eb2a80b",6216:"6209abbe",6229:"d335c83e",6390:"0c78607b",6427:"12af3365",6433:"b8909b9e",6470:"4e2c7510",6633:"7f9c9d07",6642:"510a5101",6677:"e1df89c0",6698:"58e05fd7",6826:"bc712b17",6832:"638eded3",6939:"5bf13ced",6945:"b11d0f48",6978:"cee1c223",7133:"78202a7b",7156:"89dbc8d5",7327:"1956bee7",7375:"05101504",7393:"f13d9bf9",7398:"76792324",7414:"fb0a7bfd",7450:"d8d35c1b",7534:"c7abb920",7536:"5680277f",7662:"820c44f4",7698:"00f31e65",7774:"2ef8d523",7779:"421df376",7786:"7f634b7e",7886:"a7228fbd",7891:"a934140e",7918:"0e9f1d01",7920:"bc15e035",7924:"26763780",7927:"c95cbbe1",7943:"666964f6",7998:"84068bad",8028:"53a1a56c",8068:"53e27537",8254:"94be251e",8263:"d4dbe061",8273:"7fca1a35",8348:"8aca1a9e",8380:"24b7bd33",8398:"738e506b",8470:"88387022",8508:"bd13ffb6",8518:"619c3e0e",8521:"70e6748d",8551:"e3a8595a",8554:"89e32186",8610:"970c8203",8626:"756eb391",8628:"5e411302",8636:"d303a54f",8765:"5be36087",8770:"14535420",8833:"cf4f80d9",8882:"b593de7f",8894:"f9c3f983",8914:"683f5056",9003:"59109393",9107:"6ad9fd5b",9208:"64e529a3",9257:"4fed9540",9320:"e4f1fd7d",9361:"f35232c7",9367:"c65bb11a",9469:"bcb4e0b8",9642:"5438d496",9658:"d5e54b5b",9661:"8dbfd1cb",9781:"3c58a501",9850:"5db75e30",9852:"1b44be4e",9868:"bec6c150",9892:"de53cd14",9898:"2f75c0de",9924:"90c9d38a",9960:"8a8b87f8"}[e]+".js",r.miniCssF=e=>{},r.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||new Function("return this")()}catch(e){if("object"==typeof window)return window}}(),r.o=(e,c)=>Object.prototype.hasOwnProperty.call(e,c),f={},d="map-docs:",r.l=(e,c,a,b)=>{if(f[e])f[e].push(c);else{var t,o;if(void 0!==a)for(var n=document.getElementsByTagName("script"),i=0;i{t.onerror=t.onload=null,clearTimeout(s);var d=f[e];if(delete f[e],t.parentNode&&t.parentNode.removeChild(t),d&&d.forEach((e=>e(a))),c)return c(a)},s=setTimeout(l.bind(null,void 0,{type:"timeout",target:t}),12e4);t.onerror=l.bind(null,t.onerror),t.onload=l.bind(null,t.onload),o&&document.head.appendChild(t)}},r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.p="/",r.gca=function(e){return e={17896441:"7918",17993280:"3763",25550387:"7998",38286337:"7891",59362658:"2267",67501116:"7927",80672435:"827",84421286:"8068","46e07f22":"35","86a9e106":"68","3a4d34a4":"100","1c473699":"169","452ca03d":"197",e47e0d66:"204","5ba21c60":"316","989f8913":"422",d4b91e16:"478",e5aefb32:"646","291eecb5":"669",fad28139:"690","5c554389":"700",c579c9d5:"795","46a34776":"814","5cbdb68b":"822","4f423213":"890","5942b011":"906","8717b14a":"948",d979248c:"955","8d690f83":"956","46a10cb0":"961",f5cb1005:"973",b56693a5:"993",f4aed320:"995","163132fa":"1003",c141421f:"1004","77883ee0":"1159","0f33b5a0":"1181",b0231ac1:"1184","6b2d7eab":"1218","5f7bbd13":"1282",f578f36f:"1326",a33d13d7:"1476",fef1c6ce:"1496","774fa26e":"1532",a77c5620:"1537","04ea8698":"1605","3c27faaf":"1775",d9f32620:"1914","38379c4e":"2001",cb7ffda8:"2162",ef4ba5ad:"2175","5ee29e23":"2272",d8902fcc:"2298",a1ed6f1c:"2349",e273c56f:"2362","8dac1041":"2380","6d5a3e93":"2432",d42da95e:"2503","51768be3":"2520","814f3328":"2535","7cca1b9d":"2594","330dc111":"2613","46a9a46c":"2619","5775363c":"2736","288e25b0":"2768",cef5cc3c:"2795",c9588a75:"2823","3364bf3a":"2852","8420653b":"2893",c5d94311:"2897","966495f6":"2914","03a30274":"2931","6e967b28":"3015","3229c66e":"3027","1f391b9e":"3085",a6aa9e1f:"3089","31cfe636":"3095","0e384b89":"3250","5b3ec575":"3292","4ce86281":"3316","427de7f9":"3336",a76282a6:"3402",ddffc12b:"3424",eac6da66:"3427","3f3f3e04":"3507","73664a40":"3514","96c2f7d6":"3535","9e4087bc":"3608",aba21aa0:"3629","01729fb2":"3651","4df25f71":"3668","6d0d9e3a":"3676","38535e97":"3710",c115105f:"3723","3720c009":"3751","547cb5d0":"3943","898514b1":"3954","12b6bc25":"3963","01a85c17":"4013",f81c1134:"4031",f3399ff4:"4038","9b93ab06":"4055",daaaf687:"4060","815f8246":"4061","8b117445":"4082","0058b4c6":"4088",a343d9b7:"4128",b7edfec4:"4131","464677f0":"4171",c4f5d8e4:"4195","93db065f":"4200","8c4a08c1":"4220","1c14c0d8":"4232","862952af":"4290","7b816787":"4331",ec7aad68:"4363",a94703ab:"4368","09e16a24":"4449","2994c633":"4481","4285872d":"4530",dcbd927b:"4578","11e9027a":"4666",bde0464f:"4672","1e806f68":"4681","738b06b1":"4692","04f93229":"4847","659f2bcf":"4850",c031a935:"4852",c04ce839:"4878","4f8af149":"4885","69fe9340":"4893","8cbdf981":"5011","8ac80767":"5182","5c15c9b7":"5244",e346864f:"5254","3217192f":"5265",bb3642ad:"5276",c6a4560a:"5280",b1f4e2a5:"5302","41ab0200":"5352","6ab2e55f":"5356","00f847ac":"5364",d6a1e0e9:"5392","906ea606":"5413","86ec3cfb":"5484",b4fc381c:"5490",cf215d16:"5543","5d2acf3c":"5650",f0b67563:"5662","7a3342d3":"5684","9b18272e":"5809",c6dfe076:"5818",ce49394d:"5869",a7456010:"5980","9c50fbe7":"6023","4f2c9e02":"6038",ccc49370:"6103","780afde6":"6105",f027a196:"6152",fa93c8bd:"6156","81e7cf41":"6200",b95799e0:"6205","3e686edc":"6216",f5c99320:"6229",b311c601:"6390","8d3d6164":"6427","4c314a12":"6433","34e9dd98":"6470","69ade99f":"6633",c15d9823:"6642","87052ec2":"6677",efc0eea7:"6698","13369b41":"6826","07badaf3":"6832","3b1950e6":"6939",d152cda6:"6978",e4a7c5ab:"7133",b6df69e7:"7156","8b1f332b":"7327",c18a971d:"7375",acecf23e:"7393","7c8bb838":"7398","393be207":"7414","6e5ef60f":"7450","6339ac36":"7536",ba18253d:"7662","95259ea0":"7698","496ac0ab":"7774",b6300ee2:"7779","31c1c968":"7786",e2508be1:"7886","1a4e3797":"7920","85e5b3f1":"7924",c4de80f8:"7943","22edd90a":"8028",f7bfd607:"8254","53223ecf":"8263","5a16d0cc":"8273",bb16fc39:"8348",e2c4e012:"8380",c6a0e813:"8398","66cd880a":"8470","87e99b5e":"8508",a7bd4aaa:"8518",e32388c0:"8521","58bb7da0":"8551","5e90a9b3":"8554","6875c492":"8610",f82cd581:"8626","4199ce38":"8628",f4f34a3a:"8636",dfd0626d:"8765","18b78d02":"8770","19a83d05":"8833",cd23a23e:"8882",a307de4a:"8914","925b3f96":"9003","6d1ce1ea":"9107","36994c47":"9208","4188a2b0":"9257","245ce2cf":"9320","3a2db09e":"9361","9c155e26":"9367",b94991c3:"9469","7661071f":"9642","8f5e5656":"9658","5e95c892":"9661","92ce638f":"9781","63747f2c":"9852","3f966df8":"9868",ef09af6b:"9892","9f37591a":"9898",df203c0f:"9924","64d316a4":"9960"}[e]||e,r.p+r.u(e)},(()=>{var e={1303:0,532:0};r.f.j=(c,a)=>{var f=r.o(e,c)?e[c]:void 0;if(0!==f)if(f)a.push(f[2]);else if(/^(1303|532)$/.test(c))e[c]=0;else{var d=new Promise(((a,d)=>f=e[c]=[a,d]));a.push(f[2]=d);var b=r.p+r.u(c),t=new Error;r.l(b,(a=>{if(r.o(e,c)&&(0!==(f=e[c])&&(e[c]=void 0),f)){var d=a&&("load"===a.type?"missing":a.type),b=a&&a.target&&a.target.src;t.message="Loading chunk "+c+" failed.\n("+d+": "+b+")",t.name="ChunkLoadError",t.type=d,t.request=b,f[1](t)}}),"chunk-"+c,c)}},r.O.j=c=>0===e[c];var c=(c,a)=>{var f,d,b=a[0],t=a[1],o=a[2],n=0;if(b.some((c=>0!==e[c]))){for(f in t)r.o(t,f)&&(r.m[f]=t[f]);if(o)var i=o(r)}for(c&&c(a);n