Inserire un Oggetto grafico su una MapView

E' possibile mostrare su una MapView un Oggetto grafico (un Controllo: "Button", "Label", "PictureBox", etc) da utilizzare eventualmente durante la visione della mappa. ^{[nota 1]}

Il predetto Controllo grafico deve in realtà essere posto sulla DrawingArea, "Figlia" indiretta della MapView.
Come si sa, la MapView possiede un proprio "Figlio", che è un Oggetto Panel, il quale a sua volta possiede un Oggetto "Figlio", che è appunto una DrawingArea, utilizzata per mostrare la mappa prescelta.
Se il Controllo grafico, da far mostrare, fosse attribuito, come ulteriore "Figlio", alla MapView o al Panel, la sua dimensione assumerebbe interamente quella della MapView. Pertanto il "Parent" del Controllo grafico, da far mostrare sulla MapView, dovrà essere la DrawingArea meglio sopra specificata.

Mostriamo qualche esempio pratico.

Inserire una PictureBox sulla mappa

Mostriamo un possibile codice, commentato, con il quale si imposterà una PictureBox sulla mappa.

Private MapView1 As MapView
Private Const ZOOM As Byte = 14
Private Const COEFFICIENTE As Single = 1.5
Private Const PERCORSO_FILE_IMMAGINE As String = "/percorso/del/file/immagine"
Private mp As New MapPoint(41.89018, 12.49230)
Private zm As Byte = ZOOM
Private PictureBox1 As PictureBox
Private im As Image


Public Sub Form_Open()

 Dim pn As Panel
 Dim pt As Point

 With Me
   .W = Screen.AvailableWidth
   .H = Screen.AvailableHeight
   .Arrangement = Arrange.Fill
 End With
 With MapView1 = New MapView(Me) As "MapView1"
   .Map.AddTile("GoogleMap", "https://mt0.google.com/vt/lyrs=s&hl=&x={x}&y={y}&z={z}")
   .Map.Zoom = ZOOM
' Imposta il centro della mappa visibile all'apertura iniziale:
   .Map.Center = mp
   pt = New Point(.Map.MapPointToPixelRel(mp).X, .Map.MapPointToPixelRel(mp).Y)
 End With

 ' Carica un file immagine:
 im = Image.Load(PERCORSO_FILE_IMMAGINE)

' Individua dapprima l'Oggetto "Figlio" della "MapView", che è un "Panel":
 pn = MapView1.Children[0]

' Attribuisce il Controllo grafico "PictureBox" all'Oggetto "Figlio" (una "DrawingArea") del predetto "Panel", per impedire che altrimenti si espanda alla dimensione della "MapView":
 With PictureBox1 = New PictureBox(pn.Children[0])
' Posiziona la "PictureBox" nei pressi di determinate coordinate geografiche, trasformate adeguatamente in coordinate x,y dell'Oggetto "DrawingArea" (ossia: "pn.Children[0]"), del quale la "PictureBox" è ormai "Figlio":
   .X = pt.X
   .Y = pt.Y
' Imposta la formula per proporzionare la lunghezza della "PictureBox" rispetto al valore dello zoom corrente:
   .W = im.W * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM))
   .H = im.H * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM))
   .Image = im
 End With

End

Public Sub MapView1_MouseDown()

 Dim mpo As MapPoint = MapView1.Map.PixelToMapPointRel(Point(Mouse.X, Mouse.Y))

' Mostra le coordinate geografiche correnti del puntatore del Mouse sul bordo superiore della "MapView":
 Me.Text = Format(mpo.Lat, "#.000000") & "    " & Format(mpo.Lon, "#.000000")

End

' Questo Evento garantisce che, sia all'apertura iniziale della mappa, sia in caso di spostamento la Mappa con il mouse, la  "PictureBox" si mostri solo e sempre alle sue coordinate geografiche prestabilite.
' Infatti, se l'istruzione viene posta invece all'interno di un qualsiasi Evento del "Form", l'Oggetto "PictureBox" non acquisirà le predette coordinate.
Public Sub MapView1_Draw()

 With MapView1.Map
   PictureBox1.Move(.MapPointToPixelRel(mp).X, .MapPointToPixelRel(mp).Y)
 End With 

End

Public Sub MapView1_MouseWheel()

 With PictureBox1
