mapbox

Flutter : Mapbox symbol on click open google maps

由 江枫思渺然 提交于 2020-12-15 02:59:14
问题 I have project using MapBox to show address location in map. I have latitude and longitude ( -6.192461941069894 , 106.97593586545025 ) like this , i want if i click right on marker, i want open Google Maps Apps based on latitude and longitude i have. But the problem , i can't open google maps after click symbol because latitude&longitude after click maps not same with latitude&longitude i have. Logic Source Code onMapClick: (point, latlng) { if (latlng.latitude == latitude && latlng.longitude

MapBox can't add react component on markers popup

由 末鹿安然 提交于 2020-12-13 04:43:56
问题 I have been working on a Real Estate project and I've got stuck on adding a reactcomponent inside a markers popup. The image below shows the example of how the popup should look like: Popup example This is the code where I am trying to add the popup on the marker: var card = <Card /> var popup = new mapboxgl.Popup({ offset: 25 }) .setDOMContent(ReactDOM.render(card, document.getElementById('map'))) var marker = new mapboxgl.Marker(el) .setLngLat(coordinates) .setPopup(popup) .addTo(map);

MapBox can't add react component on markers popup

由 与世无争的帅哥 提交于 2020-12-13 04:43:50
问题 I have been working on a Real Estate project and I've got stuck on adding a reactcomponent inside a markers popup. The image below shows the example of how the popup should look like: Popup example This is the code where I am trying to add the popup on the marker: var card = <Card /> var popup = new mapboxgl.Popup({ offset: 25 }) .setDOMContent(ReactDOM.render(card, document.getElementById('map'))) var marker = new mapboxgl.Marker(el) .setLngLat(coordinates) .setPopup(popup) .addTo(map);

mapbox-gl：弹出气泡

由 萝らか妹 提交于 2020-12-12 19:50:44
}地图开发中，弹出气泡的功能也是经常使用到的，显示poi的详细信息，加载一些多媒体的信息，同时，气泡跟随对应poi的位置进行移动。 mapbox-gl有对应的弹出气泡实现：Popup，通过初始化气泡对象就能够实现气泡的效果。 气泡通过 setLngLat 设置气泡在地图上的位置，这样才能随着地图移动而进行变化。 点击一个poi，显示气泡的效果： map . on ( 'click' , 'places' , function ( e ) { //获取点击对象的坐标信息 var coordinates = e . features [ 0 ] . geometry . coordinates . slice ( ) ; //气泡的内容放在图层源数据的属性中 var description = e . features [ 0 ] . properties . description ; //添加气泡到地图上 new mapboxgl . Popup ( ) . setLngLat ( coordinates ) . setHTML ( description ) . addTo ( map ) ; } ) ; 鼠标移动到对象上，显示气泡的事件： map . on ( 'mouseenter' , 'places' , function ( e ) {}); 鼠标移出对象

mapbox-gl添加下雪效果

由 自闭症网瘾萝莉.ら 提交于 2020-12-12 19:39:40
原理： webgl制作snowing效果 叠加上一个制作的snowing canvas到mapbox gl的canvas下面 效果： 源码： <! DOCTYPE html > < html lang ="en" > < head > < meta charset ="UTF-8" > < title > Title </ title > < style > #canvas { position : absolute ; top : 0 ; left : 0 ; height : 100% ; width : 100% ; } </ style > </ head > < body > < canvas id ="canvas" ></ canvas > < script src ="../resources/webgl-utils.js" ></ script > < script id ="2d-vertex-shader" type ="x-shader/x-vertex" > attribute vec2 a_position; uniform vec2 u_wh; void main() { gl_PointSize = 4.0 ; vec2 t1 = a_position * 2.0 / u_wh ; vec2 t4 = vec2(t1.x - 1.0 ,(t1.y -

Data-driven Raster Layer with Mapbox GL

由 柔情痞子 提交于 2020-12-12 18:47:59
We at Ubilabs recently had the opportunity to inspect the internal workings of Mapbox GL JS , because we wanted to add some functionality to it. Mapbox did an amazing job with their implementation, still for our specific use case we had to fork and extend the library: Our goal was to implement a data-driven raster layer . Mapbox already includes a raster layer type, which can be used to render raster tiles to the map, e.g. for sattelite imagery. Also it offers a point layer, which can style its point color based on the underlying data, hence the term data-driven . We wanted to combine these

Mapbox GL JS Bearing

由 ↘锁芯ラ 提交于 2020-12-06 06:43:45
问题 Is it possible in Mapbox GL JS to get the users bearing? I would like to show the direction in which the user is facing, to assist them in navigating to nearby POI. I understand that it is possible to set the bearing of the map and also get the current bearing of it, but i need the actual real life bearing of the user. Kind of the same thing as on Google Maps: The service is intended to run as an Ionic app on iOS and Android, and the assistance in bearing is a key feature in helping them

巨头们的GitHub仓库整理

由 爱⌒轻易说出口 提交于 2020-11-20 07:39:06
1.Google >1.Google >https://github.com/google >2.Google Samples https://github.com/googlesamples >3.Google Codelabs >https://github.com/googlecodelabs >4.GoogleChrome >https://github.com/GoogleChrome >5.Google Creative Lab >https://github.com/googlecreativelab >6.Google Internationalization 人人皆可使用的Google开源字体 >https://github.com/googlei18n >7.tensorflow https://github.com/tensorflow 2.Facebook >1.Facebook >https://github.com/facebook >2.Facebook Samples >https://github.com/fbsamples >3.facebookresearch >https://github.com/facebookresearch >4.Facebook Incubator >https://github.com
订阅 mapbox