使用傳單的Zeppelin的熱圖

Question

我想使用傳單與R將熱圖添加到Zeppelin段落中。我在R Studio中編寫了一個可以正常工作的腳本，但是當我遷移到Zeppelin時，熱圖未顯示。這裏是我在R工作室的代碼

map3 <- Leaflet$new() 
map3$setView(c(29.7632836, -95.3632715), 10) 

vector <- c(list(c(29.76,-95.36, 50)), list(c(29.77, -95.37, 50)), list(c(29.75,-95.39,50))) 
#vector = toJSONArray2(na.omit(vector), json = F, names = F) 
cat(rjson::toJSON(vector[1:3])) 

map3$addAssets(jshead = c(
    "http://leaflet.github.io/Leaflet.heat/dist/leaflet-heat.js" 
)) 

map3$addAssets(jshead = c("http://leaflet.github.io/Leaflet.heat/dist/leaflet-heat.js")) 
map3$setTemplate(afterScript = sprintf(" 
    <script> 
     var addressPoints = %s 
     var heat = L.heatLayer(addressPoints).addTo(map)   
    </script>" 
             ,rjson::toJSON(vector))) 

map3 

我在齊柏林的代碼幾乎完全相同。僅輸入和輸出方法的變化：

library(SparkR) 

sparkcontext <- sparkR.init("local[4]","cvspark",sparkEnvir=list(spark.executor.memory="1g")) 

#sparkR.session() 
positions <- sql("SELECT lat, long FROM my_table") 
pos <- collect(positions) 

map3 <- Leaflet$new() 

map3$setView(c(39.93, 32.85)) 

vector <- c() 
values1 <- pos[[1]] 
values2 <- pos[[2]] 
for (i in 1:length(values1)) 
    vector <- c(vector, list(c(values1[i], values2[i], 1000))) 

cat(rjson::toJSON(vector[1:3])) 

map3$addAssets(jshead = c("http://leaflet.github.io/Leaflet.heat/dist/leaflet-heat.js")) 
map3$setTemplate(afterScript = sprintf(" 
    <script> 
     var addressPoints = %s 
     var heat = L.heatLayer(addressPoints).addTo(map)   
    </script>" 
    ,rjson::toJSON(vector))) 


map3$print("map3", include_assets=TRUE, cdn=TRUE) 

下面的代碼顯示的輸入是相同的：

cat(rjson::toJSON(vector[1:3])) 

ř工作室輸出：

[[29.76,-95.36,50],[29.77,-95.37,50],[29.75,-95.39,50]], 

齊柏林輸出：

[[41.6406843380063,37.6892873258843,1000],[37.0194101218466,30.3908073266391,1000],[34.0236444385`445,40.5599139822316,1000]] 

問題這裏是map3$print("map3", include_assets=TRUE, cdn=TRUE)在其輸出中不包括熱圖圖層。爲了在齊柏林飛艇上顯示地圖，據我所知，這種方法必須被調用。問題是：我們如何使打印方法包含啓用地圖上的熱圖層的JavaScript代碼。

另外我在齊柏林飛機遇到以下錯誤。但我不認爲這是有關這個問題：

Error in sparkR.sparkContext(master, appName, sparkHome, convert`NamedListToEnv(sparkEnvir), : JVM is not ready after 10 seconds 

Answer 1

此代碼將不會顯示熱圖層：

map3$print("map3", include_assets=TRUE, cdn=TRUE) 

使用％的角度解釋和變量，而不是綁定：

%angular 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.5/leaflet.css" /> 
<script src="scripts/leaflet-heat.js"></script> 

<input type="hidden" value="{{coordinates}}" id="coordinates_values"> 
<div id="map" style="height: 800px; width: 100%"></div> 
<script type="text/javascript"> 
function initMap() { 
    var map = L.map('map').setView([39.95, 32.50], 10); 

    L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { 
     attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors', 
     maxZoom: 12, 
     minZoom: 3 
    }).addTo(map); 

    var geoMarkers = L.layerGroup().addTo(map); 

    var el = angular.element($('#map').parent('.ng-scope')); 

    console.log($("#coordinates_values").val()) 
    var coordinates = $.parseJSON($("#coordinates_values").val()); 
    var heat = L.heatLayer(coordinates, {radius: 35}).addTo(map); 

    angular.element(el).ready(function() { 
     window.locationWatcher = el.scope().compiledScope.$watch('locations', function(newValue, oldValue) { 
      // geoMarkers.clearLayers(); -- if you want to only show new data clear the layer first 
      angular.forEach(newValue, function(tweet) { 
       var marker = L.marker([ tweet.loc.lat, tweet.loc.lon ]) 
        .bindPopup(tweet.user + ": " + tweet.tweet) 
        .addTo(geoMarkers); 
      }); 
     }) 
    }); 
} 

if (window.locationWatcher) { 
    // clear existing watcher otherwise we'll have duplicates 
    window.locationWatcher(); 
} 

// ensure we only load the script once, seems to cause issues otherwise 
if (window.L) { 
    $("#coordinates_values").ready(function(){ 
     initMap(); 
    }); 
} else { 
    console.log('Loading Leaflet library'); 
    var sc = document.createElement('script'); 
    sc.type = 'text/javascript'; 
    sc.src = 'https://cdnjs.cloudflare.com/ajax/libs/leaflet/0.7.5/leaflet.js'; 
    sc.onload = initMap; 
    sc.onerror = function(err) { alert(err); } 
    document.getElementsByTagName('head')[0].appendChild(sc); 
} 
</script>