pbootcms网站模板|日韩1区2区|织梦模板||网站源码|日韩1区2区|jquery建站特效-html5模板网

  • <tfoot id='bjFdf'></tfoot>

    • <bdo id='bjFdf'></bdo><ul id='bjFdf'></ul>

      <small id='bjFdf'></small><noframes id='bjFdf'>

      <legend id='bjFdf'><style id='bjFdf'><dir id='bjFdf'><q id='bjFdf'></q></dir></style></legend>

        <i id='bjFdf'><tr id='bjFdf'><dt id='bjFdf'><q id='bjFdf'><span id='bjFdf'><b id='bjFdf'><form id='bjFdf'><ins id='bjFdf'></ins><ul id='bjFdf'></ul><sub id='bjFdf'></sub></form><legend id='bjFdf'></legend><bdo id='bjFdf'><pre id='bjFdf'><center id='bjFdf'></center></pre></bdo></b><th id='bjFdf'></th></span></q></dt></tr></i><div class="njnvrld" id='bjFdf'><tfoot id='bjFdf'></tfoot><dl id='bjFdf'><fieldset id='bjFdf'></fieldset></dl></div>

        如何使用 tabletop.js 將標記添加到傳單地圖?

        How to add markers to leaflet map with tabletop.js?(如何使用 tabletop.js 將標記添加到傳單地圖?)

          1. <legend id='w0Hho'><style id='w0Hho'><dir id='w0Hho'><q id='w0Hho'></q></dir></style></legend>
              <bdo id='w0Hho'></bdo><ul id='w0Hho'></ul>
              <tfoot id='w0Hho'></tfoot>
            • <small id='w0Hho'></small><noframes id='w0Hho'>

                  <tbody id='w0Hho'></tbody>
                <i id='w0Hho'><tr id='w0Hho'><dt id='w0Hho'><q id='w0Hho'><span id='w0Hho'><b id='w0Hho'><form id='w0Hho'><ins id='w0Hho'></ins><ul id='w0Hho'></ul><sub id='w0Hho'></sub></form><legend id='w0Hho'></legend><bdo id='w0Hho'><pre id='w0Hho'><center id='w0Hho'></center></pre></bdo></b><th id='w0Hho'></th></span></q></dt></tr></i><div class="j7b7rpz" id='w0Hho'><tfoot id='w0Hho'></tfoot><dl id='w0Hho'><fieldset id='w0Hho'></fieldset></dl></div>

                  本文介紹了如何使用 tabletop.js 將標記添加到傳單地圖?的處理方法,對大家解決問題具有一定的參考價值,需要的朋友們下面隨著小編來一起學習吧!

                  問題描述

                  我正在使用這個非常好的指南將標記從 Google 工作表添加到基本的 leaflet.js 地圖:https://rdrn.me/leaflet-maps-google-sheets/

                  I'm using this quite nice guide to add markers from a Google sheet to a basic leaflet.js map: https://rdrn.me/leaflet-maps-google-sheets/

                  問題是,使用這些代碼片段,我在控制臺中記錄并返回了所有數據,但地圖本身上沒有出現任何點.

                  The problem is, using these code snippets here i get all the data logged and returned in the console, but none of the points appear on the map itself.

                  這可能是一些我看不到的非常基本的 JavaScript 問題.不好意思,還在學習.

                  This is probably some really basic JavaScript issue that i'm not able to see. Sorry, still learning.

                  這是一個 jfiddle,鏈接到帶有一個標記點??的演示表

                  Here's a jfiddle, linking to a demo sheets with one marker point

                  https://jsfiddle.net/xfs19cz7/1/

                  與地圖部分:

                  function init() {
                      Tabletop.init({
                          key: '*url to gsheets here*',
                          callback: myFunction,
                          simpleSheet: true
                      })
                  }
                  
                  window.addEventListener('DOMContentLoaded', init)
                  
                  function myFunction(data, tabletop) {
                      console.log(data);
                  }
                  
                  
                  var map = L.map('map-div').setView([64.6220498,25.5689638], 5);
                  var basemap = L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
                          attribution: 'Basemap (c) <a ,
                          minZoom: 5,
                          maxZoom: 18
                      });
                  basemap.addTo(map);
                  
                  function addPoints(data, tabletop) {
                      for (var row in data) {
                          var marker = L.marker([
                              data[row].Latitude,
                              data[row].Longitude
                          ]).addTo(map);
                          marker.bindPopup('<strong>' + data[row].Info + '</strong>');
                      }
                  }
                  

                  這應該在基本地圖上增加一個點.現在實際上地圖根本沒有渲染,也沒有顯示任何標記.我在使地圖顯示為空白的代碼中找不到任何問題,但可能存在一些問題.

                  This should add one point to a basic map. Now actually the map is not at all rendered, and no marker shows up. I can't find any issues in the code making the map show up blank, but there probably are some.

                  然而,來自 gsheets 的標記已記錄在控制臺中,我懷疑我的代碼中缺少與真正基本的 javascript 函數/循環/草率語法有關的內容.

                  The marker from gsheets is however logged in the console, i suspect there is something missing in my code relating to really basic javascript functions / looping / sloppy syntax.

                  還嘗試將 init() 和 addPoints(data, tabletop) 部分添加到我擁有的地圖中,該地圖具有相同的底圖鏈接,渲染正常.添加它仍然會留下地圖渲染,但沒有出現任何標記.同樣,gsheets 被加載為對象數組.

                  Also tried the init() and addPoints(data, tabletop) parts to a map i had where the map with the same basemap link, which rendereded OK. Adding this still left the map rendering, but no markers showed up. Again, the gsheets was loaded as an array of objects.

                  誰能指出我在代碼中可能非?;镜膯栴}?

                  Could anyone point me to this, probably very basic, issue in the code?

                  callback: myFunction, 
                  

                  上面一行需要改成

                  callback: addPoints,
                  

                  另外,需要調用初始化函數并將位置設置為絕對位置.感謝您在下面標記為正確的答案中的工作小提琴.

                  also, init function needs to be called and position set to absolute. Thanks for the working fiddle in answer marked as correct below.

                  推薦答案

                  修復

                  • 嘗試設置地圖位置絕對
                  • 調用init()函數

                  工作小提琴

                  這篇關于如何使用 tabletop.js 將標記添加到傳單地圖?的文章就介紹到這了,希望我們推薦的答案對大家有所幫助,也希望大家多多支持html5模板網!

                  【網站聲明】本站部分內容來源于互聯網,旨在幫助大家更快的解決問題,如果有圖片或者內容侵犯了您的權益,請聯系我們刪除處理,感謝您的支持!

                  相關文檔推薦

                  Check if a polygon point is inside another in leaflet(檢查一個多邊形點是否在傳單中的另一個內部)
                  Changing leaflet markercluster icon color, inheriting the rest of the default CSS properties(更改傳單標記群集圖標顏色,繼承其余默認 CSS 屬性)
                  Trigger click on leaflet marker(觸發點擊傳單標記)
                  How can I change the default loading tile color in LeafletJS?(如何更改 LeafletJS 中的默認加載磁貼顏色?)
                  Add external geojson to leaflet layer(將外部geojson添加到傳單層)
                  Adding Leaflet layer control to sidebar(將 Leaflet 圖層控件添加到側邊欄)
                  <legend id='rHYft'><style id='rHYft'><dir id='rHYft'><q id='rHYft'></q></dir></style></legend>

                  • <bdo id='rHYft'></bdo><ul id='rHYft'></ul>
                          <i id='rHYft'><tr id='rHYft'><dt id='rHYft'><q id='rHYft'><span id='rHYft'><b id='rHYft'><form id='rHYft'><ins id='rHYft'></ins><ul id='rHYft'></ul><sub id='rHYft'></sub></form><legend id='rHYft'></legend><bdo id='rHYft'><pre id='rHYft'><center id='rHYft'></center></pre></bdo></b><th id='rHYft'></th></span></q></dt></tr></i><div class="dh5rptl" id='rHYft'><tfoot id='rHYft'></tfoot><dl id='rHYft'><fieldset id='rHYft'></fieldset></dl></div>

                          <small id='rHYft'></small><noframes id='rHYft'>

                            <tbody id='rHYft'></tbody>

                          1. <tfoot id='rHYft'></tfoot>

                            主站蜘蛛池模板: 压缩空气检测_气体_水质找上海京工-服务专业、价格合理 | 天助网 - 中小企业全网推广平台_生态整合营销知名服务商_天助网采购优选 | 低压载波电能表-单相导轨式电能表-华邦电力科技股份有限公司-智能物联网综合管理平台 | 临时厕所租赁_玻璃钢厕所租赁_蹲式|坐式厕所出租-北京慧海通 | 超声骨密度仪,双能X射线骨密度仪【起草单位】,骨密度检测仪厂家 - 品源医疗(江苏)有限公司 | 14米地磅厂家价价格,150吨地磅厂家价格-百科 | 非标压力容器_碳钢储罐_不锈钢_搪玻璃反应釜厂家-山东首丰智能环保装备有限公司 | 动物解剖台-成蚊接触筒-标本工具箱-负压实验台-北京哲成科技有限公司 | 洛阳装修公司-洛阳整装一站式品牌-福尚云宅装饰 | PSI渗透压仪,TPS酸度计,美国CHAI PCR仪,渗透压仪厂家_价格,微生物快速检测仪-华泰和合(北京)商贸有限公司 | SF6环境监测系统-接地环流在线监测装置-瑟恩实业 | 政府园区专业委托招商平台_助力企业选址项目快速落地_东方龙商务集团 | 精密模具-双色注塑模具加工-深圳铭洋宇通 | led太阳能路灯厂家价格_风光互补庭院灯_农村市政工程路灯-中山华可路灯品牌 | 气象监测系统_气象传感器_微型气象仪_气象环境监测仪-山东风途物联网 | 品牌设计_VI设计_电影海报设计_包装设计_LOGO设计-Bacross新越品牌顾问 | 龙门加工中心-数控龙门加工中心厂家价格-山东海特数控机床有限公司_龙门加工中心-数控龙门加工中心厂家价格-山东海特数控机床有限公司 | HEYL硬度计量泵-荧光法在线溶解氧仪-净时测控技术(上海)有限公司 | 东莞韩创-专业绝缘骨架|马达塑胶零件|塑胶电机配件|塑封电机骨架厂家 | 软瓷_柔性面砖_软瓷砖_柔性石材_MCM软瓷厂家_湖北博悦佳软瓷 | 最新范文网_实用的精品范文美文网| 科昊仪器超纯水机系统-可成气相液氮罐-美菱超低温冰箱-西安昊兴生物科技有限公司 | 精密交叉滚子轴承厂家,转盘轴承,YRT转台轴承-洛阳千协轴承 | 污水处理设备,一体化泵站,一体化净水设备-「梦之洁环保设备厂家」 | 高低温试验房-深圳高低温湿热箱-小型高低温冲击试验箱-爱佩试验设备 | 济南品牌包装设计公司_济南VI标志设计公司_山东锐尚文化传播 | 青州开防盗门锁-配汽车芯片钥匙-保险箱钥匙-吉祥修锁店 | 电动卫生级调节阀,电动防爆球阀,电动软密封蝶阀,气动高压球阀,气动对夹蝶阀,气动V型调节球阀-上海川沪阀门有限公司 | 阳光模拟试验箱_高低温试验箱_高低温冲击试验箱_快速温变试验箱|东莞市赛思检测设备有限公司 | 气密性检测仪_气密性检测设备_防水测试仪_密封测试仪-岳信仪器 | 光伏支架成型设备-光伏钢边框设备-光伏设备厂家 | Win10系统下载_32位/64位系统/专业版/纯净版下载 | 气象监测系统_气象传感器_微型气象仪_气象环境监测仪-山东风途物联网 | 加气混凝土砌块设备,轻质砖设备,蒸养砖设备,新型墙体设备-河南省杜甫机械制造有限公司 | 空调风机,低噪声离心式通风机,不锈钢防爆风机,前倾皮带传动风机,后倾空调风机-山东捷风风机有限公司 | 国资灵活用工平台_全国灵活用工平台前十名-灵活用工结算小帮手 | 播音主持培训-中影人教育播音主持学苑「官网」-中国艺考界的贵族学校 | 沈阳缠绕包装机厂家直销-沈阳海鹞托盘缠绕包装机价格 | 耙式干燥机_真空耙式干燥机厂家-无锡鹏茂化工装备有限公司 | 智慧旅游_智慧景区_微景通-智慧旅游景区解决方案提供商 | 大流量卧式砂磨机_强力分散机_双行星双动力混合机_同心双轴搅拌机-莱州市龙跃化工机械有限公司 |