![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgF4F9m34WKfmGGghujJq8hKEyCXXPp94krU2s_A_0EKsdk9w0JWjPk9VtIP6QuU5VoGRoTo4pgP0Ta6GOxQI7JS3FEl7_L7feYI5Dtz3JxCLmm8XPJb_fM3l3icPgRYTV5VeGH/s400/mapsmania.gif)
GMap3 is a plugin for jQuery which allows users to create Google Maps with v3 of the maps API. The plug-in includes a number of options, including a right-click context menu (pictured above), marker clustering and Street View.
Sliding Information Window
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_TmhnCA0mYtrsMFKe38y6kb8K5cGyW6QqaxSEye6jEsFm1WVbCZ7DnL-ZM7FQYEGVONw85Yl09QcAUro2SGIpnqyCV5hX5R53u8uxpJNuEGbukRYqOSFQ8ierEVD-KPPONuAH/s400/mapsmania.gif)
This Google Maps and jQuery tutorial shows you how to create a nice sliding information window. If you follow this tutorial you can create a map with an information window that slides onto and off the map when you click on the map markers.
Google Maps Slider
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9TjyczFlFEF_M_RMDAwIGnth44ziP-gn0wXvsV4HkEXaseUghkdnJ5rIRbrv3kCfuDSV3TwyIB3uKzTvoKJrXc8x-8XZobTGcaiBMETwi2Wj0byhbuiZ0i-121e4YZeP7Lx6N/s400/earth.jpg)
This nice Google Maps demo applies a mouseover event to a map sidebar. When you mouseover a listing in the sidebar the map pans to the selected location.
JQuery & Google Maps Tutorial
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiupODdH-3jzPmaZlCkyCEqvjDeP5peyjX0ysAfGQ-HtZt4rEYMHzVjm_jQtZN5iBkU4rJxKB_3Sh28qBp0EOPt1OB9b9ZKuOupIXWYFexAIq92UA-MdxK7K8mErq7C8mM5PQf7/s400/earth.jpg)
This is a great tutorial about how map developers can use jQuery to create custom Google Maps. I particularly like Step 7. of the tutorial which shows you how to replace the default information window in the Google Maps API with a custom information window.
Rotating Map Demo
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKG8dbHO2HY2LIm9UHKTdE1i3QDCOlHfDTxLxPb3bhWj7MBPRL8PBRcxsC2JgFJ9E0yt1YZP5E3UTe_zVpu7fHS6Yzna3tfOh_O-H_6g57D-t3RCpjScVudsjpbzDkCcVRvZkTJQ/s400/earth.jpg)
Chris Heilmann has created his own rotating map demo using CSS3 and jQuery.
Use the 'L' and 'R' keys to rotate the map. Also try and pan the map for a little added fun.
Chris has posted a brief explanation on his blog Wait Till I Come! that will help you if you would like to replicate this effect in your own maps.
________________
2 comments:
I have couple of pages that I want to integrate with GMap3.Can I use this plugin with wordpress blogs and squidoo or hubpages?Thank you so much.
Your second link to the sitepoint article is broken, it should be:
http://blogs.sitepoint.com/embellishing-your-google-map-with-css3-and-jquery/
Post a Comment