Презентация Introduction to Google Maps онлайн
На нашем сайте вы можете скачать и просмотреть онлайн доклад-презентацию на тему Introduction to Google Maps абсолютно бесплатно. Урок-презентация на эту тему содержит всего 34 слайда. Все материалы созданы в программе PowerPoint и имеют формат ppt или же pptx. Материалы и темы для презентаций взяты из открытых источников и загружены их авторами, за качество и достоверность информации в них администрация сайта не отвечает, все права принадлежат их создателям. Если вы нашли то, что искали, отблагодарите авторов - поделитесь ссылкой в социальных сетях, а наш сайт добавьте в закладки.
Оцените презентацию от 1 до 5 баллов!
- Тип файла:ppt / pptx (powerpoint)
- Всего слайдов:34 слайда
- Для класса:1,2,3,4,5,6,7,8,9,10,11
- Размер файла:2.44 MB
- Просмотров:87
- Скачиваний:3
- Автор:неизвестен
Слайды и текст к этой презентации:
№1 слайд
Содержание слайда: Lecture 10
Introduction to Google Maps
Senior-Lecturer: Sarsenova Zh.N.
№2 слайд
Содержание слайда: Introduction
1. Step: Create an HTML page
2. Step: Add a map with marker
3. Step: Get an API key
https://developers.google.com/maps/documentation/javascript/examples/map-simple
№3 слайд
Содержание слайда: Google Maps API
An API is a set of methods and tools that can be used for building software applications.
№4 слайд
Содержание слайда: The Basic Skeleton of creating Google Map
№5 слайд
Содержание слайда: Latitude and Longitude
№6 слайд
Содержание слайда: The sample code need to create a map with marker
№7 слайд
Содержание слайда: Google Maps in HTML
№8 слайд
Содержание слайда: Creating a Basic Google Map
№9 слайд
Содержание слайда: The Map Container
The map needs an HTML element to hold the map:
<div id="map" style="width:100%;height:500px"></div>
The map will automatically "inherit" its size from its container element.
№10 слайд
Содержание слайда: The Google Maps API
The Google Maps API is a JavaScript library. It is added to the web page with a <script> tag:
<script src="https://maps.googleapis.com/maps/api/js?callback=myMap"></script
The callback parameter specifies the function to be called (=myMap) when the API is ready.
№11 слайд
Содержание слайда: The myMap Function
- myMap function initializes and display the map:
the Center- where to center the map
LatLng object to center the map on a specific point.
Pass the coordinates in the order: latitude, longitude.
Zoom-specifies the zoom level for the map.
Zoom:0 shows a map of the Earth fully zoomed out. Higher zoom levels zoom in at a higher resolution.
New google.maps.Map() creates a new Google Maps object.
№12 слайд
Содержание слайда: Different Map Types
№13 слайд
Содержание слайда: Google Maps overlays
Overlays are objects on the map that are bound to latitude/longitude coordinates.
Marker- Single locations on a map. Markers can also display custom icon images.
Polyline-Series of straight lines on a map.
Polygon-series of straight lines on a map, and the shape is “closed”
Circle and Rectangle
Info Window – Displays content within a popup balloon on top of a map.
Custom overlays
№14 слайд
Содержание слайда: Adding a Marker
The Marker constructor creates a marker. And The position property must be set for the marker to display.
№15 слайд
Содержание слайда: Animating the Marker (Example)
The example below shows how to animate the marker with the animation property:
№16 слайд
Содержание слайда: Icons instead of Marker
We can specify an image (icon) to use of the default marker
№17 слайд
Содержание слайда: Polyline
A polyline is a line that is drawn through a series of coordinates in an ordered sequence.
A polyline supports the following properties:
№18 слайд
Содержание слайда:
№19 слайд
Содержание слайда: Example
№20 слайд
Содержание слайда: Polygon
A Polygon is similar to a Polyline in that it consists of a series of coordinates in an ordered sequence. However, polygons are designed to define regions within a closed loop.
Polygons are made of straight lines, and the shape is “closed” (all the lines connect up).
№21 слайд
Содержание слайда:
№22 слайд
Содержание слайда: Polygon Example
№23 слайд
Содержание слайда:
№24 слайд
Содержание слайда: Google Maps – Circle Example
№25 слайд
Содержание слайда: Google Maps - InfoWindow
Show in InfoWindow with some text content for a marker
№26 слайд
Содержание слайда: Google Maps Events
№27 слайд
Содержание слайда: Click the Marker to Zoom
We register for event notifications using the addListener() event handler. That method takes an object, an event to listen for, and a function to call when the specified event occurs.
№28 слайд
Содержание слайда: Full Example
№29 слайд
Содержание слайда: Pan Back to Marker
Here, we save the zoom changes and pan the map back after 3 seconds:
№30 слайд
Содержание слайда: Open an InfoWindow When clicking on the Marker
Click on the marker to show an infowindow with some text:
№31 слайд
Содержание слайда: Set Markers and Open InfoWindow for Each Marker
The placeMarker() function places a marker where the user has clicked, and shows an infowindow with the latitude and longitude of the marker:
№32 слайд
Содержание слайда: Google Maps Types
Google Maps API supports:
ROADMAP (normal, default 2D map)
SATELLITE (photographic map)
HYBRID (photographic map + road and city names)
TERRAIN (map with mountains, river, etc)
№33 слайд
Содержание слайда: Types of Google Map
The map type is specified either within the Map properties object, with the mapTypeId property:
Or by calling the map’s setMapTypeId() method:
№34 слайд
Содержание слайда: Good Luck!!!
Скачать все slide презентации Introduction to Google Maps одним архивом:
