Using Google Maps. AJAX Google Maps is an AJAX Application Asynchronous JavaScript and XML, is a web development technique for creating interactive web.

Slides:



Advertisements
Similar presentations
Web 2.0 Programming 1 © Tongji University, Computer Science and Technology. Web Web Programming Technology 2012.
Advertisements

Copyright © 2008 Pearson Education, Inc. Publishing as Pearson Addison-Wesley Chapter 16 Introduction to Ajax.
NIMAC 2.0: The Accessible Media Producer Portal NIMAC 2.0 for AMPs.
Overview Environment for Internet database connectivity
WebDT Content Manager 6.0 Pro
Fawaz Ghali AJAX: Web Programming's Toy.
Create a website with Google Sites
Connect Pictometry Online End User
In this lecture, you will learn: ❑ How to link between pages of your site ❑ How to link to other sites ❑ How to structure the folders on your web site.
The North American Carbon Program Google Earth Collection Peter C. Griffith, NACP Coordinator; Lisa E. Wilcox; Amy L. Morrell, NACP Web Group Organization:
AJAX Presented by: Dickson Fu Dimas Ariawan Niels Andreassen Ryan Dial Jordan Nielson CMPUT 410 University of Alberta 2006.
The GMap class exports methods to manipulate the map's center and zoom level and to add and remove overlays (such as GMarker and GPolyline instances).
Dynamic Web Pages Bert Wachsmuth. Review  Internet, IP addresses, ports, client-server, http, smtp  HTML, XHTML, XML  Style Sheets, external, internal,
AJAX /On-Demand JavaScript: A New Vision for Web-Based Chemistry Applications Robert M. Hanson St. Olaf College 19 th BCCE Purdue University West Lafayette,
Does Ajax suck? CS575 Spring 2007 Chanwit Suebsureekul.
Web Development & Design Foundations with XHTML Chapter 9 Key Concepts.
Christopher M. Pascucci Basic Structural Concepts of.NET Browser – Server Interaction.
Presented by…. Group 2 1. Programming language 2Introduction.
1 Web Developer & Design Foundations with XHTML Chapter 6 Key Concepts.
Writing All Your Code In OpenEdge Architect Peter van Dam.
M. Taimoor Khan * Java Server Pages (JSP) is a server-side programming technology that enables the creation of dynamic,
Introduction to AJAX AJAX Keywords: JavaScript and XML
Lecture 12 – AJAX SFDV3011 – Advanced Web Development Reference: 1.
Server-side Scripting Powering the webs favourite services.
ASP.NET + Ajax Jesper Tørresø ITNET2 F08. Ajax Ajax (Asynchronous JavaScript and XML) A group of interrelated web development techniques used for creating.
1. 1.Jose Leal, Director, Bailey-Matthews Shell Museum 2. 2.Ian Turton, Adviser, Pennsylvania State University, Department of Geography 3. 3.Jim Detweiler,
1 HTML (Set Up Public Folder) Some material on these slides is taken directly from
Google Maps API. Static Maps send an HTTP GET request receive an image (PNG, GIF, JPEG) no javascript needed encode params in URL example:
Writing various AJAX forms in Drupal 7 1. Overview of Form API 2. Ctools 2.1 Ctools features 3. Ajax 3.1 Ajax Forms in Drupal 4. Putting it all together.
Presenting Statistical Data Using XML Office for National Statistics, United Kingdom Rob Hawkins, Application Development.
 The World Wide Web is a collection of electronic documents linked together like a spider web.  These documents are stored on computers called servers.
Linking electronic documents and standardisation of URL’s What can libraries do to enhance dynamic linking and bring related information within a distance.
JavaScript – Quiz #9 Lecture Code:
Peter Laird. | 1 Building Dynamic Google Gadgets in Java Peter Laird Managing Architect WebLogic Portal BEA Systems.
PROCESSED RADAR DATA INTEGRATION WITH SOCIAL NETWORKING SITES FOR POLAR EDUCATION Jeffrey A. Wood April 19, 2010 A Thesis submitted to the Graduate Faculty.
Google APIs Why Aren’t You Using Them? Jeff Blankenburg Project Engineer Quick Solutions, Inc.
Introduction to Web AppBuilder for ArcGIS: JavaScript Apps Made Easy
Dynamic web content HTTP and HTML: Berners-Lee’s Basics.
Bloomington’s Online Resources for Public Communication Laura Haley GIS Manager Information & Technology Services (ITS) City of Bloomington.
TerraFly Project High Performance Database Research CenterHigh Performance Database Research Center NASA Regional Applications CenterNASA Regional Applications.
Rails & Ajax Module 5. Introduction to Rails Overview of Rails Rails is Ruby based “A development framework for Web-based applications” Rails uses the.
Web Technology Introduction AJAXAJAX. AJAX Outline  What is AJAX?  Benefits  Real world examples  How it works  Code review  Samples.
Types of Spatial Data Sites Data portals: Find and download data –Humboldt County, National Atlas “Atlases”: General information –GoogleMaps, MapQuest.
Chapter 16: Ajax-Enabled Rich Internet Applications with XML and JSON TP2543 Web Programming Mohammad Faidzul Nasrudin.
Web Design and Development. World Wide Web  World Wide Web (WWW or W3), collection of globally distributed text and multimedia documents and files 
INT222 - Internet Fundamentals Shi, Yue (Sunny) Office: T2095 SENECA COLLEGE.
AJAX Asynchronous JavaScript and XML 1. AJAX Outline What is AJAX? Benefits Real world examples How it works 2.
Implementation of Google Map in Drupal Create in Miyula Zeng, XiaoHang Zou,
Mashups in the JavaServer Faces World Ed Burns Hazem Saleh.
Event Handling & AJAX IT210 Web Systems. Question How do we enable users to dynamically interact with a website? Answer: Use mouse and keyboard to trigger.
Dave Salinas. What is XML? XML stands for eXtensible Markup Language Markup language, like HTML HTML was designed to display data, whereas XML was designed.
Java Programming: Advanced Topics 1 Building Web Applications Chapter 13.
Click to edit Master subtitle style Java Developer Conference 2010 Hazem Saleh Ed Burns Mashups in the JavaServer Faces World.
Web 2.0 IS530 Fall 2009 Dr. Dania Bilal. Web 2.0 Is the Web that is being transformed into a computing platform for delivering web applications to end.
Mashups in the JavaServer Faces World Ed Burns Hazem Saleh.
Google Map API The Google Maps API lets you embed Google Maps in your own web pages with JavaScript The API provides a number of utilities for manipulating.
© 2016 IBM Corporation EsriJS Connector. © 2016 IBM Corporation Overview This presentation is a review of the EsriJS Connector feature introduced in TRIRIGA.
CS491B Software Design Lab Project Report Yuet-Chi Lee California State University, Los Angeles.
Chapter 1 Getting Started with ASP.NET Objectives Why ASP? To get familiar with our IDE (Integrated Development Environment ), Visual Studio. Understand.
How to Write Web Forms By Mimi Opkins.
Tracking and Booking Taxi
AJAX.
Part 2 Setting up a web server the easy way
Google Maps: A Short How-to
Your 1st Programming Assignment
Part 2 Setting up a web server the easy way
Introduction to World Wide Web
DR. JOHN ABRAHAM PROFESSOR UTPA
Advanced Concepts and AJAX
Presentation transcript:

