API do Google Maps. Distância segura
|
|
|
- Alice Graça Prada
- 8 Há anos
- Visualizações:
Transcrição
1 Tutorial API do Google Maps Como usar a API do Google Maps Distância segura Saiba como incorporar mapas interativos em suas páginas web Por Alberto Planas O Google Maps foi um dos serviços mais inovadores da Internet em Essa foi uma boa notícia também para desenvolvedores, já que sua API (Application Programming Interface) é aberta. Baseada em JavaScript (ou ECMAScript [1]), ela permite a criação de aplicativos que usam os mapas e imagens de satélite do Google. As páginas abrem tranqüilamente nos navegadores, sem a necessidade de nenhuma infraestrutura extra no servidor web. Neste artigo, vamos criar uma aplicativo de exemplo que calcula a distância de um trajeto marcado em um mapa. Chave A API do Google Maps está disponível gratuitamente, desde que se respeite algumas regras [2]. Por exemplo, o aplicativo precisa ser gratuito para o público e não pode exceder um certo número de consultas por dia aos servidores do Google. Também não pode esconder a marca Google. Para usar a API, é preciso antes obter uma chave [3]. Para isso, é preciso uma conta no Google (um Gmail já basta ou, então, é possível criar uma conta). Cada chave é associada a uma URL. Se você não tem espaço para hospedar seu aplicativo, mas tem um servidor Apache local, é possível registrar o endereço Tome cuidado, contudo, na hora de indicar uma URL: caso ela contenha erros ou for mal digitada, não será possível acessar a API. É importante fornecer o endereço completo, incluindo portas e diretórios. Por exemplo, em nossos testes com Apache na porta 8080 criamos um diretório chamado maps. É aqui que nosso site de exemplo será hospedado. O endereço que fornecemos foi: 54 março 2006 edição 18
![Baseada em JavaScript (ou ECMAScript [1]), ela permite a criação de aplicativos que usam os mapas e imagens de satélite do Google.](/docs-images/41/4857586/images/page_1.jpg "As páginas abrem tranqüilamente nos navegadores, sem a necessidade de nenhuma infraestrutura extra no servidor web.")
2 API do Google Maps Tutorial É possível criar quantas chaves forem necessárias. Uma vez que os termos de uso tenham sido aceitos, você recebe uma longa cadeia de caracteres alfanuméricos. Essa chave libera a API do Maps em seu aplicativo. A documentação oficial dessa API [4] recomenda o uso de XHTML no lugar de HTML convencional. A razão para isso é a maior portabilidade dos documentos XHTML. Na listagem 1 temos um exemplo de documento que acessa a API do Google Maps. O formato XHTML é declarado através do DOCTYPE, na linha 1. As linhas 2, 5 e 9 permitem que o navegador Internet Explorer exiba corretamente os efeitos da biblioteca JavaScript do Google Maps (particularmente, os efeitos de trajetos, como será explicado depois). Para incluir o arquivo de Java- Script contendo a chave da API, use um comando como o da linha 10 na listagem 1. Temos que alterar o trecho &key=xxxxx, incluindo a chave fornecida pelo Google. Curiosamente, todo o XHTML desse primeiro exemplo está entre as linhas 27 e 29. Nesse ponto, após carregar o documento HTML, o navegador precisa executar a função Java- Script onload, definida na linha 14. Na linha 28, temos um div de 500 x 500 pixels, com um identificador map, que iremos descrever mais tarde. A função onload inicia o mapa. Como já mencionamos, toda a API é escrita em JavaScript. Esse código vai rodar no navegador do visitante. Como nem todos os navegadores implementam a mesma versão e funcionalidade do JavaScript, Listagem 1: teste1.html 1. <!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Strict//EN TR/xhtml1/DTD/xhtml1-strict.dtd > 2. <html xmlns= xmlns:v= urn:schemas-microsoft-u com:vml > 3. <head> 4. <title>exemplo 1 - teste1.html</title> 5. <style type= text/css > 6. v\:* { 7. behavior:url(#default#vml); 8. } 9. </style> 10. <script src= U type= text/javascript ></script> 11. <script type= text/javascript > 12. //<![CDATA[ function onload() { 15. if (GBrowserIsCompatible()) { 16. var map = new GMap(document.getElementById( map )); 17. map.addcontrol(new GSmallMapControl()); 18. map.addcontrol(new GMapTypeControl()); 19. map.addcontrol(new GScaleControl()); 20. map.centerandzoom(new GPoint( , ), 4); 21. } 22. } //]]> 25. </script> <body onload= onload() > 28. <div id= map style= width: 500px; height: 500px ></div> 29. </body> 30. </html> março 2006 edição 18 55
3 Tutorial API do Google Maps pode haver incompatibilidades. Para garantir que o aplicativo rode em todos os navegadores oficialmente compatíveis, vamos usar a função GBrowserIsCompatible (linha 15). Se o usuário estiver usando o Firefox, Safari, Opera ou Internet Explorer 5.5 (ou superior) não teremos nenhum tipo de problema. Na próxima linha, vamos criar um objeto do tipo GMap. Vamos passar ao construtor o objeto div identificado por map. Esse objeto HTML será usado pelo GMap para inserir um mapa com o tamanho associado de sua tag. O GMap oferece uma interface cuja documentação pode ser consultada em [3] (há diversos tipos de construtores para esse objeto). Já na linha 17 começamos a usar o método addcontrol(). Usaremos Figura 1: O grande controle da esquerda corresponde a um GLargeMapControl. O de tamanho médio na direita é um GSmallMapControl. O menor é um GSmallZoomControl. esse método para adicionar diversos controles ao mapa, que nos permitirão modificar seu comportamento. Poderemos rolar o mapa, simplesmente pressionando o botão esquerdo do mouse e arrastando o cursor. Podemos usar também um componente que permite mudar o nível de zoom. Esse componente é aquele que adicionamos na linha 17 da listagem 1. Ele corresponde ao controle no canto superior direito da figura 1. Podemos brincar um pouco com o código, mudando-o para: map.addcontrol(new U GLargeMapControl()); Desse modo, podemos incluir controles de zoom e posição separados. Há outros dois tipos de controle que podemos adicionar: um seletor de tipo de mapa e um controle de escala, tanto em milhas quanto quilômetros. Desses dois, o primeiro é o mais importante. Ele foi incluído na linha 18 da listagem 1. Há três tipos de mapas: normal, satélite e híbrido (uma mistura dos dois primeiros). Esses tipos de mapas estão exemplificados entre as figuras 2 e 4. No entanto, mapas com nomes de ruas e endereços, atualmente, só estão disponíveis para os Estados Unidos, Inglaterra e Japão. Na linha 20 centramos a imagem, especificando latitude, longitude e nível de zoom. Para esse exemplo, escolhemos as coordenadas de Palo Alto, na Califórnia. É preciso um pouco de cuidado na hora de indicar as coordenados do ponto onde vamos centrar o mapa. Primeiro, temos que indicar a longitude e depois a latitude (no geral, coordenadas costumam ser passadas na ordem inversa). Após essa introdução, vamos adicionar a parte do programa que calcula as distâncias (listagem 2). Figura 2: O mapa com as ruas de uma região de Palo Alto, no estado da Califórnia. Figura 3: A foto de satélite dessa mesma área, mostrando as casas e terrenos vazios. Figura 4: O modo híbrido mistura os dois tipos. É possível ver os nomes das ruas na própria foto. 56 março 2006 edição 18
4 API do Google Maps Tutorial Esfera Qualquer ponto da Terra pode ser localizado usando-se dois números: latitude e longitude. Mas, se soubermos as coordenadas de dois pontos na superfície de uma esfera, ainda não poderemos calcular a distância entre esses dois locais. Precisamos de mais uma informação: o raio da esfera. Se considerarmos que a Terra tem, na média (o planeta não é uma esfera perfeita), um raio de 6378 km, podemos usar geometria esférica para calcular distâncias baseadas em latitudes e longitudes [5]. Primeiro precisamos converter latitudes e longitudes de graus para radianos. Então, aplicamos a fórmula: d = * acos(seno(lat1) * seno(lat2) + coseno(lat1) * coseno(lat2) * coseno(lon2 - lon1)) Essa equação não requer muita discussão, já que seu uso pode ser examinado na função calcdistancia, da listagem 2. A listagem 2 é ligeiramente diferente do primeiro exemplo. A primeira diferença é que, na chamada ao construtor GMap, estamos fornecendo um parâmetro extra (linha 21). Esse parâmetro é uma matriz de elemento único. Nós a usamos para indicar que só queremos o modo de exibição do tipo satélite. A API permite a associação de funções em uma lista pré-definida de eventos. Dessa maneira, podemos alterar o comportamento do sistema em resposta a um clique, uma rolagem ou à adição de uma marca, por exemplo. Há uma lista completa de eventos na documentação oficial. Nosso exemplo requer a captura de dois eventos. Um deles é a rolagem. Após esse evento, o aplicativo precisa redesenhar o mapa na nova localidade. O outro evento é um clique no mapa, para que possamos definir o trajeto em que o cálculo de distância será feito. A API do Google permite diversas maneiras de capturar eventos. Vamos fazer isso da seguinte maneira: GEvent.addListenerU (map, 'click', functionu (overlay, point) { map.recenterorpantolatlngu (point); }); Quando usamos o método addlistener() na classe GEvent, devemos indicar o evento que queremos capturar e a função que irá manipulá-lo. Nesse caso, estamos capturando o clique do mouse no mapa (evento click). A função específica para esse evento pode receber dois parâmetros: o overlay março 2006 edição 18 57
![Se considerarmos que a Terra tem, na média (o planeta não é uma esfera perfeita), um raio de 6378 km, podemos usar geometria esférica para calcular distâncias baseadas em latitudes e longitudes [5].](/docs-images/41/4857586/images/page_4.jpg "Primeiro precisamos converter latitudes e longitudes de graus para radianos. Então, aplicamos a fórmula: d = 6378.")
5 Tutorial API do Google Maps Listagem 2: distancia.html 1. <!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Strict//U EN > 2. <html xmlns= xmlns:u v= urn:schemas-microsoft-com:vml > 3. <head> 4. <title>calculando dist ncias</title> 5. <style type= text/css > 6. v\:* { 7. behavior:url(#default#vml); 8. } 9. </style> 10. <script src= =1&key=XXXXX type= text/javascript ></script> 11. <script type= text/javascript > 12. //<![CDATA[ // Pontos do trajeto (GMaker) 15. var points = new Array; 16. // Ultima linha desenhada 17. var polyline; function onload() { 20. if (GBrowserIsCompatible()) { 21. var map = new GMap(document.U getelementbyid( map ), [G_SATELLITE_TYPE]); 22. map.addcontrol(new GSmallMapControl()); 23. map.addcontrol(new GScaleControl()); GEvent.addListener(map, moveend, function() { 26. var center = map.getcenterlatlng(); 27. var latlngstr = ( + center.y +, + U center.x + ) ; 28. document.getelementbyid( latlong ).innerhtml U = latlngstr; 29. }); GEvent.addListener(map, click, U function(overlay, point) { 32. if (overlay) { 33. removeoverlay(map, points, overlay); 34. } else if (point) { 35. addoverlay(map, points, new U GMarker(point)); 36. } polyline = drawline(map, points, polyline); var distance = calcdistancia(points); 41. document.getelementbyid( distance ).innerhtml U = distance + Km ; 42. }); map.centerandzoom(new GPoint( , U ), 4); 45. } function drawline(map, points, lastline) { 48. var p = new Array(); 49. for (var i = 0; i < points.length; i++) { 50. p.push(new GPoint(points[i].point.x, U points[i].point.y)); 51. } 52. var newline = new GPolyline(p); if (lastline) { 55. map.removeoverlay(lastline); 56. } 57. map.addoverlay(newline); return newline; 60. } function addoverlay(map, points, overlay) { 63. map.addoverlay(overlay); 64. points.push(overlay); 65. } function removeoverlay(map, points, overlay) { 68. map.removeoverlay(overlay); 69. var oi = -1; 70. for (var i = 0; i < points.length; i++) { 71. if (points[i] == overlay) { 72. oi = i; 73. break; 74. } 75. } 76. points.splice(oi, 1); 77. } function calcdistancia(points) { 80. var distance = 0.0; 81. var p1 = points[0]; 82. for (var i = 1; i < points.length; i++) { 83. var p2 = points[i]; 84. var lat1 = p1.point.y * Math.PI / 180.0; 85. var lon1 = p1.point.x * Math.PI / 180.0; 86. var lat2 = p2.point.y * Math.PI / 180.0; 87. var lon2 = p2.point.x * Math.PI / 180.0; 88. distance += * Math.acos(Math.sin(lat1) U * Math.sin(lat2) + Math.cos(lat1) * Math.cos(lat2) * U Math.cos(lon2 - lon1)); 89. p1 = p2; 90. } return distance; 93. } 94. } //]]> 97. </script> <body onload= onload() > 100. <div id= map style= width: 500px; height: U 500px ></div> 101. <div id= latlong ></div> 102. <div id= distance ></div> 103. </body> 104. </html> 58 março 2006 edição 18
6 API do Google Maps Tutorial (ou marca onde clicamos) e o ponto contendo as coordenadas do clique. Na linha 25, capturamos o evento movend, que será produzido cada vez que terminarmos uma rolagem do mapa. Um importante evento é capturado na linha 35 da listagem 2, quando acrescentamos nosso próprio gerenciador de cliques. Assim permitimos que o visitante coloque diversas marcas, que serão armazenadas em uma matriz. Se clicarmos de novo nessas marcas, podemos removê-las tanto do mapa quanto da matriz. Nesse caso simples, vamos definir um trajeto que podemos traçar com uma linha azul. Nosso cálculo de distância será baseado nesse trajeto. Tanto marcas quanto linhas são chamadas de overlays na documentação oficial do Google Maps. Cada overlay é um objeto sobreposto ao mapa. Embora possamos definir ícones personalizados nas marcas (vide a documentação), podemos também usar diretamente o conjunto padrão fornecido. Uma marca pode ser criada e posicionada no mapa da seguinte maneira: var m = new Gmarker (new GPoint(lon1, U lat1)); map.addoverlay(m); Devemos criar uma marca em coordenadas específicas. Depois, vamos acrescentá-la ao mapa usando o método addoverlay() da classe GMap. Esse é o mesmo método que usaremos para desenhar o trajeto, mas em vez de acrescentar um objeto do tipo GMarker, usaremos um GPolyline. var p = new Array; p.push(new GPoint(lon1, lat1)); p.push(new GPoint(lon2, lat2));... map.addoverlay(new GPolyline(p)); Isso é apenas o que as funções addoverlay() e drawline() fazem em nosso código. Um exemplo de um trajeto desenhado é o caminho mostrado na figura 5. Uma vez que o caminho (ou parte dele) é terminado, podemos calcular a distância usando a fórmula já citada. Conclusão Usando não mais que quatro objetos e oito métodos diferentes, criamos um aplicativo capaz de calcular o comprimento de um caminho desenhado interativamente em um mapa aberto em um navegador. A API do Google Maps torna fácil a criação de aplicativos inovadores e interessantes que, de outra maneira, exigiriam profundas noções de programação, além de conhecimento elevado de matemática e navegação global. A API fornece outro grupo de objetos para acesso assíncrono a dados XML por JavaScript, tecnologia mais conhecida como Ajax [6]. Esse conjunto de objetos permite o armazenamento de uma grande quantidade de dados em um banco de dados, para que eles possam ser pintados instantâneamente na medida em que o usuário vai navegando pelo mapa. Muitos usuários dessa API estão desenvolvendo aplicativos interessantes veja os curiosos exemplos [8], [9] e [10]. Também há objetos para a geração de sinais, que são mostrados após cliques (ou outros eventos pré-definidos) em locais determinados. Esse sinais são úteis para a associação de comentários em mapas, como notas sobre algum monumento ou explicações sobre cruzamentos confusos. Vale lembrar que a API do Google Maps ainda está em estágio beta de desenvolvimento ou seja, seu funcionamento está sujeito a mudanças repentinas. É possível monitorar a Figura 5: Um caminho de 0,77 km desenhado no mapa. Podemos adicionar e remover as marcas de balões vermelhos da maneira que quisermos para desenhar outros caminhos. evolução dessas mudanças, os novos recursos e a troca de experiências entre seus usuários no grupo de discussão do Google Maps [7]. Caso desenvolva algum aplicativo baseado nessa API, não se esqueça de anunciá-lo ao grupo para que todos possamos tê-lo como possível fonte de inspiração. Informações [1] ECMA-262: publications/standards/ecma-262.htm [2] Termos de uso: [3] API do Google Maps: [4] Documentação da API: apis/maps/documentation/ [5] Latitudes e longitudes: Distance-Calculation.asp [6] Ajax: en.wikipedia.org/wiki/ajax [7] Grupo de discussão do Google Maps: groupsbeta.google.com/group/google-maps-api [8] Monumentos em Paris: gmaps.php?map=paris [9] WikiMap: [10] Tráfego na Inglaterra: março 2006 edição 18 59
Fluxo de trabalho do Capture Pro Software: Indexação de código de barras e separação de documentos
Este procedimento corresponde ao fluxo de trabalho de Indexação de código de barras e de separação de documentos no programa de treinamento do Capture Pro Software. As etapas do procedimento encontram-se
ALUNES MANUAL DO USUÁRIO. Guia rápido Alunes
ALUNES MANUAL DO USUÁRIO Guia rápido Alunes 1 Manual de Instruções Versão 2.0 Alunes Informática 2 Sumário Introdução... 5 Pré-requisitos... 5 Principal/Home... 6 Como editar texto do home... 7 Desvendando
Fluxo de trabalho do Capture Pro Software: Indexação de OCR e separação de documentos de código de correção
Este procedimento corresponde ao fluxo de trabalho de Indexação de OCR com separação de código de correção no programa de treinamento do Capture Pro Software. As etapas do procedimento encontram-se na
JavaScript. JavaScript é uma linguagem de script usada em navegadores web. É uma linguagem dinâmica, estruturada e orientada em objetos.
JavaScript JavaScript é uma linguagem de script usada em navegadores web. É uma linguagem dinâmica, estruturada e orientada em objetos. Pode ser usada dentro do próprio arquivo HTML ou estruturada em um
Bem- Vindo ao manual de instruções do ECO Editor de COnteúdo.
Manual de Instruções ECO Editor de Conteúdo Bem- Vindo ao manual de instruções do ECO Editor de COnteúdo. O ECO é um sistema amigável e intui?vo, mas abaixo você pode?rar eventuais dúvidas e aproveitar
Manual do Publicador. Wordpress FATEA Sistema de Gerenciamento de Conteúdo Web
Manual do Publicador Wordpress FATEA Sistema de Gerenciamento de Conteúdo Web Sumário Painel de Administração... 3 1 - Inserção de post... 5 2 Publicação de post com notícia na área headline (galeria de
Tutorial WEB CONTENT MANAGEMENT [WCM] Obtenha benefícios a partir das aplicações customizadas da ADMT.
![Tutorial WEB CONTENT MANAGEMENT [WCM] Obtenha benefícios a partir das aplicações customizadas da ADMT.](/thumbs/22/1603074.jpg "Tutorial WEB CONTENT MANAGEMENT [WCM] Obtenha benefícios a partir das aplicações customizadas da ADMT.")
Tutorial WEB CONTENT MANAGEMENT [WCM] Obtenha benefícios a partir das aplicações customizadas da ADMT. PÁGINA: 2 de 21 Nenhuma parte deste documento pode ser utilizado ou reproduzido, em qualquer meio
Banco de Dados Microsoft Access: Criar tabelas
Banco de Dados Microsoft Access: Criar s Vitor Valerio de Souza Campos Objetivos do curso 1. Criar uma no modo de exibição Folha de Dados. 2. Definir tipos de dados para os campos na. 3. Criar uma no modo
Banco de Dados Microsoft Access: Criar tabelas. Vitor Valerio de Souza Campos
Banco de Dados Microsoft Access: Criar tabelas Vitor Valerio de Souza Campos Objetivos do curso 1. Criar uma tabela no modo de exibição Folha de Dados. 2. Definir tipos de dados para os campos na tabela.
1. Introdução pág.3 2. Apresentação do sistema Joomla! pág.4 3. Acessando a administração do site pág.4 4. Artigos 4.1. Criando um Artigo 4.2.
1. Introdução pág.3 2. Apresentação do sistema Joomla! pág.4 3. Acessando a administração do site pág.4 4. Artigos 4.1. Criando um Artigo 4.2. Editando um Artigo 4.3. Excluindo um Artigo 4.4. Publicar
CONSTRUÇÃO DE BLOG COM O BLOGGER
CONSTRUÇÃO DE BLOG COM O BLOGGER Blog é uma abreviação de weblog, qualquer registro frequênte de informações pode ser considerado um blog (últimas notícias de um jornal online por exemplo). A maioria das
Sistema de Registro das Atividades do RT - Tutorial de utilização
Sistema de Registro das Atividades do RT - Tutorial de utilização Acesso WEB 1. Primeiro acesso Para acessar o sistema, abra seu navegador de internet e vá até o site http://sistemart.crmv pr.org.br. Você
Esse manual é um conjunto de perguntas e respostas para usuários(as) do Joomla! 1.5.
Esse manual é um conjunto de perguntas e respostas para usuários(as) do Joomla! 1.5. Ele considera que você já tem o Joomla! instalado no seu computador. Caso você queira utilizá lo em um servidor na web,
Criando um script simples
Criando um script simples As ferramentas de script Diferente de muitas linguagens de programação, você não precisará de quaisquer softwares especiais para criar scripts de JavaScript. A primeira coisa
Barra de ferramentas padrão. Barra de formatação. Barra de desenho Painel de Tarefas
Microsoft Power Point 2003 No Microsoft PowerPoint 2003, você cria sua apresentação usando apenas um arquivo, ele contém tudo o que você precisa uma estrutura para sua apresentação, os slides, o material
Tutorial Gerar arquivo PDF. Gerando um documento pdf com várias imagens 1- Inserir imagem no Word
Tutorial Gerar arquivo PDF. Com o objetivo de simplificar e diminuir o tamanho de arquivos anexos nos projetos, elaboramos um pequeno tutorial mostrando como gerar um único arquivo no formato pdf contendo
HTML / JAVASCRIPT. A versão atual é o HTML5 (seus predecessores imediatos são HTML 4.01, XHTML 1.1, etc.).
HTML / JAVASCRIPT Estamos iniciando o estudo do HTML através das TAGS (comandos) para construir formulários. Isso facilitará a continuidade dos nossos estudos da linguagem de programação JavaScript, a
Como Gerar documento em PDF com várias Imagens
Como Gerar documento em PDF com várias Imagens Para Gerar documento em PDF com várias Imagens, temos que seguir dois passos: 1. Inserir Imagens no Word 2. Gerar PDF a partir de documento do Word 1- Inserir
mkdir /srv/www/default/html/calculadora/imagens mkdir /srv/www/default/html/calculadora/blocos
Programando em PHP www.guilhermepontes.eti.br lgapontes@gmail.com Criando uma Calculadora Primeiramente deve se criar uma estrutura para armazenar os arquivos necessários para o funcionamento da calculadora.
Índice: CMS 3 O que é Content Management System? Clientes 4 O que é o Cliente? 4 Configurando o i-menu/i-view para trabalhar. com o CMS.
Índice: CMS 3 O que é Content Management System? Clientes 4 O que é o Cliente? 4 Configurando o i-menu/i-view para trabalhar com o CMS. 5 Removendo o Cliente. Playlist 7 Criando um Playlist. 8 Adicionando
Programando em PHP. Conceitos Básicos
Programando em PHP www.guilhermepontes.eti.br lgapontes@gmail.com Conceitos Básicos Todo o escopo deste estudo estará voltado para a criação de sites com o uso dos diversos recursos de programação web
Sistema Click Principais Comandos
Sistema Click Principais Comandos Sumário Sumário... 1 1. Principais Funções:... 2 2. Inserção de Registro (F6):... 3 3. Pesquisar Registro (F7):... 4 3.1 Pesquisa por letras:... 5 3.2 Pesquisa por números:...
02 - Usando o SiteMaster - Informações importantes
01 - Apresentação do SiteMaster - News Edition O SiteMaster foi desenvolvido para ser um sistema simples de gerenciamento de notícias, instalado em seu próprio computador e com configuração simplificada,
Portal do Projeto Tempo de Ser
Sumário Portal do Projeto Tempo de Ser O que é um Wiki?...2 Documentos...2 Localizando documentos...3 Links...3 Criando um Documento...4 Criando um link...4 Editando um Documento...5 Sintaxe Básica...5
Construtor de sites SoftPixel GUIA RÁPIDO - 1 -
GUIA RÁPIDO - 1 - Sumário Introdução...3 Por que utilizar o Construtor de Sites?...3 Vantagens do Construtor de Sites...3 Conceitos básicos...3 Configuração básica do site...5 Definindo o layout/template
DocuWare Mobile ProductInfo. Gerenciamento móvel de documentos. Benefícios
DocuWare Mobile ProductInfo Gerenciamento móvel de documentos O DocuWare Mobile permite acessar os gabinetes de arquivo do DocuWare diretamente em seu smartphone ou tablet. Você pode carregar, visualizar
Smart Laudos 1.9. A Forma Inteligente de Criar seus Laudos Médicos. Manual do Usuário
Smart Laudos 1.9 A Forma Inteligente de Criar seus Laudos Médicos Manual do Usuário Conteúdo 1. O que é o Smart Laudos?... 3 2. Características... 3 3. Instalação... 3 4. Menu do Sistema... 4 5. Configurando
CURSO DE INFORMÁTICA BÁSICA AULA 4 INTERNET
CURSO DE INFORMÁTICA BÁSICA AULA 4 INTERNET O que é a Internet? É a ligação em escala mundial de milhões de computadores para a troca de informações. As informações, na Internet, trafegam quase que instantaneamente.
Guia de Início Rápido
Guia de Início Rápido O Microsoft Word 2013 parece diferente das versões anteriores, por isso criamos este guia para ajudar você a minimizar a curva de aprendizado. Barra de Ferramentas de Acesso Rápido
Material de apoio a aulas de Desenvolvimento Web. Tutorial Java WEB JSP & HTML & CSS & CLASSE & OBJETOS. AAS - www.aas.pro.
Material de apoio a aulas de Desenvolvimento Web Tutorial Java WEB JSP & HTML & CSS & CLASSE & OBJETOS AAS - www.aas.pro.net Março-2012 Este pequeno tutorial tem como objetivo conduzir o programador passo-a-passo
Manual do Google agenda. criação e compartilhamento de agendas
Manual do Google agenda criação e compartilhamento de agendas 1 O que é o Google Agenda? Google Agenda é um serviço de agenda on line gratuito do Google, onde você pode anotar compromissos e tarefas, organizando
Tutorial Plone 4. Manutenção de Sites. Universidade Federal de São Carlos Departamento de Sistemas Web Todos os direitos reservados
Tutorial Plone 4 Manutenção de Sites Universidade Federal de São Carlos Departamento de Sistemas Web Todos os direitos reservados Sumário Introdução 1 Como fazer a autenticação do usuário 1.1 Através do
DOCUMENTAÇÃO DO FRAMEWORK - versão 2.0
DOCUMENTAÇÃO DO FRAMEWORK - versão 2.0 Índice 1 - Objetivo 2 - Descrição do ambiente 2.1. Tecnologias utilizadas 2.2. Estrutura de pastas 2.3. Bibliotecas já incluídas 3 - Características gerais 4 - Criando
Manual do Plone (novo portal do IFCE)
Manual do Plone (novo portal do IFCE) Dezembro/2015 Índice Como criar submenus... 3 Como criar banner rotativo... 4 Como remover um banner... 5 Como criar uma notícia... 6 Como inserir imagem na notícia...
A barra de menu a direita possibilita efetuar login/logout do sistema e também voltar para a página principal.
MANUAL DO SISCOOP Sumário 1 Menu de Navegação... 3 2 Gerenciar País... 5 3- Gerenciamento de Registro... 8 3.1 Adicionar um registro... 8 3.2 Editar um registro... 10 3.3 Excluir um registro... 11 3.4
Aula 5 Microsoft PowerPoint 2003: Criando uma Apresentação
Universidade de São Paulo/Faculdade de Saúde Pública Curso de Saúde Pública Disciplina: HEP 147 - Informática Aula 5 Microsoft PowerPoint 2003: Criando uma Apresentação 1 Introdução ao Microsoft PowerPoint
WEBDESIGN. Professor: Paulo Trentin paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira
WEBDESIGN Professor: Paulo Trentin paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira 1 CDI - Curso de Webdesign - Prof. Paulo Trentin Objetivos para esta aula Debater sobre
ÍNDICE... 2 INTRODUÇÃO... 4
Mic crosoft Excel 201 0 ÍNDICE ÍNDICE... 2 INTRODUÇÃO... 4 Interface... 4 Guias de Planilha... 5 Movimentação na planilha... 6 Entrada de textos e números... 7 Congelando painéis... 8 Comentários nas Células...
Criar fotos em 3D no Creator
Criar fotos em 3D no Creator O aplicativo Criar fotos em 3D da Roxio torna simples produzir fotos em 3D a partir de várias origens, incluindo arquivos 3D MPO de Fujifilm FinePix REAL 3D W1, fotos digitais
AULA 1 Iniciando o uso do TerraView
1.1 AULA 1 Iniciando o uso do TerraView Essa aula apresenta a interface principal do TerraView e sua utilização básica. Todos os arquivos de dados mencionados nesse documento são disponibilizados junto
Facebook Instruções de integração com PayPal
Facebook Instruções de integração com PayPal Há diversas formas de utilizar o PayPal para receber pagamentos na plataforma do Facebook. Primeiro você precisa decidir suas necessidades para a opção mais
Tutorial para criação de blog
Tutorial para criação de blog Profª Msc. Patricia da Silva Neubert Acesse www.blogspot.com.br. Na barra superior clique em Criar em Criar blog, preencha o cadastro e faça login. Repare, que abrirá uma
Professor: Paulo Macos Trentin paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira 4/6/2011 1
Professor: Paulo Macos Trentin paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira 4/6/2011 1 Do inglês, Cascading Style Sheet, ou folha de estilo em cascata. É uma linguagem
Manual do Blogilo. Mehrdad Momeny Tradução: Marcus Gama
Mehrdad Momeny Tradução: Marcus Gama 2 Conteúdo 1 Introdução 5 2 Usando o Blogilo 6 2.1 Iniciando........................................... 6 2.2 Configurar um blog....................................
Aula Au 3 la 7 Windows-Internet
Aula 37 Aula Ferramenta de Captura 2 Você pode usar a Ferramenta de Captura para obter um recorte de qualquer objeto na tela e, em seguida, anotar, salvar ou compartilhar a imagem. 3 Vamos fazer o seguinte:
Lidar com números e estatísticas não é fácil. Reunir esses números numa apresentação pode ser ainda mais complicado.
, ()! $ Lidar com números e estatísticas não é fácil. Reunir esses números numa apresentação pode ser ainda mais complicado. Uma estratégia muito utilizada para organizar visualmente informações numéricas
TUTORIAL PARA ATUALIZAÇÃO DO PORTAL DO TJRN
Poder Judiciário do Estado do Rio Grande do Norte TUTORIAL PARA ATUALIZAÇÃO DO PORTAL DO TJRN Agosto/2012 Versão 1.0 1. ACESSANDO O PORTAL Acesse o site do TJ no endereço www.tjrn.jus.br Observação: utilize
Configurando um Grupo Doméstico e Compartilhando arquivos no Windows 7
Configurando um Grupo Doméstico e Compartilhando arquivos no Windows 7 Para criar um grupo doméstico e compartilhar arquivos é necessário que tenhamos pelo menos dois computadores ligados entre si (em
ALBUM DE FOTOGRAFIAS NO POWER POINT
ALBUM DE FOTOGRAFIAS NO POWER POINT O PowerPoint é uma poderosa ferramenta que faz parte do pacote Office da Microsoft. O principal uso desse programa é a criação de apresentação de slides, para mostrar
SISTEMA DE GERENCIAMENTO DE PROJETOS - REDMINE MANUAL DE USO
SISTEMA DE GERENCIAMENTO DE PROJETOS - REDMINE MANUAL DE USO AGOSTO DE 2013 SUMÁRIO STI/UFF - Sistema de Gerenciamento de Projetos do PDI SUMÁRIO... 2 1 Introdução... 3 1.1 O que é e qual a finalidade
Banner Flutuante. Dreamweaver
Banner Flutuante Dreamweaver Começamos com um arquivo em branco no Dreamweaver MX. Para que o banner apareça sobre a página, precisamos inserir uma camada a mais no arquivo HTML. Selecione o menu Inserir
Manual da Turma Virtual: MATERIAIS. Para acessar a turma virtual com o perfil Docente, siga o caminho indicado abaixo:
Manual da Turma Virtual: MATERIAIS Para acessar a turma virtual com o perfil Docente, siga o caminho indicado abaixo: MENU TURMA VIRTUAL MENU MATERIAIS CONTEÚDO/PÁGINA WEB Esta operação possibilita que
O código JavaScript deve ser colocado entre tags de comentário para ficar escondido no caso de navegadores antigos que não reconhecem a linguagem.
1 - O que é JAVASCRIPT? É uma linguagem de script orientada a objetos, usada para aumentar a interatividade de páginas Web. O JavaScript foi introduzido pela Netscape em seu navegador 2.0 e posteriormente
Manual do Painel Administrativo
Manual do Painel Administrativo versão 1.0 Autores César A Miggiolaro Marcos J Lazarin Índice Índice... 2 Figuras... 3 Inicio... 5 Funcionalidades... 7 Analytics... 9 Cidades... 9 Conteúdo... 10 Referência...
Este tutorial está publicado originalmente em http://www.baboo.com.br/absolutenm/anmviewer.asp?a=30405&z=300
WinRAR: Conheça este excelente compactador de arquivos Introdução: É fato que a Internet está mais rápida com a popularização da banda larga, mas os compactadores de arquivos ainda apresentam muita utilidade
Como criar um formulário de pesquisa usando o Google Drive
25/09/2013 07h25 - Atualizado em 25/09/2013 07h43 Como criar um formulário de pesquisa usando o Google Drive por EDIVALDO BRITO Para o TechTudo 1 comentário Se você precisa fazer alguma pesquisa de um
Instalando o Internet Information Services no Windows XP
Internet Information Services - IIS Se você migrou recentemente do Windows 95 ou 98 para o novo sitema operacional da Microsoft Windows XP, e utilizava antes o Personal Web Server, deve ter notado que
Omega Tecnologia Manual Omega Hosting
Omega Tecnologia Manual Omega Hosting 1 2 Índice Sobre o Omega Hosting... 3 1 Primeiro Acesso... 4 2 Tela Inicial...5 2.1 Área de menu... 5 2.2 Área de navegação... 7 3 Itens do painel de Controle... 8
Questão - 01. Essência do Excel 2003...
Valdir Questão - 01 Como deve proceder o usuário do Microsoft para que sejam atualizados os cálculos das funções ou fórmulas utilizadas nas planilhas? a) Pressionar a tecla F9 no teclado b) Pressionar
Apostila de Windows Movie Maker
Apostila de Windows Movie Maker Autor: João Paulo da Silva Apostila de Windows Movie Maker Autor: João Paulo da Silva 2 Índice Introdução ao Windows Movie Maker...03 O que é o Windows Movie Maker?...03
AULA 2 Planos, Vistas e Temas
2.1 AULA 2 Planos, Vistas e Temas Essa aula apresenta os conceitos de Plano de Informação, Vista e Tema e suas manipulações no TerraView. Para isso será usado o banco de dados criado na AULA 1. Abra o
Desenvolvendo Websites com PHP
Desenvolvendo Websites com PHP Aprenda a criar Websites dinâmicos e interativos com PHP e bancos de dados Juliano Niederauer 19 Capítulo 1 O que é o PHP? O PHP é uma das linguagens mais utilizadas na Web.
SUMÁRIO 1. AULA 6 ENDEREÇAMENTO IP:... 2
SUMÁRIO 1. AULA 6 ENDEREÇAMENTO IP:... 2 1.1 Introdução... 2 1.2 Estrutura do IP... 3 1.3 Tipos de IP... 3 1.4 Classes de IP... 4 1.5 Máscara de Sub-Rede... 6 1.6 Atribuindo um IP ao computador... 7 2
Follow-Up Acompanhamento Eletrônico de Processos (versão 3.0) Manual do Sistema. 1. Como acessar o sistema Requisitos mínimos e compatibilidade
do Sistema Índice Página 1. Como acessar o sistema 1.1 Requisitos mínimos e compatibilidade 03 2. Como configurar o Sistema 2.1 Painel de Controle 2.2 Informando o nome da Comissária 2.3 Escolhendo a Cor
Como incluir artigos:
Como incluir artigos: O WordPress é uma ferramenta muito flexível, com muitas variações e ajustes que podem torná-lo algo muito simples e também muito sofisticado conforme os recursos que são configurados
Sumário. 1 Tutorial: Blogs no Clickideia
1 Tutorial: Blogs no Clickideia Sumário Introdução... 2 Objetivos... 2 Instruções para utilização do Tutorial... 2 Acesso ao Portal e a Home Blog... 3 Página Inicial da área do Blog... 4 Apresentação da
Portal da Prefeitura de São Paulo SECOM. MANUAL DO WARAM v. 1.5 Secretarias
SECOM MANUAL DO WARAM v. 1.5 Secretarias WARAM 1.5 Ferramenta de atualização do Portal da Prefeitura de São Paulo. Use preferencialmente o navegador Internet Explorer superior ou igual a 7.0. No campo
Manual de Utilização das Funções Básicas do Sistema ClinicWeb
Manual de Utilização das Funções Básicas do Sistema ClinicWeb Dezembro/2012 2 Manual de Utilização das Funções Básicas do Sistema ClinicWeb Sumário de Informações do Documento Título do Documento: Resumo:
Manual de configuração do sistema
Manual de configuração do sistema (v.1.5.x Beta) Rua México, 119 Sala 2004 Centro Rio de Janeiro, RJ www.doctors-solution.com.br www.simdoctor.com.br contato@simdoctor.com.br Sumário 1. Fazendo seu primeiro
Curso de atualização Educação Integral e Integrada. Tutorial Moodle. Belo Horizonte, 2013.
Curso de atualização Educação Integral e Integrada Tutorial Moodle Belo Horizonte, 2013. 1. INTRODUÇÃO... 3 2. ACESSANDO O AMBIENTE... 4 3. CONHECENDO O AMBIENTE... 5 3.1. CAIXAS DE UTILIDADES... 5 4.
3. No painel da direita, dê um clique com o botão direito do mouse em qualquer espaço livre (área em branco).
Permissões de compartilhamento e NTFS - Parte 2 Criando e compartilhando uma pasta - Prática Autor: Júlio Battisti - Site: www.juliobattisti.com.br Neste tópico vamos criar e compartilhar uma pasta chamada
PROGRAMAÇÃO PARA INTERNET. Fonte: Raul Paradeda
PROGRAMAÇÃO PARA INTERNET Introdução à AJAX Fonte: Raul Paradeda INTRODUÇÃO Para entender o que é o AJAX é necessário ter o prévio conhecimento de: HTML / XHTML; Javascript; CSS; XML. INTRODUÇÃO Ao pesquisar
Apostila de criação de website
Apostila de criação de website "Webnode" OBS: Informações e imagens retiradas do webnode O que é o WebNode : O WebNode é um sistema de criação de sites de fácil utilização. # Grátis. Sem burocracias, #
Manual das funcionalidades Webmail AASP
Manual das funcionalidades Webmail AASP 1. Configurações iniciais 2. Regras 3. Histórico da conta 4. Autorresposta 5. Dados de acesso (alterando senha de acesso) 6. Identidade (assinatura) 7. Redirecionamento
NÚCLEO DE TECNOLOGIA E EDUCAÇÃO CURSO: WINDOWS MOVIE MAKER TUTORIAL
NÚCLEO DE TECNOLOGIA E EDUCAÇÃO CURSO: WINDOWS MOVIE MAKER TUTORIAL O que é o Windows Movie Maker? É um programa que permite criar nossos próprios filmes com som, músicas, transição e efeito de vídeo.
WEBDESIGN. Professor: Paulo Marcos Trentin - paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira
WEBDESIGN Professor: Paulo Marcos Trentin - paulo@paulotrentin.com.br http://www.paulotrentin.com.br Escola CDI de Videira Formulários e JavaScript Como visto anteriormente, JavaScript pode ser usada para
Banco de Dados BrOffice Base
Banco de Dados BrOffice Base Autor: Alessandro da Silva Almeida Disponível em: www.apostilando.com 27/02/2011 CURSO TÉCNICO EM SERVIÇO PÚBLICO Apostila de Informática Aplicada - Unidade VI Índice Apresentação...
Ave: Manual do usuário
As iniciais no canto superior esquerdo indicam a atual lista de espécies em uso. Clique neste campo para abrir uma grade com todas Ave: Manual do usuário Introdução A Janela Inicial O botão Listas Sobre
Introdução aos critérios de consulta. Um critério é semelhante a uma fórmula é uma cadeia de caracteres que pode consistir em
Material retirado do site Office online. Introdução aos critérios de consulta Um critério é semelhante a uma fórmula é uma cadeia de caracteres que pode consistir em referências de campo, operadores e
AULA 1 Iniciando o Uso do TerraView
1.1 AULA 1 Iniciando o Uso do TerraView Essa aula apresenta o software TerraView apresentando sua interface e sua utilização básica. Todos os arquivos de dados mencionados neste documento bem como o executável
www.marketingdigitalexpress.com.br - Versão 1.0 Página 1
www.marketingdigitalexpress.com.br - Versão 1.0 Página 1 Remarketing é um recurso utilizado para direcionar anúncios personalizados para as pessoas que visitaram uma determinada página do seu site ou clicaram
USANDO O ROUNDCUBE WEBMAIL
USANDO O ROUNDCUBE WEBMAIL ATENÇÃO! Para utilizar este tutorial não se esqueça: Onde estiver escrito seusite.com.br substitua pelo ENDEREÇO do seu site (domínio). Ex.: Se o endereço do seu site é casadecarnessilva.net
Tema UFPel 2.0 WP Institucional Guia de Opções de Personalização
Tema UFPel 2.0 WP Institucional Guia de Opções de Personalização Sumário 1. Configurações Iniciais...2 1.1. Configurando o Menu Personalizado...2 1.2. Configurando os Widgets...3 2. Localize o nome de
Programação Orientada a Objetos com PHP & MySQL Cookies e Sessões. Prof. MSc. Hugo Souza
Programação Orientada a Objetos com PHP & MySQL Cookies e Sessões Prof. MSc. Hugo Souza Se você precisar manter informações sobre seus usuários enquanto eles navegam pelo seu site, ou até quando eles saem
jquery André Tavares da Silva andre.silva@udesc.br
jquery André Tavares da Silva andre.silva@udesc.br jquery jquery é uma biblioteca em JavaScript; Seu objetivo é simplificar a programação em JavaScript; jquery foi desenvolvida para ser de aprendizado
O SIPIRAHIBA se encontra disponível atualmente através do endereço eletrônico http://niema.ufam.edu.br
Manual do Usuário - SIPIRAHIBA Acessando o SIPIRAHIBA O SIPIRAHIBA se encontra disponível atualmente através do endereço eletrônico http://niema.ufam.edu.br Visando o melhor aproveitamento da tecnologia
Como fazer busca de imagem no Google?
Como fazer busca de imagem no Google? Passo 1: Acesse o endereço do Google e depois clique na opção Imagens, que fica na barra superior da página Passo 2. Digite a palavra que procura. Observe que o Google
CRIANDO TEMPLATES E LEGENDAS
CRIANDO TEMPLATES E LEGENDAS Este tutorial tem como objetivo instruir passo à passo como criar templates de peças, utilizar os novos recursos de cadastro de propriedade de peças e criação de legenda. 1-
Como configurar e-mails nos celulares. Ebook. Como configurar e-mails no seu celular. W3alpha - Desenvolvimento e hospedagem na internet
Ebook Como configurar e-mails no seu celular Este e-book irá mostrar como configurar e-mails, no seu celular. Sistemas operacionais: Android, Apple, BlackBerry, Nokia e Windows Phone Há muitos modelos
Clique no botão novo
Tutorial para uso do programa Edilim Criado pela profª Carina Turk de Almeida Correa 1- Abra o programa Edilim. Clique no botão novo, como mostrado abaixo: Clique no botão novo 2- Todos os arquivos a serem
Slice Tool - Ferramenta Fatia
Faculdade de Tecnologia da Paraíba CURSO CURSO SUPERIOR DE TECNOLOGIA EM SISTEMAS PARA A INTERNET DISCIPLINA DESENVOLVIMENTO DE APLICAÇÕES WEB ESTÁTICAS PERÍODO: P2 Semestre: 2008.2 PROFESSOR Geraldo Rodrigues
Passa a passo para construir uma página pessoal - Parte 1
Passa a passo para construir uma página pessoal - Parte 1 Quais ferramentas são necessárias? - Editor de texto básico (sem formatações): use o Bloco de Notas (não use o MS Word e WordPad) - Navegador (browser):
1) Como acessar a aplicação
Guia de Uso V1.0.0 1) Como acessar a aplicação 2 1 2 3 3 4 Ao clicar em Banco de Necessidades, será aberta uma nova guia do navegador com o formulário mostrado abaixo, o qual possui dois botões : Consulta
COMO USAR O CADASTRO REMOTO?
COMO USAR O CADASTRO REMOTO? Este documento fornece um passo a passo explicativo e ilustrado das principais ferramentas de visualização das informações do Cadastro Remoto. APRESENTAÇÃO O cadastramento
Guia de usuário Auvo @
Guia de usuário Auvo @ Sobre a Auvo O Auvo é um serviço gratuito que comunica todas as pessoas de sua empresa em todas as plataformas (desktop, web e mobile) de maneira muito fácil. Além disso nós ajudamos
Microsoft Access: Criar relatórios para um novo banco de dados. Vitor Valerio de Souza Campos
Microsoft Access: Criar relatórios para um novo banco de dados Vitor Valerio de Souza Campos Conteúdo do curso Visão geral: O produto final Lição: Inclui oito seções Tarefas práticas sugeridas Teste Visão
1 UNIT Universidade do Trabalhador Dr. Abel dos Santos Nunes
1 UNIT Universidade do Trabalhador Dr. Abel dos Santos Nunes Janelas são estruturas do software que guardam todo o conteúdo exibido de um programa, cada vez que um aplicativo é solicitado à janela do sistema
INFORMES MANUAL DO APLICATIVO
INFORMES MANUAL DO APLICATIVO APRESENTAÇÃO Este aplicativo é um dos recursos mais importantes que o Portal disponibiliza, pois é a partir dele que são feitas a publicação de informativos nas seções que
ÍNDICE MANUAL SITE ADMINISTRÁVEL TV. 1. Introdução 2. Acessando o site administrável/webtv SITE ADMINISTRÁVEL 3. CONFIGURAÇÕES
MANUAL SITE ADMINISTRÁVEL TV ÍNDICE 1. Introdução 2. Acessando o site administrável/webtv SITE ADMINISTRÁVEL 3. CONFIGURAÇÕES 3.1 - Dados Cadastrais 3.2 - Noticias 3.3 Redes Sociais 3.4 - Player 4. DESIGN
Interfaces Gráficas parte 3
parte 3 (Listview, AlertDialog e ActionBar) Programação de Dispositivos Móveis Mauro Lopes Carvalho Silva Professor EBTT DAI Departamento de Informática Campus Monte Castelo Instituto Federal de Educação