Incorporar Aplicações Web em Ecrã Completo

Pode usar aplicações playground para incorporar URLs externos no seu player. Estes URLs podem ser URLs alojados na web ou URLs de intranet local. Desde que o seu player tenha acesso ao URL através da sua rede conectada, está seguro. O que precisa de fazer é criar uma página HTML simples com um iFrame nela. O iFrame ficará em ecrã completo e apontará internamente para o endereço que necessita.

Exemplo 1: Integração do Google Maps com iFrame

<!DOCTYPE html>
<html>  
   <head>    
   <meta charset="utf-8" />  
   <title></title>
  </head>
  <body style="margin:0px;padding:0px;overflow:hidden"> 
    <iframe src="https://www.google.com/maps" frameborder="0" style="overflow:hidden;overflow-x:hidden;overflow-y:hidden;height:100%;width:100%;position:absolute;top:0px;left:0px;right:0px;bottom:0px" height="100%" width="100%">
    </iframe>
  </body>
</html>

No exemplo acima, pode ver uma aplicação que incorpora o Google Maps. Assim que carregar esta aplicação no seu player, verá uma experiência de Google Maps em ecrã completo.

Exemplo 2: Implementação Nativa com Dados de Trânsito ao Vivo

<!DOCTYPE html>
 <html>
   <head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">   <meta charset="utf-8">  
    <title>Live Google Traffic Data</title> 
    <style>       #map {         height: 100%;       }       html, body {         height: 100%;         margin: 0;         padding: 0;       }  
    </style> 
  </head>  
<body>   
  <div id="map"> </div>    
 <script>     
  function initMap() {         var map = new google.maps.Map(document.getElementById('map'), {           zoom: 13,           center: {lat: 34.04924594193164, lng: -118.24104309082031}         });          var trafficLayer = new google.maps.TrafficLayer();         trafficLayer.setMap(map);       }   
  </script>   
  <script async defer     src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap">  
   </script> 
  </body>
 </html>

Acima está outro exemplo onde pode sobrepor dados de trânsito ao vivo num mapa no seu player. Neste caso, uma implementação nativa é usada em vez de um iFrame. As aplicações playground podem alojar a sua funcionalidade. Idealmente, a aplicação deve obter apenas os dados necessários de fontes externas, armazenando localmente em cache por razões de resiliência de conexão. Alojar a interface web completa numa localização remota e apresentá-la através de um iFrame deve ser considerado um último recurso. Consulte aqui para mais detalhes sobre a documentação da Camada de Trânsito do Google.