简体   繁体   中英

Add transparency to a Google Marker

I have a marker that looks like the on in this tutorial: http://www.powerhut.co.uk/googlemaps/custom_markers.php

Can I add transparency to this marker?

I've looked over the net and failed to find something that would help me in this issue. In Bing Maps I can do something like this:

var veCustomIco = new VECustomIconSpecification();
veCustomIco.CustomHTML= "<img src='" + url + "' style='filter: Alpha(opacity=10);-moz-opacity: 0.1;opacity: 0.10;'/>";
pin.SetCustomIcon(veCustomIco);

Thank you.

It looks like this is possible in version 3.21 of the Google Maps API:

https://developers.google.com/maps/documentation/javascript/reference?csw=1#MarkerOptions

You can either use the setOpacity() opacity method or pass in the opacity as an option when creating the marker.

You can add transparency as you wish as this is a PNG file. PNG files can have transparency. Just edit the image file with photoshop or the like.

Sounds like it's a common PNG with an alpha channel. No fancy software work, just plain gfx editing. GIMP can do this. "Layer"->"Transparency"->"Add alpha channel", then use "eraser" tool to remove whatever you want, or layer opacity to make layer partially transparent, or adjust Alpha channel in curves... anyway, "checkerboard" background means transparency. Save as PNG and you're done.

I ran into the similar problem and solved it loading transparent png's trough a php request and pass a 'transparency' variable trough get.

like: pathtoyourphpfile/index.php?input=darkcyan_0c.png&transparency=40 where 'input' is the original image and 'transparency' is the amount % of transparency you want. In this case it outputs 'output-40.png'

I used imagick to process the png. A very simple example without image paths:

$percent   = $_GET[transparency];
$transparency   = 100 / $percent;
$command = "/usr/bin/convert ".$_GET[input]." -channel Alpha -evaluate Divide {$transparency} output-{$transparency}.png";
$output         = shell_exec($commando1); 

but you could also use php's GD library to adjust png's transparency

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM