B4J Question [SOLVED],[BANanoVuetifyAD3] Could you please Add more event with Leaflet

NGUYEN TUAN ANH · Sep 29, 2022

Dear All,
I used Leaflet Class in BANanoVuetifyAD3.b4xlib 7.35
I need Events: #Event: MouseClick (latLng as Object) and #Event: MouseMove (latLng as Object)
But it only has the following Events:

B4X:

#Event: ImageClick (image As Map)
#Event: CircleClick (marker As Map)
#Event: MarkerClick (marker As Map)
#Event: PolygonClick (marker As Map)
#Event: PolylineClick (marker As Map)
#Event: Ready
#Event: RectangleClick (marker As Map)
#Event: Resize
#Event: ToolBar_Click (id As String)
#Event: UpdateBounds (bounds as Object)
#Event: UpdateCenter (latLng as Object)
#Event: UpdateZoom (latLng As Object)
#Event: MouseEnter (e As BANanoEvent)
#Event: MouseLeave (e As BANanoEvent)

Could you please add 2 Events MouseClick (latLng as Object) and MouseMove (latLng as Object) into Leaflet Class for me
Best Regards.

DonManfred · Sep 29, 2022

Please use Code Tags when posting code

Mashiane · Sep 29, 2022

NGUYEN TUAN ANH said:
Could you please add 2 Events MouseClick (latLng as Object) and #Event: MouseMove (latLng as Object)

Will investigate, I have a pc challenge at the moment, will keep you posted.

NGUYEN TUAN ANH · Sep 30, 2022

Mashiane said:
Will investigate, I have a pc challenge at the moment, will keep you posted.

Documentation - Leaflet - a JavaScript library for interactive maps

leafletjs.com

i'm waiting for you
Your work is great, thank you very much !

Mashiane · Sep 30, 2022

I have noted the event links you sent.

I will investigate how to turn the MouseEvent into a GPS coordinate as soon as I can, as the class in BVAD3 is based on this wrap of Leaflet, https://vue2-leaflet.netlify.app/

In other news...

By default, any element you add that is defined in Class/Process Globals already has a list of "virtual" events bound to it. These ONLY come to life as soon as a callback is added to your code module.

As an example, adding, this code in your code/class module

B4X:

Sub <componentname>_click(e as BANanoEvent)
End Sub

Sub <componentname>_mousemove (e as BANanoEvent)
End Sub

'click + stop propagation
Sub <componentname>_clickstop (e as BANanoEvent)
End Sub

'hold shift and click
Sub <componentname>_clickshift (e as BANanoEvent)
End Sub

Will activate those events, even if they are not listed in the #Events list of any class.

This is due to this global event binding on the base VueElement that is a building block for each element. VueElement however SHOULD NEVER be accessed directly.

B4X:

