Виджет Vaadin не запускает javascript?

Я новичок в Vaadin, и писать Vaadin виджет, чтобы показать интерактивную карту на странице, это простой Javascript У меня есть (он работает отдельно):Виджет Vaadin не запускает javascript?

var showMapToMe = function() { 
var div = document.createElement('div'); 
div.id = 'mapid'; 
div.style.width = "800px"; 
div.style.height = "800px"; 
document.body.appendChild(div); 
var mymap = L.map('mapid').setView([ 44.646129, -68.599838 ], 3); 
L.tileLayer('https://api.mapbox.com/styles/v1/mapbox/streets-v9/tiles/256/{z}/{x}/{y}?access_token=XXXXX', 
       { 
        attribution : 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://mapbox.com">Mapbox</a>', 
        maxZoom : 18, 
       }).addTo(mymap); 
L.marker([44.646129, -63.599838]).addTo(mymap);}

В главном классе, я просто пишу следующий код в конструкторе:

@JavaScript({ ".../leaflet.js",".../leaflet.markercluster.js","labMap.js"}) 
public class MapWidget extends com.vaadin.ui.AbstractJavaScriptComponent { 
    public MapWidget() { 
     Page.getCurrent().getJavaScript().execute("showMapToMe()"); 
    } 
}

Наконец, в функции инициализации у меня есть:

  final MapWidget component = new MapWidget();   
      final VerticalLayout layout = new VerticalLayout(); 
      layout.setStyleName("demoContentLayout"); 
      layout.setSizeFull(); 
      layout.addComponent(component); 
      setContent(layout);

Однако, я не могу увидеть карту в го e page. Я что-то пропустил? Любая помощь?

источник

2016-10-06 Eni

Я бы предложил сделать ваш MapWidget для расширения VerticalLayout и установить его идентификатор 'mapid' вместо использования JS для создания DIV. Затем я переопределял бы метод attach в ваших классах MapWidget и вместо этого выполнял бы JS. –

Я добавил layout.setId ("mapid"); и удалил DIV, но это не сработало. – Eni

Возможно, немного оффтопик, но если это возможно в вашем случае, рассмотрели ли вы использование уже существующего надстройки, такого как [v-sheetlet] (https://vaadin.com/directory#!addon/v-leaflet) , [open-layers-wrapper] (https://vaadin.com/directory#!addon/openlayers-3-wrapper-for-vaadin) или [google maps] (https://vaadin.com/directory#!addon/GoogleMaps-дополнения)? – Morfic

Вместо вызова функции в конструкторе MapWidget используйте соединитель для этого.

Измените labMap.js, как показано ниже (или добавить новый файл яваскрипта) и удалить код из MapWidget конструктора

window.com_your_package_MapWidget = function() { 

    var showMapToMe = function(div) { 
     // ... your existing code 
    } 

    var me = this; 
    showMapToMe(me.getElement()) 
}

Вы также можете добавить государственный класс, так что вы можете инициализировать атрибут в Java код, а затем используйте их в сценарии подключения. См. docs для получения дополнительной информации

источник

2016-10-07 08:02:12

Виджет Vaadin не запускает javascript?

ответ

Смежные вопросы