You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@zeppelin.apache.org by "Rajjat (JIRA)" <ji...@apache.org> on 2019/04/05 09:29:00 UTC

[jira] [Created] (ZEPPELIN-4110) Zeppelin notebook not supporting leaflet polygon method

Rajjat created ZEPPELIN-4110:
--------------------------------

             Summary: Zeppelin notebook not supporting leaflet polygon method
                 Key: ZEPPELIN-4110
                 URL: https://issues.apache.org/jira/browse/ZEPPELIN-4110
             Project: Zeppelin
          Issue Type: Bug
          Components: front-end, GUI
    Affects Versions: 0.8.0
         Environment: OS- Ubuntu 18.04

RAM-16 GB

CPU- Core i5 7th Gen

 
            Reporter: Rajjat


I am working on a Zeppelin notebook with Spark. I am using Leaflet for creating map visualization and also for creating the polygon. This is the example that I want to run on Zeppelin notebook:-
 
{{%angular }}
{{<!DOCTYPE html> }}
{{<html> }}
{{<head> }}
{{<title>Quick Start - Leaflet</title> }}
 
{{<link rel="stylesheet" href="https://unpkg.com/leaflet@1.4.0/dist/leaflet.css" integrity="sha512-puBpdR0798OZvTTbP4A8Ix/l+A4dHDD0DGqYW6RQ+9jxkRFclaxxQb/SJAWZfWAkuyeQUytO7+7N4QKrDh+drA==" crossorigin=""/> }}
 
{{<script src="https://unpkg.com/leaflet@1.4.0/dist/leaflet.js" integrity="sha512-QVftwZFqvtRNi0ZyCtsznlKSWOStnDORoefr1enyq5mVL4tmKB3S/EnC3rRJcxCPavG10IcrVGSmPh6Qw5lwrg==" crossorigin=""></script> }}
{{</head> }}
{{<body> }}
{{<div id="mapid" style="width: 600px; height: 400px;"></div> }}
{{<script> }}
{{var mymap = L.map('mapid').setView([51.505, -0.09], 13); L.tileLayer('https://api.tiles.mapbox.com/v4/\{id}/\{z}/\{x}/\{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', { maxZoom: 18, attribution: 'Map data &copy; }}
{{<a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' + '<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' + 'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>', id: 'mapbox.streets' }).addTo(mymap);}}
 
{{L.marker([51.5, -0.09]).addTo(mymap) .bindPopup("<b>Hello world!</b><br />I am a popup.").openPopup(); }}
 
{{L.circle([51.508, -0.11], 500, \{ color: 'red', fillColor: '#f03', fillOpacity: 0.5 }).addTo(mymap).bindPopup("I am a circle.");}}
 
{{ L.polygon([ [51.509, -0.08], [51.503, -0.06], [51.51, -0.047] ]).addTo(mymap).bindPopup("I am a polygon.");}}
{{ var popup = L.popup();}}
{{ </script> }}
{{</body>}}
 
{{ </html>}}
 
 
 
{{Only the marker property is working fine whereas circle and polygon APIs are not showing any output on the map. There was no error on the console log. I also went through this link [http://datasystemslab.github.io/GeoSpark/download/zeppelin/] where it says "there is an issue in Leaflet JS with Zeppelin". I have no clue what is happening here since there are no error logs.}}
 
 
{{PS- Same issue I have wrote on stackoverflow [https://stackoverflow.com/questions/55329765/zeppelin-notebook-not-supporting-leaflet-polygon-method] , but did  not get an answer.}}



--
This message was sent by Atlassian JIRA
(v7.6.3#76005)