I want to create a mapview screen in Vision that shows only the region of Texas with some sites marked in the map with pins, and the sites will show the current weather information if hovered over with the mouse. Something similar to what's in this picture but without the road marked in blue:
I looked into Openstreetmap but I'm still not sure how to implement the weather/pinned locations functionality using the web component. I also have heard about leaflet.js but I don't see where I can implement it with JS. Any idea of how I can achieve this map screen?
This isn't really possible in Vision due to a lack of the map component. At best, you might be able to use the web browser to show a website that's pre-zoomed into the area you want with weather using something like the link below with their embedded widget builder (just pull the URL from the embed string it creates).
If you have the WebDev and the Web Browser Module you may implement it fully with .js. To answer, you can implement the js within the wevdev module and use the web browser in vision to deploy. Another option, miles away from js it to use the component paintable canvas and embed a static image of the map and create the pins with icons on X, Y in place maybe inside a container and implement the hover event with java awt and swing.
Thanks everyone for your answers. I found a way to do it through perspective, I just created a view and used the map component and then pulled this view's url using the web component in vision and I was able to see the map. Thank you!