Mcast location viewer

Httprelay.io mcast communication method example

by Jonas Jasas

HTML

<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyB0vbY3Fy-xQRr4WgqPJ_jECC_D0vRprXc"></script>
<div class="map"></div>

CSS

body {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  margin: 0;
}

.map {
  width: 100vw;
  height: 100vh;
}

JavaScript

$.ajaxSetup({xhrFields: {withCredentials: true}});	// For cookie with SeqId

var chanId = new URLSearchParams(top.location.search).get('chanid')
var map = new google.maps.Map($('.map')[0])
map.setZoom(17)
var marker = new google.maps.Marker({ map: map })

function getPosition(chanId) {
  $.getJSON('https://demo.httprelay.io/mcast/' + chanId)
    .done(data => {
      marker.setPosition(data)
      map.setCenter(data)
  	}).always(() => getPosition(chanId))
}

getPosition(chanId)