Google 地图助手
# CakePHP 2.x 的 Google 地图助手 适用于 CakePHP 框架的助手,使用 Google 地图 API V3 在您的视图中集成 Google 地图。
安装
- 将助手放入 **app/View/Helper/GoogleMapHelper.php**
- 在控制器中添加这行代码: `php public $helpers = array('GoogleMap'); // 添加 助手 `
- 然后我们需要将必要的 Javascript 文件添加到视图中: `php<?= $this->Html->script('`http://maps.google.com/maps/api/js?sen sor=true',`_ false); ?> ` 请注意,API 密钥不是必需的,但如果您想监控您的使用情况或购买额外的使用配额,您可能需要添加它。要添加 API 密钥: `php<?= $this->Html->scr ipt('`http://maps.google.com/maps/api/js?key=YOUR_API_KEY&sensor=true' ,`_ false); ?> `
使用方法
将地图打印到您的视图 `phpGoogleMap->map(); ?> `
地图选项
以下是可用于设置地图的选项
**id:** Map
canvas id * **width:** Map width * **height:** Map height * **style:**
Map canvas CSS style * **zoom:** Map zoom * **type:** Type of map -
`ROADMAP`, `SATELLITE`, `HYBRID` or `TERRAIN` * **custom:** Any other
map option not mentioned before and available for the map. For example
`mapTypeControl: true`. See more map options at:
https://developers.google.com/maps/documentation/javascript/controls *
**localize:** Boolean to localize your position or not. Overrides
'latitude' & 'longitude' and 'address' (Localize have priority versus
Latitude & Longitude and Address) * **latitude:** Default latitude if
the browser doesn't support localization or you don't want
localization (Latitude & Langitude have priority versus Address) *
**longitude:** Default longitude if the browser doesn't support
localization or you don't want localization (Latitude & Langitude have
priority versus Address) * **address:** Default address if the browser
doesn't support localization or you don't want localization (Latitude
& Langitude have priority versus Address) * **marker:** Boolean to put
a marker in your position or not * **markerTitle:** Marker title (HTML
title tag) * **markerIcon:** Default icon of the marker of your
position * **markerShadow:** Default icon' shadow of the marker of
your position * **infoWindow:** Boolean to show an information window
when you click your position marker or not * **windowText:** Default
text inside your position marker´s information window
为了修改上面显示的任何默认选项,您需要通过以下方式传递数组来创建地图
<?php
// Override any of the following default options to customize your map
$map_options = array(
'id' => 'map_canvas',
'width' => '800px',
'height' => '800px',
'style' => '',
'zoom' => 7,
'type' => 'HYBRID',
'custom' => null,
'localize' => true,
'latitude' => 40.69847032728747,
'longitude' => -1.9514422416687,
'address' => '1 Infinite Loop, Cupertino',
'marker' => true,
'markerTitle' => 'This is my position',
'markerIcon' => 'http://google-maps-icons.googlecode.com/files/home.png',
'markerShadow' => 'http://google-maps-icons.googlecode.com/files/shadow.png',
'infoWindow' => true,
'windowText' => 'My Position'
);
?>
<?= $this->GoogleMap->map($map_options); ?>
添加标记
要添加标记,请使用
GoogleMap->addMarker($map_id, $marker_id,
$position); ?> ``` Where: * **$map_id** is the map canvas id
('map_canvas' by default) * **$marker_id** is the unique identifiyer
for that marker * **$position** could be a simple string with the
address or an array with latitude and longitude.
Example with address (using geolocation) ```php<?=
$this->GoogleMap->addMarker("map_canvas", 1, "1 Infinite Loop,
Cupertino, California");
使用纬度和经度的示例
<?= $this->GoogleMap->addMarker("map_canvas", 1, array('latitude' => 40.69847, 'longitude' => -73.9514)); ?>
标记选项
有一些标记选项可用于自定义标记弹出信息窗口:* **showWindow:** 布尔值,用于显示或不显示弹出信息窗口 * **windowText:** 在弹出信息窗口中显示的文本 * **markerTitle:** 标记标题(HTML 标题标签) * **markerIcon:** 标记图标 * **markerShadow:** 标记图标阴影 为了修改上面显示的任何默认选项,您需要通过以下方式传递数组来创建标记
<? // Override any of the following default options to customize your
marker $marker_options = array( 'showWindow' => true, 'windowText' =>
'Marker', 'markerTitle' => 'Title', 'markerIcon' =>
'`http://labs.google.com/ridefinder/images/mm_20_purple.png',`_
'markerShadow' =>
'`http://labs.google.com/ridefinder/images/mm_20_purpleshadow.png',`_
); ?>
<?= $this->GoogleMap->addMarker("map_canvas", 1, "1 Infinite Loop,
Cupertino, California", $marker_options); ?>