1

我喜欢 Python,从不关心 JavaScript。所以我很高兴了解 Transcrypt。我最近开始了一个基于 Web 的项目,该项目使用 Django 作为后端和一个在前端发挥核心作用的 Leaflet 地图(特别是 Esri Leaflet)。我试图弄清楚 Transcrypt 是否适合我的项目。但是,Transcrypt 网站上的文档和示例要么太简单,要么太快地钻研更高级的主题。结果,我很难决定 Transcrypt 是否会为我的项目添加任何积极的东西,或者只会带来更多的复杂性和错误。我宁愿不要花几个小时来尝试让 Transcrypt 工作(这些时间可以简单地用于编写 JavaScript)只是为了发现 Transcrypt 不适合我的网站。

我知道 Transcrypt 旨在与任何 JavaScript 库一起使用。它是否也适用于基于地图的 GIS 库?

例如,如果我可以成功封装整个 Esri Leaflet(但也许我做不到?),Transcrypt 是否允许我用 Python 编写以下代码?

  var map = L.map('map').setView([40.91, -96.63], 4);

  L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
    attribution: '&copy; <a href="https://osm.org/copyright">OpenStreetMap</a> contributors'
  }).addTo(map);

  var arcgisOnline = L.esri.Geocoding.arcgisOnlineProvider();

  L.esri.Geocoding.geosearch({
    providers: [
      arcgisOnline,
      L.esri.Geocoding.mapServiceProvider({
        label: 'States and Counties',
        url: 'https://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer',
        layers: [2, 3],
        searchFields: ['NAME', 'STATE_NAME']
      })
    ]
  }).addTo(map);

顺便说一句,该代码是从这里获取的。

我不太明白有关与此处找到的 JavaScript 库集成的解释,特别是它说的地方:

另一种方法是将 JavaScript 库作为一个整体封装在 Transcrypt 模块中。在发行版中,这是为封装 fabric.js 并在 Pong 示例中导入的结构模块完成的。通过这种方式,全局命名空间保持干净。

所以我真的不知道 Transcrypt 是否可以处理所有的 GIS 和地图的东西。

Leaflet 地图将成为我网站的主要用户界面。所以知道 Transcrypt 可以封装它是很重要的。还会有很多事件监听器连接到地图上,数据在前后端之间来回穿梭。我可能会使用 jQuery 的 Ajax 来做很多事情。我在 Transcrypt 网站上看到了一些简单的 jQuery 示例,但不确定 Transcrypt 是否真的能胜任这项工作。

我注意到唯一回答 Transcrypt 问题的人是它的创建者 Jacques de Hooge。我想我的问题真的是针对他的。雅克,非常感谢你能给我的任何建议!

4

1 回答 1

0

您不需要封装 Leaflet 库。您可以像在 Transcrypt 中一样使用它。

这里举个例子。在新文件夹中创建 HTML 文件 mymap.html`:

<html>
    <head>
        <meta charset="utf-8">
        <link rel="stylesheet" href="leaflet.css"/>
        <script src="leaflet.js"></script>        
    </head>
    <body>
        <div id="the-map" style="width: 1000px; height: 800px;"></div>
        <script type="module">import * as main from './__target__/mymap.js';</script>
    </body>
</html>

并创建 Transcrypt 文件mymap.py

def main(map_id):

    watercolorTiles = {'linkTpl': 'http://c.tile.stamen.com/watercolor/{z}/{x}/{y}.jpg',
                     'attribution': '&copy; Stamen Maps'}
    australiaView = {'center': [-27.30,133.62],
                     'zoomSnap': 0.1,
                      'zoom': 4.5}

    # Build the map
    map = L.map(map_id, australiaView)
    
    L.tileLayer(watercolorTiles['linkTpl'], {
        'attribution': watercolorTiles['attribution'],
    }).addTo(map);

    
main('the-map')

请注意,Transcrypt 代码按原样使用全局 Lefa;et 对象L 。这个工厂对象已经被实例化了leaflet.js,你可以用它来构建你的地图。

要查看地图,您需要执行以下操作:

  1. 下载 Leaflet 库并将其复制leaflet.cssleaflet.js您的文件夹中。

  2. 在终端命令行上(在进入您的文件夹之后)转译.py文件:

     $ transcrypt mymap.py
    
  3. 启动为您的文件夹提供服务的网络服务器,例如:

    $ python3 -m http.server
    

现在在浏览器中访问 http://localhost:8000/mymap.html 并查看一张漂亮的(在本例中为水彩)澳大利亚地图。

您的地理搜索代码片段可以使用Transcrypt以类似的方式编写 - 只需确保将字典键编写为 Python 字符串(而不是attributionwrite 'attribution')!

于 2020-07-31T07:34:42.707 回答