Leaflet.js:WMS 图层样式

2024-01-02

我有一个 Leaflet javascript Web 应用程序,它使用 WMS 来调用 GeoServer。返回的对象是Geometry加上属性。虽然几何图形(多边形)可以像美国的县一样渲染良好,但我需要根据县人口使县图层显示不同的颜色。

以下是加载 WMS 数据的代码:

     var wmscounty = L.tileLayer.wms("<?php echo  $geoserverwms_url; ?>", {
        layers: '<?php echo  $geoserverwms_layer_countypop; ?>',
        format: 'image/png',
        transparent: true,
        version: '1.1.1',
        attribution: "countypopulation"
    }
    wmscounty.addTo(map);

我可能使用的设置图层样式的代码是:

  function getColorCounties(d) {
        return d > 1000000 ? '#800026' :
        d > 50000   ? '#FED976' :
                          '#FFEDA0';
    }
   function styleCounties(feature) {
        return {
            weight: 2,

            fillColor: getColorCounties(feature.properties.COUNTY_POP)
        };
    }

我不知道如何将“feature”对象传递给 styleCounties() 函数?它应该在某个 onAdd() 函数中吗?或者一些“forEach”。有一些可用的示例,但我找不到 Leaflet/WMS 的任何示例。

Thanks!


我必须说我有点困惑。 WMS 是一项获取服务raster来自服务器的图像。您无法从 WMS 获取几何图形或属性。

由于 WMS 提供光栅图像,因此您无法使用 Javascript 对其进行样式设置。因此,您不能仅从 Javascript 设置权重、填充颜色等,因为当 Javascript 看到数据时,数据已经在服务器上呈现。

但是,您可以设置stylesWMS 请求中的参数,指示 WMS 服务器(在您的例子中为 GeoServer)对返回的图像应用某种样式;请参阅 GetMap 参考:http://docs.geoserver.org/stable/en/user/services/wms/reference.html#getmap http://docs.geoserver.org/stable/en/user/services/wms/reference.html#getmap.

如果您确实想控制客户端上的样式,您可能应该使用 WFS,它将为您提供矢量格式的几何图形和属性。 GeoServer 可以以 GeoJSON 格式返回它们,这使得在 Leaflet 中使用它们变得很容易。至少有一个插件可以用于此目的:https://github.com/azgs/azgs-leaflet https://github.com/azgs/azgs-leaflet(我自己没用过)。

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

Leaflet.js:WMS 图层样式 的相关文章

  • 未捕获的引用错误:$ 未定义

    我试图引用 jquery 库来在另一个 javascript 文件上提供智能感知 但我收到了错误 例如 Uncaught ReferenceError is not defined
  • 如何使 TextInput 只接受最多 2 位小数且最大值?

    这是我在 React Native 中的 TextInput 组件的代码片段 模拟器上的渲染如下所示 我想让输入字段只接受十进制数onChangeText函数 我正在更新状态的值 我有什么想法可以实现这个输入绑定的最大值吗 我要检查里面的值
  • 以跨浏览器兼容的方式触发 onresize

    我想从后面的 C 代码触发 onresize 事件 我认为这可以完成 Page clientScript RegisterScriptBlock this getType id javascript code 我尝试过 element on
  • 在 for 循环内顺序执行 Promise

    我正在努力将两个承诺链接到一个循环中 以便第二个承诺在第一个承诺得到解决之前不会启动 我看到了一个减少的例子 还无法让它工作 如果我这样做 就像我现在所做的那样 代码会并行执行 就像这样 所有异步请求都会被触发 当然结果会很混乱 请看一下
  • 查看 chrome 开发者工具中的更改差异

    devtools 可以显示原始文件和当前修改之间的差异吗 或者对于 CSS 来说是修改后的选择器及其新值的列表 我知道 本地修改 每次更改的历史 但不是原始的 当前 映射到工作区 将修改后的文件保存到其源中 源地图 请参阅预处理源 SCSS
  • 在javascript中执行curl请求?

    是否可以用 jQuery 或 javascript 发送curl 请求 像这样的事情 curl H Authorization Bearer 6Q https api wit ai message v 20140826 q 因此 在 PHP
  • 如何使用多重身份验证 - firebase?

    我有一个注册屏幕 其中包含 用户名 电子邮件 电话号码 密码 在本例中 我使用电话号码身份验证来验证号码 因此在用户验证他的号码后 我将他的数据保存到 firebase DB 中 所以在那之后 我将下摆导航到登录屏幕 应该包含电子邮件 密码
  • 在 AngularJS 中将数组绑定到指令变量

    我正在尝试将数组放入模板中 以便我可以使用其中的各个值 我的问题是 该属性一旦进入我的模板就会变成字符串 因此它不再可以作为 var 0 访问 而是返回 字符串 的第一个字符 通常是 这是数据的简化设置 varForward 100 1 v
  • html/javascript 链接到本地​​文件

    我正在尝试使用 JavaScript 显示本地文件的链接 但它不起作用 我不确定我做错了什么 html是
  • 访问指令的范围与嵌入内容隔离

    我不确定这是否真的可能 但我本质上想要 AngularJS 中 隔离范围的反转 这里有一个Plunkr http plnkr co edit 3xL5MrdJSfYH22ivkYJS展示 基本上 我设置了一个自定义指令来提供一些可重用的 H
  • 打字稿 keyof 返回字符串数组

    假设我有一堂课 class Test propA propB propC 我想创建一个返回字符串数组的方法 并将其键入为仅 Test 类中存在的键 我该如何使用keyof特征 class Test propA propB propC get
  • 如何创建自定义输入类型?

    例如 我想创建一个类似于 AngularJS 实现 电子邮件 的方式的自定义输入类型
  • 修复了 Google 地图混搭中的图例

    我有一个带有 Google 地图混搭的页面 其中的图钉按日期 周一 周二等 进行颜色编码 包含地图的 IFrame 是动态调整大小的 因此当浏览器窗口调整大小时 它也会调整大小 我想在地图窗口的一角放置一个图例 告诉用户每种颜色的含义 Go
  • close 似乎不适用于 WebSocket

    我有这个简单的 JavaScript 代码 window ws new WebSocket ws 127 0 0 1 8000 ws onopen function ws send hello Ruby 中的服务器如下所示 require
  • 如何更改 Dojo TabContainer 行为以仅打开外部链接而不是显示 ContentPane?

    我正在与一个TabContainer有几个不同的ContentPane孩子们 他们每个人都配备了href用于获取选择选项卡时显示的外部 AJAX 内容的参数 dojo addOnLoad function var tc nav new di
  • 如何将 Jitsi Meet 添加到 Vuejs

    我已在 public html 的正文中加载了 jitsi meet 脚本 并且我有一个组件 如下所示
  • 处理流星中的长服务器端计算

    我正在使用 jimp https www npmjs com package jimp https www npmjs com package jimp 在meteor JS中生成图像服务器端 换句话说 我正在使用递归算法 计算 图像的像素
  • XRegExp 没有后视功能?

    我需要在JavaScript中使用正则表达式的lookbehind 所以发现在 JavaScript 中模拟lookbehind 第 2 步 https gist github com slevithan 2387872 另外 我发现作者
  • Javascript:为什么我需要在 for 循环中声明 var i = 0?

    我正在做一个需要递归的问题 用于计算加起来达到一定数量的硬币组合 有效的解决方案如下 困扰我几个小时的一件事是 当我没有在 for 循环中声明 var i 0 时 它不起作用 据我了解 当我在 for 循环中声明 var 时 它会保留在该范
  • 如何在Javascript中正确使用Jupyter笔记本的kernel.execute方法(计时问题)?

    下面是使用 Jupyter Notebook 的 Python 内核从自定义 JavaScript 客户端执行 Python 代码的草稿 这是一个相关问题 Jupyter 前端扩展 JavaScript API 的文档在哪里 https s

随机推荐

  • Android 中的电子书阅读器分页问题

    我正在为 Android 创建一个电子书阅读器 当内容被分成页面时我遇到了问题 这是我的应用程序的 3 个屏幕截图 正如您所看到的 内容并不完全适合屏幕 例如 最后一句话应该在第一张图像上完成 而不跳到下一页 另外 由于有足够的空间 第三张
  • 如何混合 MKV 和 MKA 文件并使其在浏览器中播放?

    我正在使用 ffmpeg 将 mkv 和 mka 文件合并到 mp4 文件中 我当前的命令如下所示 ffmpeg i video mkv i audio mka output path mp4 音频和视频文件是来自 Amazon S3 的预
  • 如何在android导航抽屉中添加个人资料信息?

    Hi I am working with android I added android navigation drawer as in g mail to my app successfully Now I want to add a p
  • 如何禁用 matplotlib 中的日期插值?

    尽管尝试了 SO 和 Matplotlib 文档中提供的一些解决方案 但我仍然无法禁用 Matplotlib 在 x 轴上创建周末日期 如下所示 它将不在原始 Pandas 列中的日期添加到 x 轴 我正在使用以下方式绘制数据 注释行未能成
  • UIView 的内容压缩阻力和内容拥抱是多少?

    UIView 的内容压缩阻力和内容拥抱是多少 这些与视图的内在内容大小有何关系 取自objc io http www objc io非常好高级自动布局工具箱文章 http www objc io issue 3 advanced auto
  • 我应该在哪里限制我的结果?

    我所做的是创建一个 XML 文件 其中包含我需要在文档上执行的数千个搜索词的列表 然后 我从一组示例搜索词创建了此查询作为测试 以针对测试文档执行 并使用实际文档中的一些示例 let keywords best clients Very 2
  • 如何将二维数组传递给C++中的函数

    我试图将数组 2d 作为参数传递给函数 我有一个代码如下 int main float T 100 100 void set T float T void set T float T1 for int i 0 i lt 90 i for i
  • Rake 构建在不正确的上下文中运行

    我有一个 gem 它的存在只是为了将多个引擎收集在一起以便于实现 以及为所有包含的引擎提供一些实用方法 其中一种实用方法是 rake 任务 用于发布所有收集的引擎的新版本 我的问题是 当我运行应该在收集的引擎之一的上下文中执行的代码时 除了
  • 为什么 .NET 为我的应用程序保留这么多内存?

    当我运行我的应用程序时 在探查器中我看到它使用了大约 80MB 的内存 总提交字节数 性能计数器 但是当我查看分配的内存大小时 它超过了400MB 所以我的问题是 为什么 NET 为我的应用程序保留这么多内存 这是正常的吗 你应该读记忆之谜
  • 通过 std::ifstream 从字符串中获取每个值

    我尝试使用ifstream使用 while 循环来获取每个值 但是 当我尝试时 什么也没有发生 为什么 std string line std getline cin line std ifstream stream line while
  • OS X 中的 PHP 系统调用和 $PATH

    我试图让 PHP 在 OS X 上进行系统调用 但是 它似乎无法找到系统路径中包含的任何内容 当我跑步时 putenv PATH SERVER PATH usr local bin 就在系统调用之前 它起作用了 这不是一个实用的解决方案 因
  • Keras 1d 卷积层如何处理词嵌入 - 文本分类问题? (过滤器、内核大小和所有超参数)

    我目前正在使用 Keras 开发一个文本分类工具 它可以工作 它工作得很好 我的验证准确度高达 98 7 但我无法理解 1D 卷积层到底如何处理文本数据 我应该使用什么超参数 我有以下句子 输入数据 句子中的最大字数 951 如果少于 添加
  • OdbcCommand.使用表名进行参数化

    我在对 C 中的 odbc 驱动程序的 Odbc 连接执行参数化 sql 查询时遇到问题 列名和表名可以通过 Web GUI 进行配置 所以我希望它免受注入 using OdbcCommand command connection Crea
  • MVC 中的 CMS 路由

    我正在 php 中创建自己的 MVC 框架 作为学习更高级编程的一种手段 我已经启动并运行了框架 但是我对当前的路由方法有一个问题 我希望该框架支持后端 cms 以补充前端网站 问题是我的路由结构的工作方式如下 mywebsite com
  • 匿名类型中的特殊字符

    我想创建一个变量名称中带有特殊字符的匿名类型 例如我有这个 new status Active 我想要类似的东西 new status Active exists true 这最终会序列化为 JSON 所以我知道我可以使用 JObject
  • 如何使用 SXSSF 写入现有文件?

    我有一个 xlsx 文件 其中包含多个包含不同数据的工作表 所有sheet中一张sheet需要容纳近10万行数据 数据需要使用java配合poi编写 这对于 SXSSFWorkbook 来说似乎非常快速和简单 我只能在内存中保留 100 行
  • where 子句中的多个“in”语句需要相互匹配

    我有一个很长的查询 本质上是以下查询的扩展 update property lease period set scca uplift 110 scca notes code 21006 where suite id CCBG08 and l
  • Laravel 服务提供者和服务容器

    在 Laravel 中访问查询 我们使用DB facades DB select 来自阿兰斯托姆网站http alanstorm com binding objects as laravel services http alanstorm
  • 从日志文件中提取特定行的数据

    我希望从长日志文件中的表中提取并打印特定行 它看起来像这样 XSCALE VERSION July 4 2012 4 Jun 2013 Author Wolfgang Kabsch Copy licensed until 30 Jun 20
  • Leaflet.js:WMS 图层样式

    我有一个 Leaflet javascript Web 应用程序 它使用 WMS 来调用 GeoServer 返回的对象是Geometry加上属性 虽然几何图形 多边形 可以像美国的县一样渲染良好 但我需要根据县人口使县图层显示不同的颜色