NUNCA MAIS PASSE RAIVA POR NÃO CONSEGUIR RESOLVER UM PROBLEMA COM O EXCEL - GARANTIDO!

UNIVERSIDADE DO VBA - Domine o VBA no Excel Criando Sistemas Completos - Passo a Passo - CLIQUE AQUI

Você está em: PrincipalTutoriaisMauricioborges : Virtualearth001
Quer receber novidades e e-books gratuitos?

FILTRO DE TUTORIAIS:


 

Virtual Earth – Primeiro Passo

 

Livros publicados do autor:

 

 

Olá pessoal, o objetivo deste artigo é mostrar como utilizar o “Virtual Earth”, Terra Virtual. Para quem ainda não sabe muito bem o que é este componente, irei dizer: - É um componente onde pode ser visto o mapa do planeta Terra online direto de sua página ou portal na internet. Pode ser localizado um país, cidade e rua com uma visão surpreendente; isso tudo direto do seu site, pode ser um serviço disponibilizado ao usuário do seu site / portal.

 

Mostrarei como utilizar este componente criado pela Microsoft passo a passo e assim alcançar o meu objetivo. A versão que utilizarei é a 2.0 do Virtual Earth Map Control. O mapa é usado no Virtual Earth, é um controle JScript ou JavaScript e uma progressiva folha estilo sheet (css).

 

Ao final, sua página ficará como da figura referência 1.1.

 

Referência: 1.1 – Terra Virtual

 

Além do mapa, sua página ficará com alguns controles (botões) para subir, descer, ir para direita, ir para esquerda, aproxima e distanciar. Estes nomes podem ser colocados de acordo com o gosto; tanto inglês como português.

 

Usando o Map Control (Controle de mapa)

 

O Virtual Earth Map Control é um script .js que pode ser encontrado no link http://dev.virtualearth.net/standard/v2/MapControl.js. O link mostrado pode ser usado diretamente do site, isso assegura o seu site sempre atualizado, caso haja qualquer outro tipo de atualização da versão do controle. O mesmo pode ser baixado e utilizado diretamente do seu site, portanto não poderá ser atualizado sempre, ou então, você terá que baixar todos os dias e atualiza-lo em seu site. Considero que o melhor mesmo seja utilizar diretamente do link indicado.

 

O outro link do estilo sheet pode ser encontrado utilizando o endereço http://dev.vitualearth.net/standard/v2/MapControl.css.

 

Criando um Controle de Mapa (Map Control)

 

Para criar uma nova instancia de um Virtual Earth Map Control precisarei escrever uma simples função em JScript da minha página. Posicionar dentro da página e montar um conteúdo inicial do controle. O construtor controle do mapa pode ser descrito da seguinte forma: (Referência 1.2)

 

Msn.VE.MapControl._constructor(map, params);

 

Referência: 1.2

 

map: Objeto para a criação do mapa.

 

params: O objeto contém parâmetros requeridos para iniciar o mapa.

 

O parâmetro dos objetos contém os seguintes membros: (Referência 1.3)

 

Referência: 1.3

 

Um valor “Boolean” é especificado no meio do controle mapa que suporte o obliqueEnabled da imagem, ou seja, que tenha suporte suficiente para mostrar a imagem gráfica. Se o valor atribuído for true, você também deverá especificar o parâmetro obliqueUrl. Especificar a URL da uma imagem da página.

 

Página simples usando o Virtual Map Control

 

<html>

<head>

<title>Virtual Earth</title>

<link href="http://dev.virtualearth.net/standard/v2/MapControl.css" type="text/css" rel="stylesheet" />

<script src="http://dev.virtualearth.net/standard/v2/MapControl.js" type="text/javascript"></script>

<script language="javascript" type="text/javascript">

var map = null;

 

function OnPageLoad()

{

    var params = new Object();

 

    params.latitude = -7.541648553787295;

    params.longitude= -52.20703125;

    params.zoomlevel = 4;

    params.mapstyle = Msn.VE.MapStyle.Road;

    params.showScaleBar = true;

    params.showDashboard = true;

    params.dashboardSize = Msn.VE.DashboardSize.Normal;

    params.dashboardX = 5;

    params.dashboardY = 5;

 

map = new Msn.VE.MapControl(

        document.getElementById("myMap"),

        params);

 

    map.Init();

}

</script>

<body onload="OnPageLoad();">

    <div id="myMap" style="WIDTH: 600px; HEIGHT: 400px; OVERFLOW:hidden"></div>

</body>

</html>

 

Referência: 1.4

 

Resultado (Referência 1.5)

 

Referência: 1.5

 

Explicação:

 

O primeiro de tudo criei uma página normal em html utilizando javascript. Coloquei o título da página. (Referência 1.6)

 

<title>Virtual Earth</title>

 

Referência: 1.6

 

Logo após, adicionei os dois arquivos necessários para o perfeito funcionamento do Virtual Earth. Coloquei os dois endereços do site indicado anteriormente para os arquivos .js e .css. (Referência 1.7)

 

<link href="http://dev.virtualearth.net/standard/v2/MapControl.css" type="text/css" rel="stylesheet" />

<script src="http://dev.virtualearth.net/standard/v2/MapControl.js" type="text/javascript"></script>

 

Referência: 1.7

 

Até o momento foi simples e fácil o desenvolvimento, portanto, devo criar uma função que ao iniciar a página, a mesma seja executada. Essa função deve ser em JScript. Coloquei o nome de OnPageLoad(). (Referência 1.8)

 

<script language="javascript" type="text/javascript">

var map = null;

 

function OnPageLoad()