' Imposta la formula per proporzionare la dimensione dell'immagine e conseguentemente della "PictureBox" rispetto al valore dello zoom corrente:
   .Image = im.Stretch(im.W * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM)), im.H * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM)), False)
   .Resize(.Image.W, .Image.H)
 End With

End

Public Sub MapView1_MouseUp()

' Se si modifica lo zoom della mappa modificando la posizione dello "Slider" predefinito, presente in alto a sinistra della mappa,  allora viene impostata la formula per proporzionare la dimensione dell'immagine e conseguentemente della "PictureBox" rispetto al valore dello zoom corrente:
 If MapView1.Map.Zoom <> zm Then
   With PictureBox1
     .Image = im.Stretch(im.W * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM)), im.H * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM)), False)
     .Resize(.Image.W, .Image.H)
   End With
  zm = MapView1.Map.Zoom
 Endif

End

Inserire un ComboBox sulla mappa

Private MapView1 As MapView
Private Const ZOOM As Byte = 14
Private ComboBox1 As ComboBox
Private Const WDIMENSIONE As Byte = 70
Private Const HDIMENSIONE As Byte = 20
Private Const COEFFICIENTE As Single = 1.2
Private mp As New MapPoint(41.89018, 12.49230)
Private zm As Byte = ZOOM


Public Sub Form_Open()

 Dim pn As Panel
 Dim pt As Point

 With Me
   .W = Screen.AvailableWidth
   .H = Screen.AvailableHeight
   .Arrangement = Arrange.Fill
 End With
 With MapView1 = New MapView(Me) As "MapView1"
   .Map.AddTile("GoogleMap", "https://mt0.google.com/vt/lyrs=s&hl=&x={x}&y={y}&z={z}")
   .Map.Zoom = ZOOM
   .Map.Center = mp
   pt = New Point(.Map.MapPointToPixelRel(mp).X, .Map.MapPointToPixelRel(mp).Y)
 End With

' Individua dapprima l'Oggetto "Figlio" della "MapView", che è un "Panel":
 pn = MapView1.Children[0]

 With ComboBox1 = New ComboBox(pn.Children[0])
   .X = pt.X
   .Y = pt.Y
' Imposta la formula per proporzionare la lunghezza del "ComboBox" rispetto al valore dello zoom corrente:
   .W = WDIMENSIONE * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM))
   .H = HDIMENSIONE * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM))
   .Text = "ComboBox"
   .List = ["aaaa", "bbbb", "cccc", "dddd"]
 End With

End

Public Sub MapView1_MouseDown()

 Dim mpo As MapPoint = MapView1.Map.PixelToMapPointRel(Point(Mouse.X, Mouse.Y))

 Me.Text = Format(mpo.Lat, "#.000000") & "    " & Format(mpo.Lon, "#.000000")

End

Public Sub MapView1_Draw()

 With MapView1.Map
   ComboBox1.Move(.MapPointToPixelRel(mp).X, .MapPointToPixelRel(mp).Y)
 End With 

End

Public Sub MapView1_MouseWheel()

 With ComboBox1
' Imposta la formula per proporzionare la dimensione del "ComboBox" rispetto al valore dello zoom corrente:
   .Resize(WDIMENSIONE * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM)), HDIMENSIONE * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM)))
 End With

End

Public Sub MapView1_MouseUp()

' Se si modifica lo zoom della mappa modificando la posizione dello "Slider" predefinito, presente in alto a sinistra della mappa,  allora viene impostata la formula per proporzionare la dimensione del "ComboBox" rispetto al valore dello zoom corrente:
 If MapView1.Map.Zoom <> zm Then
   With ComboBox1
     .Resize(WDIMENSIONE * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM)), HDIMENSIONE * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM)), False)
   End With
   zm = MapView1.Map.Zoom
 Endif

End

Inserire un ToggleButton sulla mappa

Mostriamo un possibile codice, commentato, con il quale si imposterà un ToggleButton sulla mappa, premendo il quale verrà riprodotto un file audio o MIDI. Il percorso di tale file sonoro dovrà essere impostato nella Costante "PERCORSO_FILE_AUDIO".

Private MapView1 As MapView
Private Const ZOOM As Byte = 14
Private tb As ToggleButton
Private Const DIMENSIONE As Byte = 50
Private Const COEFFICIENTE As Single = 1.2
Private Const PERCORSO_FILE_AUDIO As String = "/percorso/del/file/audio"
Private mp As New MapPoint(41.89018, 12.49230)
Private zm As Byte = ZOOM
Private ob As Object


