可以在传单地图中设置 MBTiles 样式吗?

2024-01-02

我正在尝试显示 .mbtiles 图层(由蒂佩卡诺 https://github.com/mapbox/tippecanoe)在传单地图中。瓷砖上装有Leaflet.TileLayer.MBTiles https://gitlab.com/IvanSanchez/Leaflet.TileLayer.MBTiles。到目前为止,地图上看不到任何东西,尽管 MBTiles 加载良好并且可以在浏览器的检查器控制台中识别。我猜测,因为我没有使用 MapBox Studio(或类似的)对 MBTiles 进行外部样式设置,所以它们没有分配任何样式(颜色、大小等...)。

是否可以使用 CSS、JS 或 html 中的其他方式设置 .mbtiles 的样式?我发现 .mbtiles 通常有一个关联的 style.json 文件——是否可以编写我自己的文件并在 html 或 javascript 中调用该文件以实现 Leaflet?

这是我的代码的相关部分:

var map = L.map('map', {layers: [ESRIOceanBaseMap]}).setView([33.985, -120.25], 12);
var mb = L.tileLayer.mbTiles('https://raw.githubusercontent.com/evantdailey/map_testing/master/2016668FA.mbtiles', {
    type: 'circle',
    minZoom: 0,
    maxZoom:25
}).addTo(map);

我希望在 CSS 中做这样的事情(似乎不起作用):

#mb {
    color: black
}

如果以上都不可行,是否有其他方法可以为 Leaflet 设置 MBTiles 样式,而无需通过 MapBox Studio 并为每个图层分配样式?目标是以编程方式创建多个层(每个层包含数千个点),因此单独设计和导出每个层并不理想。


MBTiles https://github.com/mapbox/mbtiles-spec格式可用于vector or raster数据。对于由 Tippecanoe 创建的 MBTiles 集,它包含vector data.

尽管可能没有明确编写,但 Leaflet.TileLayer.MBTiles 插件仅处理raster瓷砖(PNG 或 JPG)(截至今天)。

渲染vector数据(使您能够在运行时设置其样式),您应该看看Leaflet.VectorGrid https://github.com/Leaflet/Leaflet.VectorGrid插入。不幸的是,它目前不能与矢量 MBTiles 设置一起开箱即用。

如果您有兴趣,可以看看https://github.com/Leaflet/Leaflet.VectorGrid/issues/54 https://github.com/Leaflet/Leaflet.VectorGrid/issues/54

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

