我设法在硬盘上保存了使用 html2canvas 通过 Google Maps API 生成的地图的屏幕截图。我现在尝试使用 MapBox API 做同样的事情,但我在硬盘上得到的只是一张黑屏 jpg。
这是我的 HTML 代码:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="css/main.css">
<script src='https://api.tiles.mapbox.com/mapbox-gl-js/v0.12.2/mapbox-gl.js'></script>
<script src="js/html2canvas.js"></script>
</head>
<body onload="initialize()">
<div id="map"></div>
<script src="js/coordinates.js"></script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
使用此 CSS 全屏显示:
html { height: 100%; }
body { height: 100%; margin: 0px; padding: 0px; }
#map_canvas { width: 100%; height: 100%; }
Run Code Online (Sandbox Code Playgroud)
这个 JS 脚本用于创建地图并截取屏幕截图:
mapboxgl.accessToken = 'pk.eyJ1IjoiZ2luZ2FsYWJ2IiwiYSI6ImNpaWluNXIzbDAwMjB3ZG02c2hmNGhhMnUifQ.5SC9qnrK7eEdAtwv5Z0S_Q';
var latitude = 48.858565;
var longitude = 2.347198;
function initialize()
{
var map = new mapboxgl.Map( …Run Code Online (Sandbox Code Playgroud) 我想创建用户生成的地图和路径并将其导出到视频。在此页面上,https://uber.github.io/kepler.gl/#/demo/ukcommute,我看到它们导出到照片。是否可以从 mapboxGL 地图创建视频?
我尝试使用以下代码更改 line-dasharray 设置,
'line-dasharray': [
"case",
['==', ['get', "user_class_id"], 'laneway'],[0.2,2],[0.3,2]
]
Run Code Online (Sandbox Code Playgroud)
它给出了这个错误,
Error: layers.gl-draw-line-active.hot.paint.line-dasharray[2][0]: Expression name must be a string, but found number instead. If you wanted a literal array, use ["literal", [...]].
Run Code Online (Sandbox Code Playgroud)
所以我根据错误建议修复了代码,
'line-dasharray': [
"case",
['==', ['get', "user_class_id"], 'laneway'],['literal',[0.2,2]],['literal',[0.3,2]]
]
Run Code Online (Sandbox Code Playgroud)
它给了我这个错误,
evented.js:136 Error: layers.gl-draw-line-active.hot.paint.line-dasharray: data expressions not supported
Run Code Online (Sandbox Code Playgroud)
有谁知道如何解决这个问题?
使用react-native-mapbox-gl/maps,当aSymbolLayer动态添加到a时ShapeSource,似乎没有显示,或者ShapeSource没有更新。
这是要重现的示例:根据CustomIcon示例,我用下面的代码替换了代码。要重现,只需执行示例,复制粘贴代码来代替CustomIcon.js示例中的现有代码。
import React from 'react';
import { View, Text } from 'react-native';
import MapboxGL from '@react-native-mapbox-gl/maps';
import sheet from '../styles/sheet';
import BaseExamplePropTypes from './common/BaseExamplePropTypes';
import Page from './common/Page';
import Bubble from './common/Bubble';
const styles = {
icon: {
iconAllowOverlap: true,
},
view: {
width: 60,
height: 60,
borderColor: 'black',
borderWidth: 1,
alignItems: 'center',
justifyContent: 'center'
},
text: {
fontSize: 50
}
};
const customIcons …Run Code Online (Sandbox Code Playgroud) 抱歉,因为我是新人...我在哪里可以找到可以在工作室上传和使用的所有公共样式的 Mapbox 库?mabox网站上只有4个样式,但是用户创建了很多公共样式,哪里可以下载?
在过去的几个小时里,我一直用头撞桌子。
我试图让 Mapbox 放大所有标记的边界区域的负载。
但是,这是我在下面的代码中遇到的错误。
此错误出现在下面的控制台日志图像之后,因此 lat lng 坐标肯定存在。
未捕获的错误:无效的 LngLat 对象:(NaN,NaN)
const onLoad = () => {
let points = [];
props.cats.forEach(cat => (
points.push([ cat.lat, cat.lng ])
));
points.length > 0 && ref.current.getMap().fitBounds(points, {
padding: { top: 50, bottom: 50, left: 50, right: 50 },
easing(t) {
return t * (2 - t);
},
});
};
Run Code Online (Sandbox Code Playgroud)
这是我的代码:
fig = px.choropleth_mapbox(district_df[['District','Confirmed','Deaths','id','province']], geojson = geo_df, locations='id', color='Confirmed',
color_continuous_scale="Viridis",
mapbox_style="carto-positron",
zoom=5.9, hover_name = 'District',hover_data = {'District':False, 'Confirmed':True,'Deaths':True,'province':False,'id':False},
opacity=0.5, center = {"lat": 28.3949, "lon": 84.1240})
Run Code Online (Sandbox Code Playgroud)
我想禁用缩放选项。有办法吗?
运行 pip install mapbox-tilesets 时,在收集 rasterio 过程中,我在 Windows 10 计算机上收到以下错误,特别是在构建轮子的要求时出现错误。详细信息如下。
Collecting rasterio
Using cached rasterio-1.1.8.tar.gz (2.1 MB)
Installing build dependencies ... done
Getting requirements to build wheel ... error
ERROR: Command errored out with exit status 1:
command: 'C:\Users\Sandy Haaf\AppData\Local\Microsoft\WindowsApps\PythonSoftwareFoundation.Python.3.8_qbz5n2kfra8p0\python.exe' 'C:\Program Files\WindowsApps\PythonSoftwareFoundation.Python.3.8_3.8.2032.0_x64__qbz5n2kfra8p0\lib\site-packages\pip\_vendor\pep517\_in_process.py' get_requires_for_build_wheel 'C:\Users\Sandy Haaf\AppData\Local\Temp\tmp5nhr9kl_'
cwd: C:\Users\Sandy Haaf\AppData\Local\Temp\pip-install-gj86e2z4\rasterio
Complete output (2 lines):
INFO:root:Building on Windows requires extra options to setup.py to locate needed GDAL files. More information is available in the README.
ERROR: A GDAL API version …Run Code Online (Sandbox Code Playgroud) 我的地图实例位于可调整大小的容器中,当我更改大小时,我应该调用map.resize()。我想知道是否有一种方法可以监听 mapbox 容器调整大小事件,以便它可以触发 map.resize() ?你能建议如何做吗?
export default function Map({ chartID, configuration, data }) {
const classes = useStyles();
const mapContainer = useRef(null);
const [map, setMap] = useState(null);
const [settings, setSettings] = useState({
longitude: -73.935242,
latitude: 40.73061,
zoom: 9,
});
useEffect(() => {
const geoFeatures = //...getting data
const map = new mapboxgl.Map({
container: mapContainer.current,
style: 'mapbox://',
center: [settings.longitude, settings.latitude],
zoom: settings.zoom,
});
map.on('move', () => {...});
//setting map to state if we need to reference it later
setMap(map);
// Clean …Run Code Online (Sandbox Code Playgroud) Scattergeo我正在尝试在密度地图框顶部添加跟踪或叠加层white-bg,以获取通用美国各州轮廓的热图。
我使用的原因scattergeo是我想在密度地图框的顶部绘制一个星形符号,并且唯一接受的符号add_scattermapbox是一个点。如果您选择star符号,则不会添加任何符号。
mapbox_styles我还知道星号对于add_scattermapbox或 的p 是可以接受的density_scattermapbox,但目前我无法在试用金额用完后按网络负载付费。
有没有一种聪明的方法可以在图上添加星号density_mapbox?
工作分散地理
fig = go.Figure(go.Scattergeo())
fig.add_scattergeo(lat = [30, 40]
,lon = [-90, -80]
,hoverinfo = 'none'
,marker_size = 10
,marker_color = 'rgb(65, 105, 225)' # blue
,marker_symbol = 'star'
,showlegend = False
)
fig.update_geos(
visible=False, resolution=110, scope="usa",
showcountries=True, countrycolor="Black",
showsubunits=True, subunitcolor="Black"
)
fig.show()
Run Code Online (Sandbox Code Playgroud)
工作密度Mapbox
d = {'Location': ['Point A', 'Point B'], 'lat': [30, 40], 'long': [-90, -80], 'z': [100,200]} …Run Code Online (Sandbox Code Playgroud) mapbox ×10
mapbox-gl ×4
mapbox-gl-js ×4
python ×3
javascript ×2
plotly ×2
reactjs ×2
choropleth ×1
gdal ×1
html2canvas ×1
rasterio ×1
react-map-gl ×1
react-native ×1
styles ×1