Sub BindAllEvents
    SetOnEvent(mCallBack, "close", "")
    SetOnEvent(mCallBack, "finish", "")
    SetOnEvent(mCallBack, "blur", "")
    SetOnEvent(mCallBack, "click", "")
    SetOnEvent(mCallBack, "click.native", "")
    SetOnEvent(mCallBack, "click.stop", "")
    SetOnEvent(mCallBack, "click.prevent", "")
    SetOnEvent(mCallBack, "change", "")
    SetOnEvent(mCallBack, "click:append", "")
    SetOnEvent(mCallBack, "click:prepend", "")
    SetOnEvent(mCallBack, "click:append-outer", "")
    SetOnEvent(mCallBack, "click:prepend-inner", "")
    SetOnEvent(mCallBack, "click:clear", "")
    SetOnEvent(mCallBack, "dblclick", "")
    SetOnEvent(mCallBack, "MouseMove", "")
    SetOnEvent(mCallBack, "MouseOut", "")
    SetOnEvent(mCallBack, "KeyUp", "")
    SetOnEvent(mCallBack, "KeyPress", "")
    SetOnEvent(mCallBack, "Click.Alt", "")
    SetOnEvent(mCallBack, "Click.Shift", "")
    SetOnEvent(mCallBack, "start", "")
    SetOnEvent(mCallBack, "end", "")
    SetOnEvent(mCallBack, "click:close", "")
    SetOnEvent(mCallBack, "update:active", "")
    SetOnEvent(mCallBack, "update:open", "")
    SetOnEvent(mCallBack, "update:error", "")
    SetOnEvent(mCallBack, "update:list-index", "")
    SetOnEvent(mCallBack, "update:search-input", "")
    SetOnEvent(mCallBack, "focus", "")
    SetOnEvent(mCallBack, "input", "")
    SetOnEvent(mCallBack, "keydown", "")
    SetOnEvent(mCallBack, "mousedown", "")
    SetOnEvent(mCallBack, "mousedown.stop", "")
    SetOnEvent(mCallBack, "mouseup", "")
    SetOnEvent(mCallBack, "mouseover", "")
    SetOnEvent(mCallBack, "submit", "")
    SetOnEvent(mCallBack, "MouseEnter", "")
    SetOnEvent(mCallBack, "MouseLeave", "")
    SetOnEvent(mCallBack, "submit.prevent", "")
    SetOnEvent(mCallBack, "dblclick.prevent", "")
    SetOnEvent(mCallBack, "keydown.enter.prevent", "")
    SetOnEvent(mCallBack, "keydown.left.prevent", "")
    SetOnEvent(mCallBack, "keydown.right.prevent", "")
    SetOnEvent(mCallBack, "keydown.space.prevent", "")
    SetOnEvent(mCallBack, "keyup.enter", "")
    SetOnEvent(mCallBack, "keyup.enter.prevent", "")
    SetOnEvent(mCallBack, "keyup.esc", "")
    SetOnEvent(mCallBack, "touchstart.stop", "")
    SetOnEvent(mCallBack, "click:event", "")
    SetOnEvent(mCallBack, "click:more", "")
    SetOnEvent(mCallBack, "click:date", "")
    SetOnEvent(mCallBack, "keydown.esc", "")
    SetOnEvent(mCallBack, "drop", "")
    SetOnEvent(mCallBack, "dragover", "")
    SetOnEvent(mCallBack, "dragenter", "")
    SetOnEvent(mCallBack, "dragleave", "")
    SetOnEvent(mCallBack, "transitionend", "")
    SetOnEvent(mCallBack, "update:mini-variant", "")
    SetOnEvent(mCallBack, "update:indeterminate", "")
    SetOnEvent(mCallBack, "dblclick:date", "")
    SetOnEvent(mCallBack, "click:row", "")
    SetOnEvent(mCallBack, "current-items", "")
    SetOnEvent(mCallBack, "dblclick:row", "")
    SetOnEvent(mCallBack, "item-expanded", "")
    SetOnEvent(mCallBack, "toggle-select-all", "")
    SetOnEvent(mCallBack, "click:hour", "")
    SetOnEvent(mCallBack, "click:minute", "")
    SetOnEvent(mCallBack, "click:second", "")
    SetOnEvent(mCallBack, "update:period", "")
    SetOnEvent(mCallBack, "update:color", "")
    SetOnEvent(mCallBack, "update:mode", "")
    SetOnEvent(mCallBack, "click:day", "")
    SetOnEvent(mCallBack, "click:day-category", "")
    SetOnEvent(mCallBack, "click:event", "")
    SetOnEvent(mCallBack, "click:interval","")
    SetOnEvent(mCallBack, "click:more", "")
    SetOnEvent(mCallBack, "click:time", "")
    SetOnEvent(mCallBack, "click:time-category", "")
    SetOnEvent(mCallBack, "contextmenu:row", "")
    SetOnEvent(mCallBack, "contextmenu:row.prevent", "")
    SetOnEvent(mCallBack, "contextmenu:date", "")
    SetOnEvent(mCallBack, "contextmenu:day", "")
    SetOnEvent(mCallBack, "contextmenu:day-category", "")
    SetOnEvent(mCallBack, "contextmenu:event", "")
    SetOnEvent(mCallBack, "contextmenu:interval", "")
    SetOnEvent(mCallBack, "contextmenu:time", "")
    SetOnEvent(mCallBack, "contextmenu:time-category", "")
    SetOnEvent(mCallBack, "moved", "")
    SetOnEvent(mCallBack, "click:outside", "")
    SetOnEvent(mCallBack, "click:next", "")
    SetOnEvent(mCallBack, "click:prev", "")
End Sub

What this means is, if an event is not listed on the #Event list of any class, as long as its defined in BindAllEvents, you can simply add it in your code/class module and that event will be picked up and it will work.

