我在 Binding.scala 上使用带有 scalajs-leaflet 外观的 Leaflet,并且地图初始化/显示不正确。
为了重现该问题,我准备了一个lihaoyi/workbench类似于 scalajs-leaflet 中的页面。
首先,从https://github.com/mcku/scalajs-leaflet下载分叉的 scalajs-leaflet
sbt在scalajs-leaflet目录中运行。输入~ example/fastOptJSsbt。现在,一个 Web 服务器在端口 12345 上启动。
在浏览器中打开 http://localhost:12345/example/target/scala-2.12/classes/leaflet2binding-dev.html
问题是地图容器出现但内容(图块等)不正确。在窗口上进行小幅调整后,地图变得很好,这会触发_onResize传单的处理程序。
容器在Leaflet2Binding.scala文件中并且在初始化之前已经指定了它的大小:
val mapElement = <div id="mapid" style="width: 1000px; height: 600px;
position: relative; outline: currentcolor none medium;"
class="leaflet-container leaflet-touch leaflet-fade-anim
leaflet-grab leaflet-touch-drag leaflet-touch-zoom"
data:tabindex="0"></div>.asInstanceOf[HTMLElement]
Run Code Online (Sandbox Code Playgroud)
可以lmap.invalidateSize(true)在返回元素之前在以下行中
插入一行https://github.com/mcku/scalajs-leaflet/blob/83b770bc76de450567ababf6c7d2af0700dd58c9/example/src/main/scala/example/Leaflet2Binding.scala , but# L3在这种情况下没有帮助。即这里:
@dom def renderMap = {
val mapElement = ... (same element as above)
.. some …Run Code Online (Sandbox Code Playgroud)