如何让 Wms 端点与 elm-mapbox 一起使用？答案

【问题标题】：How to get Wms endpoint working with elm-mapbox?如何让 Wms 端点与 elm-mapbox 一起使用？
【发布时间】：2019-09-12 21:58:20
【问题描述】：

我正在使用以下 elm mapbox 库：
gampleman/elm-mapbox
是否可以从地图上的以下 WMS 端点获取栅格？
https://demo.lizard.net/api/v3/wms/?SERVICE=WMS&REQUEST=GetMap&VERSION=1.1.1&LAYERS=dem%3Anl&STYLES=dem-nl&FORMAT=image%2Fpng&TRANSPARENT=false&HEIGHT=256&WIDTH=256&TIME=2019-09-12T19%3A35%3A37&SRS=EPSG%3A3857&BBOX=508764.86026613315,6770486.217387771,547900.6187481433,6809621.975869781
（bbox坐标仅对荷兰有效）

我已尝试将 wms 源代码添加到此处的示例代码中：
https://github.com/gampleman/elm-mapbox/blob/master/examples/Example01.elm

gampleman/elm-mapbox 的文档没有提到 Wms。难道这个 elm 库还不支持 Wms？
Mapbox gl js 本身似乎支持它：
https://docs.mapbox.com/mapbox-gl-js/example/wms/?utm_medium=sem&utm_source=google&utm_campaign=sem|google|brand|chko-googlesearch-pr01-dynamicsearchcampaign-nb.broad-all-landingpage-search&utm_term=brand&utm_content=chko-googlesearch-pr01-dynamicsearchcampaign-nb.broad-all-landingpage-search&gclid=Cj0KCQjw2efrBRD3ARIsAEnt0ehhCw0OySW524_KF8DfZfOrlIyuIR2us1-oLrc1nvgWHxAKjPw3nEcaAqO7EALw_wcB
我使用上面网址中的示例尝试在下面的代码中设置“来源”：

            (Style
                { transition = Style.defaultTransition
                , light = Style.defaultLight
                , sources =
                    [ Source.vectorFromUrl "composite" "mapbox://mapbox.mapbox-terrain-v2,mapbox.mapbox-streets-v7"
                    , Source.rasterFromUrl "height" "https://demo.lizard.net/api/v3/wms/?SERVICE=WMS&REQUEST=GetMap&VERSION=1.1.1&LAYERS=dem%3Anl&STYLES=dem-nl&FORMAT=image%2Fpng&TRANSPARENT=false&HEIGHT=256&WIDTH=256&TIME=2019-09-12T19%3A35%3A37&SRS=EPSG%3A3857&BBOX={bbox-epsg-3857}"
                    ]
                , misc =
                    [ 
                      Style.name "light"
                    , Style.defaultCenter <| LngLat 20.39789404164037 43.22523201923144
                    , Style.defaultZoomLevel 1.5967483759772743
                    , Style.sprite "mapbox://sprites/mapbox/streets-v7"
                    , Style.glyphs "mapbox://fonts/mapbox/{fontstack}/{range}.pbf", Layer.fill "landcover"
                        "composite"
                        [ Layer.sourceLayer "landcover"
                        , E.any
                            [ E.getProperty (str "class") |> E.isEqual (str "wood")
                            , E.getProperty (str "class") |> E.isEqual (str "scrub")
                            , E.getProperty (str "class") |> E.isEqual (str "grass")
                            , E.getProperty (str "class") |> E.isEqual (str "crop")
                            ]
                            |> Layer.filter
                        , Layer.fillColor (E.rgba 227 227 227 1)
                        , Layer.fillOpacity (float 0.6)
                        ]
                    ]
                , layers =
                    [ Layer.raster "height" "height" []

                    ]
                }
            )

结果应该是荷兰地区显示了一个高度图，如 url。
但在他们那一刻，我只得到一个 500 http 状态，因为生成的 url 包含我在源代码中定义的字符串 &BBOX={bbox-epsg-3857}

【问题讨论】：

标签： elm mapbox-gl-js wms

【解决方案1】：

rasterFromUrl 的文档指定：

rasterFromUrl : Id -> Url -> Source

A raster tile source configured from a TileJSON spec.

https://package.elm-lang.org/packages/gampleman/elm-mapbox/latest/Mapbox-Source#rasterFromUrl

所以不，您不能以这种方式使用 WMS。这个库似乎不像您期望的那样支持 WMS。

您可能想在Elm Slack 的#maps 频道上询问人们如何处理这个问题。

【讨论】：