Internally this calls SubExists first before it creates event listeners.

NGUYEN TUAN ANH · Sep 30, 2022

Mashiane said:
Tôi đã ghi nhận các liên kết sự kiện mà bạn đã gửi.

View attachment 134202

Tôi sẽ điều tra cách biến MouseEvent thành tọa độ GPS ngay khi tôi có thể, vì lớp trong BVAD3 dựa trên gói Tờ rơi này, https://vue2-leaflet.netlify.app/

Trong những tin tức khác...

Theo mặc định, bất kỳ phần tử nào bạn thêm được xác định trong Class / Process Globals đều đã có một danh sách các sự kiện "ảo" liên kết với nó. Những điều này CHỈ hoạt động ngay sau khi một lệnh gọi lại được thêm vào mô-đun mã của bạn.

Ví dụ, thêm, mã này trong mô-đun mã / lớp của bạn

[mã số]
Sub <componentname> _click (e as BANanoEvent)
Kết thúc Sub

Sub <componentname> _mousemove (e as BANanoEvent)
Kết thúc Sub

'nhấp + dừng truyền bá
Sub <componentname> _clickstop (e as BANanoEvent)
Kết thúc Sub

'giữ shift và nhấp
Sub <componentname> _clickshift (e as BANanoEvent)
Kết thúc Sub
[/mã số]

Sẽ kích hoạt các sự kiện đó, ngay cả khi chúng không được liệt kê trong danh sách #Events của bất kỳ lớp nào.

Điều này là do sự kiện toàn cầu này ràng buộc trên VueElement cơ sở là một khối xây dựng cho mỗi phần tử. Tuy nhiên VueElement KHÔNG BAO GIỜ được truy cập trực tiếp.