可以在传单地图中设置 MBTiles 样式吗? 的相关文章

  • 禁用引导列上的滚动

    我正在尝试禁用引导列上的滚动 这是我的代码 div class container fluid h 100 div class row h 100 div class col 4 h 100 bg dark fixed div div cl
  • Meteor:应用程序无法在 0.9.1.1 版本上运行

    出现类似错误 Error TypeError undefined is not a function evaluating Template create anonymous function iron dynamic template j
  • Google App Engine:修改云运行环境

    我正在尝试部署一个使用自定义 Node js 服务器的 Next js 应用程序 我想将自定义构建变量注入应用程序 next config js const NODE ENV process env NODE ENV const envTy
  • 如何抑制窗口鼠标滚轮滚动...?

    我正在开发嵌入页面中的画布应用程序 我有它 因此您可以使用鼠标滚轮放大绘图 但不幸的是 这会滚动页面 因为它是文章的一部分 当我在 dom 元素上滚动鼠标滚轮时 是否可以阻止鼠标滚轮在窗口上滚动 附加鼠标滚轮 不是 Gecko DOMMou
  • JavaScript 重定向到新窗口

    我有以下代码 它根据下拉列表的值重定向到页面 我如何使其在新窗口中打开 function goto form var index form select selectedIndex if form select options index
  • 音频 blob 的 URL.createObjectURL 在 Firefox 中给出 TypeError

    我正在尝试从创建的音频 blob 创建对象 URLgetUserMedia 该代码在 Chrome 中可以运行 但在 Firefox 中存在问题 错误 当我打电话时stopAudioRecorder 它停在audio player src
  • Meteor - 从客户端取消服务器方法

    我正在通过服务器方法执行数据库计数 用户可以选择他们希望如何执行计数 然后调用该方法 我的问题是 计数可能需要一些时间 并且用户可能会在方法运行时改变主意并请求不同的计数 有什么方法可以取消调用的方法并运行新的计数吗 我认为 this un
  • 将div设置为隐藏,延时后可见

    我试图在 X 时间后 也许甚至在随机时间之后 但现在我们只做固定时间 在黑色背景上出现一个黄色方块 function initialSetup if document getElementById yellow null document
  • 表单计算器脚本基本价格未加载 OnLoad

    我的表单中有一个计算器来计算我的下拉选项选择 function select calculate on change calc input type checkbox calculate on click calc function cal
  • 如何使输入字段和提交按钮变灰

    我想变灰这两件事 http doorsplit heroku com 歌曲输入字段和提交按钮 直到用户输入艺术家 有没有一种简单的方法可以通过 JQuery 来做到这一点 艺术家输入字段的id是 request artist 你可以这样做
  • Javascript 数组到 VBScript

    我有一个使用 Javascript 构建的对象数组 我需要使用 VBScript 读取它 如下例所示 我找不到在 VbScript 代码中循环遍历数组的方法myArray object 这个例子是我的问题的简化 我无法更改页面的默认语言 这
  • Laravel 中只向登录用户显示按钮

    如果我以 John 身份登录 如何才能只显示 John 的红色按钮而不显示 Susan 的红色按钮 测试系统环境 Win10 Laravel5 4 Mysql5 7 19 table class table table responsive
  • HTML 离线应用程序缓存,列出下载的文件

    作为我正在构建的离线 Web 应用程序的加载屏幕的一部分 使用缓存清单 http developer apple com library safari documentation iPhone Conceptual SafariJSData
  • 有没有办法阻止 prettier / prettier-now 将函数参数分解为新行

    当使用 prettier prettier now 在保存时进行格式化时 当一个函数包装另一个函数时 它会中断到一个新行 我想知道是否有办法阻止这种行为 例如 期望的输出 app get campgrounds id catchAsync
  • Safari 支持 JavaScript window.onerror 吗?

    我有一个附加到 window onerror 的函数 window onerror function errorMsg url line window alert asdf 这在 firefox chrome 和 IE 中工作正常 但在 s
  • 更改文本输入标签中文本的大小?

    我有一个很大的文本输入框 但我无法更改字体大小
  • 带有相对路径的 LESS CSS 背景

    我在使用 LESS 作为我的网站的样式表时遇到了问题 就我个人而言 我宁愿在CSS中使用相对路径而不是绝对路径 这只是我的习惯 但是现在当我使用带有导入功能的LESS时 我遇到了如下所示的问题 我有一个main less根文件夹中的文件 i
  • fullCalendar 未显示正确的结束日期

    我正在看调试页面 http jsbin com wukofacaxu edit js outputFullCalendar 官方网站的 我想安排一个活动时间为 22 09 2015 至 30 09 2015 dd mm yyyy 但它只显示
  • 如何从图像输入中获取 xy 坐标?

    我有一个输入设置为图像类型
  • FireFox 中的“contenteditable = true”高度问题

    当有空的时候div with contenteditable true CSS contenteditable true border 1px dashed dedede padding 3px HTML div div 在 IE 和 Ch

