3

我有一个不同点的自定义谷歌地图：

Markers[0] = new Array(new GMarker(new GLatLng(45.0, 9.0)), "Location1", "<strong>Address Line</strong><br/>Some information");
Markers[1] = new Array(new GMarker(new GLatLng(45.0, 12.0)), "Location2", "<strong>Address Line</strong><br/>Some information");

等等

只是我想将标记的颜色从默认的红色更改。即第二个蓝色。

这个怎么做？

4

4 回答 4

2

在标记上使用 setImage 方法。

Marker[1].setImage('blue-icon.png');

http://gmaps-samples.googlecode.com/svn/trunk/whackamarker/whackamarker.htm

于 2010-03-14T18:47:33.943 回答
0

您可以将具有所需颜色的新标记放在原始标记上。此处举例说明了此技术：http: //esa.ilmari.googlepages.com/hellocolorswitch.htm

于 2009-11-15T08:58:54.217 回答
0

如果你使用 gmap3 插件，你可以像这个例子那样做。

https://gmap3.net/api-marker.html。

你可以像这样使用所有这些颜色和图标，

https://sites.google.com/site/gmapsdevelopment/

于 2020-08-31T13:05:12.750 回答
-1

这是一个简单的代码，允许谷歌地图使用多种颜色标记

<?php
$con = mysql_connect("localhost","root","");
$Db=mysql_select_db("map",$con);
$select_det=mysql_query("select * from record");

// some code
?> 
<html>
<head>
<title>EasyGoogleMap</title>
<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false&amp;key=ABQIAAAAPDUET0Qt7p2VcSk6JNU1sBSM5jMcmVqUpI7aqV44cW1cEECiThQYkcZUPRJn9vy_TWxWvuLoOfSFBw" type="text/javascript"></script>
  </head>
  <body onUnload="GUnload()">

<div id="map" style="width: 550px; height: 450px"></div>
<script type="text/javascript">
var greenIcon = new GIcon(G_DEFAULT_ICON);
greenIcon.image = "http://localhost/pointer_image/markerRd.png";
var markerOptions1 = {icon:greenIcon};

    var redIcon = new GIcon(G_DEFAULT_ICON);
redIcon.image = "http://localhost/pointer_image/markerGr.png";
var markerOptions2 = {icon:redIcon};

var yIcon = new GIcon(G_DEFAULT_ICON);
yIcon.image = "http://localhost/pointer_image/markerBl.png";
var markerOptions3 = {icon:yIcon};

    //<![CDATA[
    if (GBrowserIsCompatible()) { 


      // A function to create the marker and set up the event window
      // Dont try to unroll this function. It has to be here for the function closure
      // Each instance of the function preserves the contends of a different instance
      // of the "marker" and "html" variables which will be needed later when the event triggers.    
      function createMarker(point,html,type) {    
        if(type=="b")
        {   
        var marker = new GMarker(point, markerOptions1);
        }   
        else if(type=="c")
        {
         var marker = new GMarker(point, markerOptions2);
        }   
        else
        {
         var marker = new GMarker(point, markerOptions3);
        }
        GEvent.addListener(marker, "click", function() {
          marker.openInfoWindowHtml(html);
        });     
        return marker;      
      }

      // Display the map, with some controls and set the initial location 
      var map = new GMap2(document.getElementById("map"));
      map.addControl(new GLargeMapControl());
      map.addControl(new GMapTypeControl());
      <?php
      while($fetch_record=mysql_fetch_array($select_det))
     {
     ?>
      map.setCenter(new GLatLng(<?php echo $fetch_record['lat'];?>,<?php echo $fetch_record['long'];?>),8);

      // Set up three markers with info windows 

      var point = new GLatLng(<?php echo $fetch_record['lat'];?>,<?php echo $fetch_record['long'];?>);
      var marker = createMarker(point,'<?php echo $fetch_record['desc'];?>','<?php echo $fetch_record['type'];?>')
      map.addOverlay(marker);

     <?php
     }
     ?>

    }

    // display a warning if the browser was not compatible
    else {
      alert("Sorry, the Google Maps API is not compatible with this browser");
    }

    // This Javascript is based on code provided by the
    // Community Church Javascript Team
    // http://www.bisphamchurch.org.uk/   
    // http://econym.org.uk/gmap/

    //]]>
    </script> 
</body>
</html>

在这里，您必须从名为“pointer_image”的文件夹中放置标记图像

您可以通过修改代码来更改标记图像

通过编辑这部分代码：--

<script type="text/javascript">
var greenIcon = new GIcon(G_DEFAULT_ICON);
greenIcon.image = "http://localhost/pointer_image/markerRd.png";
var markerOptions1 = {icon:greenIcon};

    var redIcon = new GIcon(G_DEFAULT_ICON);
redIcon.image = "http://localhost/pointer_image/markerGr.png";
var markerOptions2 = {icon:redIcon};

var yIcon = new GIcon(G_DEFAULT_ICON);
yIcon.image = "http://localhost/pointer_image/markerBl.png";
var markerOptions3 = {icon:yIcon};

希望这会对你有所帮助，我也在下面提供数据库 -----

-- phpMyAdmin SQL Dump
-- version 2.11.4
-- http://www.phpmyadmin.net
--
-- Host: localhost
-- Generation Time: Sep 19, 2011 at 12:48 PM
-- Server version: 5.0.51
-- PHP Version: 5.2.5

SET SQL_MODE="NO_AUTO_VALUE_ON_ZERO";

--
-- Database: `map`
--

-- --------------------------------------------------------

--
-- Table structure for table `record`
--

CREATE TABLE IF NOT EXISTS `record` (
  `id` int(11) NOT NULL auto_increment,
  `lat` varchar(100) NOT NULL,
  `long` varchar(100) NOT NULL,
  `desc` varchar(200) NOT NULL,
  `type` varchar(5) NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=MyISAM  DEFAULT CHARSET=latin1 AUTO_INCREMENT=4 ;

--
-- Dumping data for table `record`
--

INSERT INTO `record` (`id`, `lat`, `long`, `desc`, `type`) VALUES
(1, '22.572646', '88.363895', 'kolkata', 'a'),
(2, '22.982022', '88.440027', 'kalyani', 'b'),
(3, '23.4', '88.5', 'krishnanagar', 'c');
于 2011-09-19T12:55:34.697 回答