[mã số]
Sub BindAllEvents
SetOnEvent (mCallBack, "close", "")
SetOnEvent (mCallBack, "finish", "")
SetOnEvent (mCallBack, "mờ", "")
SetOnEvent (mCallBack, "click", "")
SetOnEvent (mCallBack, "click.native", "")
SetOnEvent (mCallBack, "click.stop", "")
SetOnEvent (mCallBack, "click.prevent", "")
SetOnEvent (mCallBack, "change", "")
SetOnEvent (mCallBack, "click: append", "")
SetOnEvent (mCallBack, "click: prepend", "")
SetOnEvent (mCallBack, "click: append-external", "")
SetOnEvent (mCallBack, "click: prepend-inner", "")
SetOnEvent (mCallBack, "click: clear", "")
SetOnEvent (mCallBack, "dblclick", "")
SetOnEvent (mCallBack, "MouseMove", "")
SetOnEvent (mCallBack, "MouseOut", "")
SetOnEvent (mCallBack, "KeyUp", "")
SetOnEvent (mCallBack, "KeyPress", "")
SetOnEvent (mCallBack, "Click.Alt", "")
SetOnEvent (mCallBack, "Click.Shift", "")
SetOnEvent (mCallBack, "start", "")
SetOnEvent (mCallBack, "end", "")
SetOnEvent (mCallBack, "click: close", "")
SetOnEvent (mCallBack, "update: active", "")
SetOnEvent (mCallBack, "update: open", "")
SetOnEvent (mCallBack, "update: error", "")
SetOnEvent (mCallBack, "update: list-index", "")
SetOnEvent (mCallBack, "update: search-input", "")
SetOnEvent (mCallBack, "tiêu điểm", "")
SetOnEvent (mCallBack, "input", "")
SetOnEvent (mCallBack, "keydown", "")
SetOnEvent (mCallBack, "mousedown", "")
SetOnEvent (mCallBack, "mousedown.stop", "")
SetOnEvent (mCallBack, "mouseup", "")
SetOnEvent (mCallBack, "di chuột qua", "")
SetOnEvent (mCallBack, "submit", "")
SetOnEvent (mCallBack, "MouseEnter", "")
SetOnEvent (mCallBack, "MouseLeave", "")
SetOnEvent (mCallBack, "submit.prevent", "")
SetOnEvent (mCallBack, "dblclick.prevent", "")
SetOnEvent (mCallBack, "keydown.enter.prevent", "")
SetOnEvent (mCallBack, "keydown.left.prevent", "")
SetOnEvent (mCallBack, "keydown.right.prevent", "")
SetOnEvent (mCallBack, "keydown.space.prevent", "")
SetOnEvent (mCallBack, "keyup.enter", "")
SetOnEvent (mCallBack, "keyup.enter.prevent", "")
SetOnEvent (mCallBack, "keyup.esc", "")
SetOnEvent (mCallBack, "touchstart.stop", "")
SetOnEvent (mCallBack, "click: event", "")
SetOnEvent (mCallBack, "click: more", "")
SetOnEvent (mCallBack, "click: date", "")
SetOnEvent (mCallBack, "keydown.esc", "")
SetOnEvent (mCallBack, "drop", "")
SetOnEvent (mCallBack, "dragover", "")
SetOnEvent (mCallBack, "dragenter", "")
SetOnEvent (mCallBack, "dragleave", "")
SetOnEvent (mCallBack, "transitionend", "")
SetOnEvent (mCallBack, "update: mini-variant", "")
SetOnEvent (mCallBack, "update: indetermina", "")
SetOnEvent (mCallBack, "dblclick: date", "")
SetOnEvent (mCallBack, "click: row", "")
SetOnEvent (mCallBack, "current-items", "")
SetOnEvent (mCallBack, "dblclick: row", "")
SetOnEvent (mCallBack, "item-expand", "")
SetOnEvent (mCallBack, "toggle-select-all", "")
SetOnEvent (mCallBack, "click: giờ", "")
SetOnEvent (mCallBack, "nhấp: phút", "")
SetOnEvent (mCallBack, "click: second", "")
SetOnEvent (mCallBack, "update: period", "")
SetOnEvent (mCallBack, "update: color", "")
SetOnEvent (mCallBack, "update: mode", "")
SetOnEvent (mCallBack, "click: day", "")
SetOnEvent (mCallBack, "click: day-category", "")
SetOnEvent (mCallBack, "click: event", "")
SetOnEvent (mCallBack, "click: khoảng thời gian", "")
SetOnEvent (mCallBack, "click: more", "")
SetOnEvent (mCallBack, "click: time", "")
SetOnEvent (mCallBack, "click: time-category", "")
SetOnEvent (mCallBack, "contextmenu: row", "")
SetOnEvent (mCallBack, "contextmenu: row.prevent", "")
SetOnEvent (mCallBack, "contextmenu: date", "")
SetOnEvent (mCallBack, "contextmenu: day", "")
SetOnEvent (mCallBack, "contextmenu: day-category", "")
SetOnEvent (mCallBack, "contextmenu: event", "")
SetOnEvent (mCallBack, "contextmenu: khoảng", "")
SetOnEvent (mCallBack, "contextmenu: time", "")
SetOnEvent (mCallBack, "contextmenu: time-category", "")
SetOnEvent (mCallBack, "đã chuyển", "")
SetOnEvent (mCallBack, "click: bên ngoài", "")
SetOnEvent (mCallBack, "click: next", "")
SetOnEvent (mCallBack, "bấm: trước", "")
Kết thúc Sub [/ code]

Điều này có nghĩa là, nếu một sự kiện không được liệt kê trong danh sách #Event của bất kỳ lớp nào, miễn là nó được xác định trong BindAllEvents, bạn có thể chỉ cần thêm nó vào mô-đun mã / lớp của mình và sự kiện đó sẽ được chọn và nó sẽ hoạt động .

Nội bộ này gọi SubExists đầu tiên trước khi nó tạo trình nghe sự kiện.

Could you please send me 1 Example

Mashiane · Oct 2, 2022

Click

MouseMove

BVAD3 7.35
Solution Example

NGUYEN TUAN ANH · Oct 2, 2022

Thanks @Mashiane Very much !
I followed you and succeeded with my map

B4J Question [SOLVED],[BANanoVuetifyAD3] Could you please Add more event with Leaflet

NGUYEN TUAN ANH

Active Member

DonManfred

Expert

Mashiane

Expert

NGUYEN TUAN ANH

Active Member

Documentation - Leaflet - a JavaScript library for interactive maps

Mashiane

Expert

NGUYEN TUAN ANH

Active Member

Mashiane

Expert

NGUYEN TUAN ANH

Active Member

Similar Threads