随机推荐

  • 使用 imap 和 php 检索最近 3 封电子邮件

    我试图弄清楚如何使用 imap 和 php 获取最新的 3 封电子邮件 已看到和未看到 由于邮箱内有 1 000 封电子邮件 因此需要节约资源 我认为获取所有标头可能需要太多资源 我只需要发件人 主题和日期 任何想法 感谢您的任何建议 帮助
  • iPhone 上的日期字符串中的毫秒数应使用什么格式字符串?

    我需要解析包含毫秒的格式的字符串 我应该使用什么格式字符串来获取正确的日期值 例如 假设我有一个具有以下值的字符串 2011 06 23T13 13 00 000 在以下代码中我应将什么格式字符串传递给 NSDateFormatter NS
  • VB.NET 中标识符两边的方括号代表什么?

    一般来说 我对 VB 和 NET 非常熟悉 但我刚刚遇到了这段代码 Me GetType 周围括号的用途是什么GetType 方括号用于告诉编译器应该将其解释为类型 即使它是关键字 但你的例子应该是一样的Me GetType 例如 您可以将
  • 良好的 DRY 方法来渲染和 AJAX 更新页面

    想象一下一个评论网站 用户可以在其中输入评级和可选的简短评论 在每个评论页面上 您都会收到许多评论 这些评论显示在页面末尾的表格中 顺便说一句 不寻找数据网格类型控件 太简单了 我想让用户输入新评论并更新页面而无需刷新页面 到目前为止都是简
  • MEF 和 ASP.NET MVC

    我想将 MEF 与 asp net mvc 一起使用 我写了以下控制器工厂 public class MefControllerFactory DefaultControllerFactory private CompositionCont
  • 如何检测在CustomList中单击了哪个按钮以及在哪个位置

    我正在使用自定义列表视图 其中每个项目都有两个按钮 以下是我的项目 xml
  • 导出 JSON 数据并加载到关系数据库中

    是否有将 JSON 数据转换为具有多个表的关系数据库的标准方法 我们需要从 MongoDB 实例导出数据并将其导入 Redshift 集群 唯一的问题是一些 MongoDB 字段包含对象和数组 Redshift 集群接受 CSV 因此我认为
  • 从登录页面删除导航菜单

    有基本的 html admin layout html 我写的 div div div div 有兴趣知道如何从登录页面删除管理导航 尝试设置变量隐藏菜单登录控件并用 ng if hide menu 隐藏它 但这对我不起作用 它隐藏所有管理
  • Appium 错误 Xcode 找不到与“com.facebook.WebDriverAgentRunner”匹配的配置文件

    我在真实 iOS 设备上执行自动化时遇到问题 系统配置 应用程序1 6 0 设备 iPhone 5c ios 10 1 代码8 2 例外是 Xcode Testing failed No profiles for com facebook
  • Chrome 控制台日志看不到 AJAX post/get 请求/响应

    我不知道它是否来自 Chrome 最近的更新之一 我不知道它是否是我在不知不觉中设法关闭的选项 但无论哪种方式 在过去几天的某个时候 我在 Chrome 上的控制台日志停止显示发布 获取请求 因此我可以看到正在发布的内容以及发回的响应内容
  • 多个RecyclerView同步滚动

    我有一个 ViewPager 每页显示一个片段 该片段包含 RecyclerView 内的项目列表 项目列表始终具有相同的大小 并且项目的视图也具有相同的高度 当滚动其中一个 RecyclerView 时 我希望其他 RecyclerVie
  • 如何调用函数的 AWS Lambda 权限列表

    要允许 AWS 服务调用 lambda 函数 您需要应用权限 这json对于此权限可能看起来有点像这样 FunctionName someFunction StatementId 1 Action lambda InvokeFunction
  • 使用 CSS 更改 SVG spritesheet sprite 的颜色

    我使用 SVG spritesheet 作为图标 我想对 hover active 进行颜色更改 我发现 更改 SVG 颜色的唯一方法是 SVG 数据是否内联 有一个很好的脚本可以将外部 svg 转换为内联 SVG 代码 如何使用 CSS
  • PHP:如何在foreach循环内移动数组指针?

    animals array cat dog horse elephant foreach animals as animal var dump animal next animals 上面的代码输出 cat dog horse elepha
  • Phonegap 数据库错误

    我正在尝试为我的电话间隙应用程序建立一个数据库 问题是除了设置表的事务之外的所有事务都会产生错误 SQLTransactionCallback 为空或引发异常 这是代码 function Datasetup db window openDa
  • 登录控制器中覆盖的经过身份验证的方法不起作用

    我试图覆盖登录控制器中的经过身份验证的方法 但不知何故它不起作用 我只是尝试简单地 dd 但仍然不起作用 下面是我的功能代码 public function authenticated Request request user dd hi
  • 未找到元素“ ”的声明

    我是使用 XML 和 XSD 文件的新手 我想做的是使用模式验证 xml 文件 这是我的 XML 文件的开头
  • 为什么C++中静态变量需要声明两次

    我有一个名为文件路径 h它定义了许多静态变量 ifndef FILEPATHS H define FILEPATHS H class FilePaths public static QString dataFolder static QSt
  • Oracle 中的 VARCHAR(MAX) 与 VARCHAR(n)

    Similar question https stackoverflow com questions 166371 varcharmax versus varcharn in ms sql server closed 但对于甲骨文来说 为什
  • 可以在传单地图中设置 MBTiles 样式吗?

    我正在尝试显示 mbtiles 图层 由蒂佩卡诺 https github com mapbox tippecanoe 在传单地图中 瓷砖上装有Leaflet TileLayer MBTiles https gitlab com IvanS