Public Sub Form_Open()

 Dim pn As Panel
 Dim pt As Point

 With Me
   .W = Screen.AvailableWidth
   .H = Screen.AvailableHeight
   .Arrangement = Arrange.Fill
 End With
 With MapView1 = New MapView(Me) As "MapView1"
   .Map.AddTile("GoogleMap", "https://mt0.google.com/vt/lyrs=s&hl=&x={x}&y={y}&z={z}")
   .Map.Zoom = ZOOM
' Imposta il centro della mappa visibile all'apertura iniziale:
   .Map.Center = mp
   pt = New Point(.Map.MapPointToPixelRel(mp).X, .Map.MapPointToPixelRel(mp).Y)
 End With 

' Individua dapprima l'Oggetto "Figlio" della "MapView", che è un "Panel":
 pn = MapView1.Children[0]

' Attribuisce il Controllo grafico "ToggleButton" all'Oggetto "Figlio" (una "DrawingArea") del predetto "Panel", per impedire che altrimenti si espanda alla dimensione della "MapView":
 With tb = New ToggleButton(pn.Children[0]) As "Audio"
' Posiziona il "ToggleButton" nei pressi di determinate coordinate geografiche, trasformate adeguatamente in coordinate x,y dell'Oggetto "DrawingArea" (ossia: "pn.Children[0]"), del quale il "ToggleButton" è ormai "Figlio":
   .X = pt.X
   .Y = pt.Y
' Imposta la formula per proporzionare la lunghezza del "ToggleButton" rispetto al valore dello zoom corrente:
   .W = DIMENSIONE * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM))
   .H = .W * 0.5
   .Text = "Mus"
   .Tooltip = "Ascolta la musica"
 End With

End

Public Sub MapView1_MouseDown()

 Dim mpo As MapPoint = MapView1.Map.PixelToMapPointRel(Point(Mouse.X, Mouse.Y))

' Mostra le coordinate geografiche correnti del puntatore del Mouse sul bordo superiore della "MapView":
 Me.Text = Format(mpo.Lat, "#.000000") & "    " & Format(mpo.Lon, "#.000000")

End

' Questo Evento garantisce che, sia all'apertura iniziale della mappa, sia in caso di spostamento la Mappa con il mouse, il "Button" si mostri solo e sempre alle sue coordinate geografiche prestabilite.
' Infatti, se l'istruzione viene posta invece all'interno di un qualsiasi Evento del "Form", l'Oggetto "Rect" non acquisirà le predette coordinate.
Public Sub MapView1_Draw()

 With MapView1.Map
   tb.Move(.MapPointToPixelRel(mp).X, .MapPointToPixelRel(mp).Y)
 End With 

End

Public Sub MapView1_MouseWheel()

' Imposta la formula per proporzionare la dimensione del "ToggleButton" rispetto al valore dello zoom corrente:
 tb.Resize(DIMENSIONE * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM)), DIMENSIONE * 0.5 * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM)))

End

Public Sub MapView1_MouseUp()

' Se si modifica lo zoom della mappa modificando la posizione dello "Slider" predefinito, presente in alto a sinistra della mappa,  allora viene impostata la formula per proporzionare la dimensione del "ToggleButton" rispetto al valore dello zoom corrente:
 If MapView1.Map.Zoom <> zm Then
   With tb
     .Resize(DIMENSIONE * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM)), DIMENSIONE * 0.5 * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM)))
   End With
   zm = MapView1.Map.Zoom
 Endif

End

Public Sub Audio_Click()

 If Not tb.Value Then 
' Se, dopo aver avviato l'esecuzione audio, si preme nuovamente il "ToggleButton", l'esecuzione viene terminata:
   Object.Call(ob, "Close", Null)
   ob = Null
   Return 
 Endif

 Dim cl As Class

' Si è deciso di non caricare preliminarmente dall'IDE di Gambas il Componente "gb.media", bensì ora da codice:
 Component.Load("gb.media")
 cl = Class.Load("MediaPlayer")

 ob = cl.New()

