傳單實時：SyntaxError：JSON.parse：意外字符

我有一張實時使用傳單的地圖。傳單實時：SyntaxError：JSON.parse：意外字符

我像github上的描述一樣實時創建傳單。並與該示例中的URL效果很不錯，但是當我使用JSON字符串直接，我會收到以下錯誤消息：

SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data undefined leaflet-realtime.min.js:4:3695

的代碼如下所示：

var geojsonFeature = {"geometry": {"type": "Point", "coordinates": [-64.90913344523922, 31.274686201725011]}, "type": "Feature", "properties": {}}; 


    var map = L.map('map', 
     { 
      center: [<?php echo $StartNorth; ?>, <?php echo $StartEast; ?>], 
      zoom: <?php echo $StartZoomLevel; ?>, 
      layers: [BasemapAT_basemap, geoJSONLayerNone], 

      zoomControl: false, 

      contextmenu: true, 
      contextmenuWidth: 200, 
      contextmenuItems: [{ 
       text: 'Koordinaten anzeigen', 
       callback: showCoordinates 
      }, { 
       text: 'Karte hier zentrieren', 
       callback: centerMap 
      }, '-', { 
       text: 'Zoom in', 
       icon: 'assets/leaflet-contextmenu/dist/images/zoom-in.png', 
       callback: zoomIn 
      }, { 
       text: 'Zoom out', 
       icon: 'assets/leaflet-contextmenu/dist/images/zoom-out.png', 
       callback: zoomOut 
      }] 
     } 
    ) 
     realtime = L.realtime({ 
     geojsonFeature, 
     //url: 'https://wanderdrone.appspot.com/', 
     crossOrigin: true, 
     type: 'json' 
    }, { 
     interval: 3 * 1000, 
      pointToLayer: function (feature, latlng) { 
      return L.marker(latlng, { 
       'icon': L.icon({ 
        iconUrl: 'leaflet/images/marker-icon-vehicle.png', 
         iconSize:  [16, 16], 
         iconAnchor:  [1, 8], 
         popupAnchor: [7, 0] 
       }) 
      }); 
     }}).addTo(map);

理論它應該工作，但我不能解釋自己爲什麼不能。有人可以給我一個小費？

來源

2017-10-11 wuk986

你'geojsonFeature'是一個對象，而不是你在你的問題的字符串。那是故意的嗎？ – osdavison

實際上，從鏈接的頁面查看文檔，看起來好像不可能將JSON字符串用作參數「L.realtime」 – osdavison

是的，因爲我在其他示例中看到它類似（https：/ /github.com/perliedman/leaflet-realtime/issues/69）。存儲在'geojsonFeature'中的字符串將在客戶端的間隔中自動生成。 – wuk986

結論是，該單張實時接縫是一個偉大的項目，但不適合我。

因此，我創建了一個個人的解決方案，其添加和刪除L.geoJSON層：

function refreshTable(){ 
     //code which creates TTvehicleObj 
     function addTTlayer() { 

      TTJsonLayer = L.geoJSON(null, { 
         pointToLayer: function (feature, latlng) { 
          return L.marker(latlng, {icon: vehicleMarker}); 
         }, 
         onEachFeature: function(feature, layer) { 
          if (feature.properties.Ignition == 0 && feature.properties.Standstill == 1) { 
            vehicleParking = '<span class="label label-default">P</span>&nbsp;'; 
           } else if (feature.properties.Ignition == 1 && feature.properties.Standstill == 1) { 
            vehicleParking = '<span class="label label-primary">P</span>&nbsp;'; 
           } else { 
            vehicleParking = ''; 
           } 
           layer.bindPopup(vehicleParking+'<strong>'+feature.properties.Funknummer+'</strong>&nbsp;|&nbsp;'+feature.properties.Position); 
          } 
         }); 

      TTJsonLayer.addData(TTvehicleObj); 
      TTJsonLayer.addTo(map); 

      function refreshTTlayer() { 
      if (typeof TTJsonLayer === 'undefined') { 
       addTTlayer(); 
      } else { 
       map.removeLayer(TTJsonLayer); 
       addTTlayer(); 
      } 
     } 

     refreshTTlayer(); 

     $(document).ready(function() { 
      setInterval(refreshTable, 60000); 
     }); 
    } 
}

來源

2017-10-31 06:51:24 wuk986

的文檔狀態：

The source can be one of:

a string with the URL to get data from

an options object that is passed to fetch for fetching the data

a function in case you need more freedom.

In case you use a function, the function should take two callbacks as arguments: fn(success, error), with the callbacks:

a success callback that takes GeoJSON as argument: success( features)

an error callback that should take an error object and an error message (string) as argument: error(error, message)

根據你想要什麼文檔不作爲源有效。你可以通過使用一個函數來完成。另外還有：

update(<GeoJSON> featureData?)

這是一種可以用來傳遞數據的方法。

來源

2017-10-11 15:09:02 Titsjmen

感謝您的提示，但我無法弄清楚，功能如何... – wuk986

傳單實時：SyntaxError：JSON.parse：意外字符

回答

相關問題