Mapbox GL JS:将基础层设置为白色?

2024-03-28

我想显示带有白色背景的 Mapbox GL JS 地图,而不是地图背景。

这是我现在的代码:

mapboxgl.accessToken = 'mytoken';
var map = new mapboxgl.Map({
    container: 'map',
    style: 'mapbox://styles/mapbox/light-v9',
    minZoom: 4,
    maxZoom: 14,
    center: [-2.0, 53.3],
});

如何用纯白色替换浅色背景?如果我改变style to white然后我得到一个错误。


您不需要在 Mapbox Studio 中创建样式,您可以在浏览器中创建它:

var map = new mapboxgl.Map({
    container: 'map',
    style: {
        version: 8,
        sources: {

        },
        layers: [
          {
            id: 'background',
            type: 'background',
            paint: { 
              'background-color': 'white' 
            }
          }
        ]

      },
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Mapbox GL JS:将基础层设置为白色? 的相关文章

  • 类型错误:EventEmitter 不是新 MapboxGeocoder 的构造函数

    使用Vue 3 typescript vite 已经用Vite Vue 3 typescript搭建了项目 使用谷歌地图时遇到麻烦 因为它需要付费 然后尝试了 Mapbox 地图部分工作正常 但在添加 MapboxGeocoder 时显示错
  • 如何向 MapBox GL JS 地图添加标记?

    我正在尝试将标记添加到 HTML Javascript 地图中的 MapBox GL JS 地图 我尝试构建一个小示例 这是我的代码
  • 创建自定义 UI 视图类以用作地图注释

    我使用故事板创建了一个自定义 UIView 我不希望它位于故事板中的坐标 但我希望能够在整个应用程序中的地图上不同位置重用它像这样 我还希望能够根据用户的请求更新其中的文本 并且只要单击绿色按钮 其中的数字就会增加 我也想自定义下面的图像
  • Mapbox - 来自 GeoJson 属性的自定义标记图标

    我正在从一组 GeoJson 对象渲染标记 我想使用自定义图标作为标记 但无法确定正确的语法 下面是我用来渲染 geojson 的部分代码 asGeoJson gt type Feature properties title get lis
  • Leaflet/Mapbox渲染问题(灰色区域)

    由于某种原因 我的地图上有一个很大的灰色区域 直到我移动它使其出现 但乍一看 有一个部分缺失了 我以前在网上见过很多这样的情况 但直到现在才想知道如何解决它 这是一个使用 MarkerClusterGroup 作为集群的简单 Mapbox
  • mapboxgl.js 与 leaflet.js

    我即将启动一个 Web 应用程序 其主要目的是显示 Mapbox 地图 切换图层并根据与地图的交互显示数据 我想知道我应该使用 mapboxgl js 和 leaflet js mapboxgl js 或 leaflet js 每个人都一直
  • Mapbox 与 Angular 6.“找不到地图容器”错误

    我正在开发我的第一个角度网络应用程序 我想介绍一些类似于谷歌地图的东西 由于新的计费策略 我不想使用最后一个 所以我尝试了 MapBox 按照教程 我成功创建了我需要的地图 问题是 我不知道如何在角度分量上显示它 我为地图生成了这个文件 并
  • “Mapbox 地图”的自动缩放

    在情节网站上Python 中的地图配置和样式 https plotly com python map configuration automatic zooming or bounds fitting描述了如何自动缩放 地理地图 impor
  • Mapbox GL 弹出窗口 .setDOMContent 示例

    我正在尝试创建一个自定义按钮 以显示在生成动态链接 URL 的弹出窗口中 由于时间原因 我似乎无法通过 setHTML 执行此操作 无法在运行时将按钮绑定到函数 所以我想我应该尝试新的 setDOMContent 关于此功能如何工作的在线信
  • 使用 Mapbox 过滤掉国家/地区

    是否有可能使用 Mapbox 仅显示德国国家边界和内部数据 我不想展示世界其他地方 Thankx Markus 是的 使用德国 GeoJSONhttp code highcharts com mapdata http code highch
  • 将 Leaflet.AwesomeMarkers 插件与 Font Awesome 5 一起使用?

    如何将传单插件升级到 Font Awesome 5Leaflet awesome markers https github com lvoogdt Leaflet awesome markers 这个插件已经有一段时间没有在github上更
  • ngx-mapbox-gl 弹出窗口内的按钮单击事件未触发

    我正在使用这个用于地图框的角度库来渲染地图ngx mapbox gl https github com Wykks ngx mapbox gl我在 mouseenter 事件上显示一个弹出窗口 mapInstance on mouseent
  • Mapbox:仅当注释在屏幕上可见时才添加注释

    我将注释数据存储在 Firebase 的数据库中 我发现只要注释没有自定义视图 我就可以下载 10 000 个注释的数据并将这些注释添加到我的地图中 而不会出现太大的延迟 然而 对于我的应用程序 我需要使用自定义视图 每个注释视图都是由多个
  • 如何在本机反应中使用 MapLibre GL Js

    我正在寻找一种在我的反应本机应用程序中使用 OpenStreetMap 数据的方法 在我最近的研究中 我发现MapLibre https maplibre org 这是基于MapBox GL旧版本的免费选项 我面临的问题是 除了 react
  • mapboxgl.Marker如何去除

    我习惯了 参考https docs mapbox com mapbox gl js example drag a marker https docs mapbox com mapbox gl js example drag a marker
  • 自定义图标标记有时无法在 React-Native 中的 MapBox-GL 中工作

    我正在尝试编辑地图标记 如下图所示 这是我创建标记的代码 const MapBoxComponent gt const markers useState title hello coordinates 108 24065199465605
  • 未捕获的类型错误:fs.readFileSync 不是函数

    我正在尝试获取 webpack 和地图盒 GL https github com mapbox mapbox gl js blob master webpack config example js在 Meteor 系统中协同工作 我到处都查
  • 使用python在scattermapbox中围绕点绘制多边形

    我在用散点图箱 https plotly com python scattermapbox 在地图上绘制点 我想画出覆盖的多边形 x milePOI 的半径 dcc Graph id map graph application callba
  • ReactJS Mapbox-gl 无效类型:“容器”必须是字符串或 HTMLElement

    我正在使用 ReactJS 和 Mapbox GL JS 构建一个小型应用程序 const MapRender gt const mapContainerRef useRef null const map new mapboxgl Map
  • 使用 MapBox GL JS 无需访问令牌

    有没有办法使用MapBox GL JS没有访问令牌 我在文档中找不到任何提示MapBox GL JS https docs mapbox com mapbox gl js api 然而 Uber建议是可以通过他们的图书馆 https ube

随机推荐

  • 更改 TortoiseGit 中的存储库 url

    我们刚刚将 git 存储库更新到了新位置 我正在使用 TortoiseGit 进行一些未提交的更改 我可以在任何地方更改文件夹引用吗 我在上下文菜单中没有看到该选项 如果可以避免的话 我宁愿不重新创建和合并 因为总共大约有 14 个存储库
  • 使用现有的 Rails 应用程序添加 twitter-bootstrap-rails

    我尝试将 twitter bootstrap rails 与现有的 Rails 应用程序一起使用 并在刷新页面时收到以下错误 没有要加载的文件 less 在 app assets stylesheets bootstrap and over
  • 如何将UIScrollView的触摸事件发送到其后面的视图?

    我在另一个视图之上有一个透明的 UIScrollView 滚动视图有内容 文本和图像 用于显示信息 它后面的视图有一些用户应该能够点击的图像 并且它们上面的内容可以使用提到的滚动视图进行滚动 我希望能够正常使用滚动视图 尽管没有缩放 但是当
  • 节点检查器无法连接到节点

    我运行节点 node debug app OR node debug brk app 它回应 debugger listening on port 5858 Express server listening on port 1338 我现在
  • 将 varchar 值转换为 int,如果输入错误,不会引发异常

    有没有办法调用 Sql Server 函数 Convert Cast 而不让它们抛出异常 基本上 我有一列包含字母数字数据 我正在从字段中提取值 并且我想将数据显示为整数值 有时提取的数据不是数字 在这些情况下我希望 Sql Server
  • 为什么我嵌入的 JointJS 元素重叠?

    我正在研究 JointJS 图 使用 DirectedGraph 来处理布局 我试图实现类似于下图的效果 我需要将节点 A B C D E F G H I J 概述 或包含在单独的节点 Foo Bar Hmm 中 当我将所有元素添加到图表中
  • Android 插件将使用哪个 cmake?

    在 Android Studio 3 3 中 我使用本机 C 库 它是用 CMake 构建的 Android 插件 v 3 2 1 将根据配置选择 内置 或 外部 cmakeexternalNativeBuild 如记录于开发者 andro
  • 证书被苹果拒绝

    While configuring certificate for Push Notification on my ios build of cordova project using OneSignal the certificate i
  • 带百分比的虚线圆条

    我正在尝试制作一个带有虚线的圆形进度条 我以编程方式创建stroke dasharray and stroke dashoffset用百分比画一个圆 我需要绘制虚线圆 而不是实心圆 如下所示 我无法将实心圆更改为虚线圆 我是否遗漏了一些东西
  • 使用 C# 中的字典计算字符串中每个重复单词的出现次数[关闭]

    Closed 这个问题需要细节或清晰度 help closed questions 目前不接受答案 编辑 我详细阐述了我的问题更多 解决方案在这里用于修复重复的单词 有人问我每个重复的单词 我是新手 可能不是一个好问题 这是字符串 stri
  • 在屏幕中央显示 Windows 窗体(双屏)

    我有双显示器 想要在屏幕中央显示一个窗口窗体 我有一个变量 MonitorId 0 或 1 I have System Windows Forms Screen allScreens System Windows Forms Screen
  • 解决错误 MSB8011:无法注册输出

    一个奇怪的错误 错误 MSB8011 无法注册输出 请尝试启用每用户 从命令提示符重定向或注册组件 提升的权限 C 程序 文件 MSBuild Microsoft Cpp v4 0 Microsoft CppCommon targets 7
  • Flutter:CupertinoTabBar 在移动到下一个屏幕时不会消失

    我正在运行 Google 的 Flutter Gallery 示例 https github com flutter flutter blob master examples flutter gallery lib demo cuperti
  • Angularjs 1.5 组件模式,带有回调函数,由 IE11 中的嵌入对象多次调用,不更新 Angular 绑定

    在 IE 11 中 我有一个 Angularjs 1 5 模态组件 如下所示 模式打开 在渲染事件中 它使用该组件中包含的回调函数调用角度应用程序外部的函数 这个外部函数启动一个安装过程 启动一个嵌入对象 如下所示 然后定期调用回调函数 我
  • 如何获取Spring事务管理器实例?

    我使用注释来标记应在事务中执行的方法 但是 在一个地方我需要做transactionManager rollback 手动 无注释 我怎样才能获得transactionManager object 如果你想回滚当前事务 你可以使用 Tran
  • 注释正则表达式

    我正在尝试在 JavaScript 中注释正则表达式 似乎有很多关于如何remove使用正则表达式的代码注释 但实际上不是如何commentJavaScript 中的正则表达式因此更容易理解 不幸的是 JavaScript 没有像其他语言那
  • 当缓冲区有未保存的更改且未命名时退出 vim?

    我在 vim 中创建了一个空白的 临时缓冲区 即不与特定文件关联 方法是使用 vnew 然后我玩了一些文本 现在我只想退出编辑器 不保留这个 临时缓冲区 的内容 当我输入命令时 q Vim 给我 No Name E37 No write s
  • 如何增加 Angular UI Bootstrap 中的模式宽度?

    我正在创建一个模式 var modal modal open templateUrl partials welcome controller welcomeCtrl backdrop static scope scope 有没有办法增加它的
  • 如何在vuejs中的输入文本中添加禁用属性?

    我有2个网址 register register sponsor 4 The register路线会给我一个干净的输入文本 我可以在其中输入所有内容第二条路由将带来相同的输入 但其值为 4 并且已禁用 因此用户无法修改它 我设法使用 vue
  • Mapbox GL JS:将基础层设置为白色?

    我想显示带有白色背景的 Mapbox GL JS 地图 而不是地图背景 这是我现在的代码 mapboxgl accessToken mytoken var map new mapboxgl Map container map style m