' Carica il file audio:
 With Object
   .Attach(ob, Me, "MPlayer")
   .SetProperty(ob, "Url", Object.Call(Class.Load("Media"), "URL", [PERCORSO_FILE_AUDIO]))
   .Call(ob, "Play", Null)
 End With

End

Public Sub MPlayer_End()

 Object.Call(ob, "Close", Null)
 tb.Value = False

End

Inserire un ToggleButton sulla mappa con il quale avviare l'esecuzione di un file video

Mostriamo il codice, simile al precedente, con il quale questa volta si mostrerà sulla mappa un ToggleButton, cliccando sul quale si eseguirà un file video che sarà mostrato all'interno di una autonoma finestra creata dall'Oggetto MediaPlayer presso il ToggleButton.

Private MapView1 As MapView
Private Const ZOOM As Byte = 14
Private tb As ToggleButton
Private Const DIMENSIONE As Byte = 50
Private Const COEFFICIENTE As Single = 1.2
Private Const PERCORSO_FILE_VIDEO As String = "/percorso/del/file/video"
Private mp As New MapPoint(41.89018, 12.49230)
Private zm As Byte = ZOOM
Private ob As Object


Public Sub Form_Open()

 Dim pn As Panel
 Dim pt As Point

 With Me
   .W = Screen.AvailableWidth
   .H = Screen.AvailableHeight
   .Arrangement = Arrange.Fill
 End With
 With MapView1 = New MapView(Me) As "MapView1"
   .Map.AddTile("GoogleMap", "https://mt0.google.com/vt/lyrs=s&hl=&x={x}&y={y}&z={z}")
   .Map.Zoom = ZOOM
   .Map.Center = mp
   pt = New Point(.Map.MapPointToPixelRel(mp).X, .Map.MapPointToPixelRel(mp).Y)
 End With 

 pn = MapView1.Children[0]

 With tb = New ToggleButton(pn.Children[0]) As "Video"
   .X = pt.X
   .Y = pt.Y
   .W = DIMENSIONE * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM))
   .H = .W * 0.5
   .Text = "Mus"
   .Tooltip = "Ascolta la musica"
 End With

End

Public Sub MapView1_MouseDown()

 Dim mpo As MapPoint = MapView1.Map.PixelToMapPointRel(Point(Mouse.X, Mouse.Y))

 Me.Text = Format(mpo.Lat, "#.000000") & "    " & Format(mpo.Lon, "#.000000")

End

Public Sub MapView1_Draw()

 With MapView1.Map
   tb.Move(.MapPointToPixelRel(mp).X, .MapPointToPixelRel(mp).Y)
 End With

' Fa in modo che, qualora la mappa venga spostata, la finestra del video segua sempre il "ToggleButton" che ha dato avvio alla riproduzione video:
 If Object.IsValid(ob) Then 
   ob.SetWindow(MapView1, tb.X + tb.W, tb.Y + tb.H, 150, 100)
 Endif

End

Public Sub MapView1_MouseWheel()

' Imposta la formula per proporzionare la dimensione del "ToggleButton" rispetto al valore dello zoom corrente:
 tb.Resize(DIMENSIONE * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM)), DIMENSIONE * 0.5 * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM)))

End

Public Sub MapView1_MouseUp()

' Se si modifica lo zoom della mappa modificando la posizione dello "Slider" predefinito, presente in alto a sinistra della mappa,  allora viene impostata la formula per proporzionare la dimensione del "ToggleButton" rispetto al valore dello zoom corrente:
 If MapView1.Map.Zoom <> zm Then
   With tb
     .Resize(DIMENSIONE * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM)), DIMENSIONE * 0.5 * CSingle(COEFFICIENTE ^ (MapView1.Map.Zoom - ZOOM)))
   End With
   zm = MapView1.Map.Zoom
 Endif

End

Public Sub Video_Click()

 If Not tb.Value Then 
   Object.Call(ob, "Close", Null)
   ob = Null
   MapView1.Refresh
   Return 
 Endif

 Dim cl As Class

 Component.Load("gb.media")
 cl = Class.Load("MediaPlayer")

 ob = cl.New()

 With Object
   .Attach(ob, Me, "Mplayer")
' Carica il file video:
   .SetProperty(ob, "Url", Object.Call(Class.Load("Media"), "URL", [PERCORSO_FILE_VIDEO]))