Using Google Maps

AJAX Google Maps is an AJAX Application Asynchronous JavaScript and XML, is a web development technique for creating interactive web applications. The intent is to make web pages feel more responsive by exchanging small amounts of data with the server behind the scenes, so that the entire web page does not have to be reloaded each time the user makes a change. This is meant to increase the web page's interactivity, speed, and usability.

First Steps – get a map key You will need to get a key to use Google Maps inside your site. It is best to register using a higher level domain (mysite.com/), instead of a sub folder of the domain. (mysite.com/subfolder/) This will reduce the number of keys that you will need to register for.

Page Elements Map Controls Markers Sidebar

Basics var map = newGMap2(document.getElementById("map")); map.setCenter(new GLatLng( , ), 13); My Google Maps Hack v\:* { behavior:url(#default#VML); } 1- Set up the page 2- Generate map **references html element with id == map

Controls GSmallMapControl()Creates a control with buttons to pan in four directions, and zoom in and zoom out. GLargeMapControl()Creates a control with buttons to pan in four directions, and zoom in and zoom out, and a zoom slider. GSmallZoomControl()Creates a control with buttons to zoom in and zoom out. GScaleControl()Creates a control that displays the map scale. GMapTypeControl()Creates a control with buttons to switch between map types. GOverviewMapControl()Creates a control which displays the current map selection area

Examples Map opens with markers that opens an info window when clicked Map opens with markers that open a tabbed info window when clicked Using an icon class to customize markers Utilizing draggable markersUtilizing polyline markers

Geocodes Geocoding is the process of assigning geographic identifiers (e.g., codes or geographic coordinates expressed as latitude-longitude) to map features and other data records, such as street addresses. You can also geocode media, for example where a picture was taken, IP Addresses, and anything that has a geographic component. With geographic coordinates, the features can then be mapped and entered into Geographic Information Systems. Google Maps uses geocodes (latitude and longitude) to find points on the map. A built-in geocoder can be accessed from within the JavaScript using the GClientGeocoder object. The getLatLng method can be used to convert an address into a GLatLng. Because geocoding involves sending a request to Google's servers, it can take some time. To avoid making your script wait, you need to pass in a function to call after the response comes back. This example uses the built-in geocoder to find a point on the map after submitting a complete address.

API Overview If you only want to use the map to display your content, then you need to know these classes, types, and functions: GMap2 GMapOptions GInfoWindow GInfoWindowTab GInfoWindowOptions GMarker GMarkerOptions GPolyline GIcon GPoint GSize GBounds GLatLng GLatLngBounds GControl GEvent GEventListener GXmlHttp GXml GXslt GLog GDraggableObject GGeoStatusCode GGeoAddressAccuracy GClientGeocoder GGeocodeCache GFactualGeocodeCache GDownloadUrl GBrowserIsCompatible If you want to extend the functionality of the maps API by implementing your own controls, overlays, or map types, then you also need to know these classes and types: GMapPane GOverlay GControl GControlPosition GControlAnchor GMapType GMapTypeOptions GTileLayer GTileLayerOverlay GCopyrightCollection GCopyright GProjection GMercatorProjection

PHP Class GoogleMapAPI 2.2 php class Author: Monte Ohrt Copyright New Digital Group This class allows you to dynamically generate your maps from a simple address and set options at runtime. Using this class will allow you to render maps from database entries and customize the display regarding user preferences or other factors. The link above contains all necessary resources and basic documentation for implementing the class.

Mashups Many new web applications today integrate Google Maps and other web service APIs.

Other Links google-maps.html 4. St,+Chapel+Hill+NC