I’m trying to embed some 3rd party javascript code inside of my LiveView page from Vesselfinder:
<script type="text/javascript">
// Map appearance
var width="100%"; // width in pixels or percentage
var height="300"; // height in pixels
var names=true; // always show ship names (defaults to false)
// Single ship tracking
var imo="9506291"; // display latest position (by IMO, overrides MMSI)
var show_track=true; // display track line (last 24 hours)
</script>
<script type="text/javascript" src="https://www.vesselfinder.com/aismap.js"></script>
If I just include this in my show.html.heex, this will not work as I have to refresh the page to make the embedded map visible (i.e., if I navigate directly to a page that should show the embedded map, it will show up but if I navigate from another LiveView to the page that’s supposed to show the embedded map, there is no map at all).
As Elixir is the first language I have learned, I have no experience with javascript, but I feel there should be something possible here with the Phoenix Liveview JS Hooks. Is there somebody that can point me in the right direction?