' Imposta i "Controllo" (la "DrawingArea" 'Figlia del "Panel"), ove sarà mostrato il video:
   .Call(ob, "SetWindow", [MapView1, tb.X + tb.W, tb.Y + tb.H, 150, 100])
   .Call(ob, "Play", Null)
 End With

End

Public Sub MPlayer_End()

 Object.Call(ob, "Close", Null)
 tb.Value = False
 MapView1.Refresh

End

Se non si vogliono utilizzare le Classi Component e Class, bensì si intende effettuare una dichiarazione diretta della Classe MediaPlayer, si dovranno effettuare alcune modifiche.

La dichiarazione della variabile Globale "Private ob As Object" va così sostituita:

Private mpl As MediaPlayer

Nella riga condizionale della sub-routine "Public Sub MapView1_Draw()" l'identificatore "ob" va così sostituito:

 If Object.IsValid(mpl) Then 
  mpl.SetWindow(MapView1, tb.X + tb.W, tb.Y + tb.H, 150, 100)
Endif

Le sub-routine "Public Sub Video_Click()" e "Public Sub MPlayer_End()" vanno così sostituita:

Public Sub Video_Click()

 If Not tb.Value Then 
   mpl.Close
   mpl = Null
   MapView1.Refresh
   Return 
 Endif

 With mpl = New MediaPlayer As "MPlayer"
   .URL = Media.URL(PERCORSO_FILE_VIDEO)
   .SetWindow(MapView1, tb.X + tb.W, tb.Y + tb.H, 150, 100)
   .Play
 End With

End


Public Sub MPlayer_End()

 mpl.Close
 tb.Value = False
 MapView1.Refresh

End

Inserire una MapView all'interno di una MapView principale

Possiamo ovviamente inserire all'interno di una MapView principale una MapView più piccola, magari per vedere una porzione particolare e con un valore dello zoom superiore dell'area della mappa mostrata dalla MapView principale.
Nel codice, che segue, si porrà in alto a destra di una MapView una MapView più piccola che mostrerà una porzione di mappa, nel punto puntato dal mouse, con un valore dello zoom superiore di due unità rispetto a quello della MapView principale.

Private MapView1 As MapView
Private mp As New MapPoint(41.89018, 12.49230)
Private MapView2 As MapView
Private mpo As MapPoint


Public Sub Form_Open()

Dim pn As Panel

With Me
  .W = Screen.AvailableWidth
  .H = Screen.AvailableHeight
End With
With MapView1 = New MapView(Me) As "MapView1"
  .X = 0
  .Y = 0
  .Resize(Me.W, Me.H)
  .Map.AddTile("GoogleMap", "https://mt0.google.com/vt/lyrs=s&hl=&x={x}&y={y}&z={z}")
  .Map.Zoom = 14
  .Map.Center = mp
End With 

pn = MapView1.Children[0]

With MapView2 = New MapView(pn.Children[0]) As "MapView2"
  .X = MapView1.W * 0.70
  .Y = 0
  .W = MapView1.W * 0.3
  .H = MapView1.H * 0.3
  .Border = Border.Raised
  .Map.AddTile("GoogleMap", "https://mt0.google.com/vt/lyrs=s&hl=&x={x}&y={y}&z={z}")
  .Map.Center = mp
  .Map.Zoom = 16
End With

End


Public Sub MapView1_MouseDown()

 mpo = MapView1.Map.PixelToMapPointRel(Point(Mouse.X, Mouse.Y))

 Me.Text = Format(mpo.Lat, "#.000000") & "    " & Format(mpo.Lon, "#.000000")

End


Public Sub MapView1_MouseUp()
 
 MapView2.Map.Center = mpo
 MapView2.Map.Zoom = MapView1.Map.Zoom + 2

End


Public Sub MapView1_MouseWheel()
 
 MapView2.Map.Center = mpo
 MapView2.Map.Zoom = MapView1.Map.Zoom + 2
 
End


Public Sub MapView1_MouseMove()
 
 mpo = MapView1.Map.PixelToMapPointRel(Point(Mouse.X, Mouse.Y))

 Me.Text = Format(mpo.Lat, "#.000000") & "    " & Format(mpo.Lon, "#.000000")

End

Note

[1] Vedere anche la seguente pagina: Mostrare sulla MapView disegni, immagini e Controlli senza l'uso del Metodo Map.AddShape()