{

    var params = new Object();

    params.latitude = -7.541648553787295;

    params.longitude= -52.20703125;

    params.zoomlevel = 4;

    params.mapstyle = Msn.VE.MapStyle.Road;

    params.showScaleBar = true;

    params.showDashboard = true;

    params.dashboardSize = Msn.VE.DashboardSize.Normal;

    params.dashboardX = 5;

    params.dashboardY = 5;

 

map = new Msn.VE.MapControl(

        document.getElementById("myMap"),

        params);

 

    map.Init();

}

</script>

 

Referência: 1.8

 

Explicação:

 

É importante dizer que, a primeira linha é obrigatória, ou seja, para indicar que iniciou um script; <script>... O passo seguinte foi adicionar uma variável map com o comando. (Referência 1.9)

 

var map = null;

 

Referência: 1.9

 

Usarei a variável (referência 1.9) para ser utilizada mais abaixo juntamente com o componente. A function será chamada automaticamente ao iniciar a página. Precisei criar uma outra variável do tipo Object() chamada params, onde indico os parâmetros necessários antes de usar o MapControl. A referência 1.10 mostra a function perfeitamente até o momento falado.

 

function OnPageLoad()

{

    var params = new Object();

 

    params.latitude = -7.541648553787295;

    params.longitude= -52.20703125;

    params.zoomlevel = 4;

    params.mapstyle = Msn.VE.MapStyle.Road;

    params.showScaleBar = true;

    params.showDashboard = true;

    params.dashboardSize = Msn.VE.DashboardSize.Normal;

    params.dashboardX = 5;

    params.dashboardY = 5;

...

 

Referência: 1.10

 

Os parâmetros de latitude, longitude, zoomlevel e outros são necessários para que funcione perfeitamente. Atribui alguns valores cujo indica o caminho do Brasil, ou seja, ao iniciar a tela, automaticamente será mostrado a região do Brasil na América Latina. Caso tenha dúvida em algum parâmetro, a referência 1.3 cujo foi falado e explicado cada um deles.

 

params.latitude = -7.541648553787295;

params.longitude= -52.20703125;

 

Referência: 1.11

 

Os números (referência 1.11) indicam a localização diretamente do Brasil. Continuando com o script, preciso chamar o componente passando os seguintes dados: minha div e os parâmetros atribuídos. Em seguida, iniciar a aplicação. (Referência 1.12)

 

map = new Msn.VE.MapControl(

        document.getElementById("myMap"),

        params);

 

    map.Init();

 

Referência: 1.12

 

Para não ter problemas com versão do browser a ser utilizado, coloquei a minha div assim: “document.getElementById(“myMap”)”. Essa myMap é o nome ou id da div da página. Logo após coloquei a variável “params” criada anteriormente. Tudo isso, igualei a variável map. O método que chamei é o “Msn.VE.MapControl”. Na linha seguinte foi iniciar o mesmo com o comando “map.Init()”.

 

}

</script>

<body onload="OnPageLoad();">

    <div id="myMap" style="WIDTH: 600px; HEIGHT: 400px; OVERFLOW:hidden"></div>

</body>

</html>

 

Referência: 1.13

 

Fechei o script com a tag “ } ”, fechei a tag “</script>” e iniciei automaticamente o meu corpo html. Note que no atributo “onload” utilizei o mesmo nome da função criada anteriormente. Adicionei o “div” com o id igual a “myMap”, o mesmo nome indicado dentro da function. Depois fechei o corpo e o html.

 

Bom, nesse primeiro passo eu termino aqui, segue todo código explicado para melhor entendimento. (Referência 1.14)

 

<html>

<head>

<title>Virtual Earth</title>

<link href="http://dev.virtualearth.net/standard/v2/MapControl.css" type="text/css" rel="stylesheet" />

<script src="http://dev.virtualearth.net/standard/v2/MapControl.js" type="text/javascript"></script>

 

<script language="javascript" type="text/javascript">

var map = null;

 

function OnPageLoad()

{

    var params = new Object();

 

    //params.latitude = 51.567;

    //params.longitude = -0.026;

    params.latitude = -7.541648553787295;

    params.longitude= -52.20703125;

    params.zoomlevel = 4;

    params.mapstyle = Msn.VE.MapStyle.Road;

    params.showScaleBar = true;

    params.showDashboard = true;

    params.dashboardSize = Msn.VE.DashboardSize.Normal;

    params.dashboardX = 5;

    params.dashboardY = 5;

 

map = new Msn.VE.MapControl(

        document.getElementById("myMap"),

        params);

    map.Init();

}

</script>

<body onload="OnPageLoad();">

    <div id="myMap" style="WIDTH: 600px; HEIGHT: 400px; OVERFLOW:hidden"></div>

</body>

</html>

 

Referência: 1.14

 

Espero ter ajudado. Qualquer dúvida, favor entrar em contato através de o e-mail a seguir. Fiquem de olho no segundo passo.

 

Mauricio Junior

 

mauriciojunior@mauriciojunior.org

www.aspneti.com

www.mauriciojunior.org

 

Quer receber novidades e e-books gratuitos?

Cursos Online

  • Banco de Dados
  • Carreira
  • Criação/Web
  • Excel/Projetos
  • Formação
  • + Todas as categorias
  • Contato: Telefone: (51) 3717-3796 | E-mail: webmaster@juliobattisti.com.br | Whatsapp: (51) 99627-3434

    Júlio Battisti Livros e Cursos Ltda | CNPJ: 08.916.484/0001-25 | Rua Vereador Ivo Cláudio Weigel, 537 - Universitário, Santa Cruz do Sul/RS, CEP: 96816-208

    Todos os direitos reservados, Júlio Battisti 2001-2020 ®

    [LIVRO]: MACROS E PROGRAMAÇÃO VBA NO EXCEL 2010 - PASSO-A-PASSO

    APRENDA COM JULIO BATTISTI - 1124 PÁGINAS: CLIQUE AQUI