Yii 1.1: Using Google Maps in Yii Applications via Jquery


This a clear way to implement a human-address-based google map using a jQuery extension. It is very simple and usefull.


put this script in your page, using a direct script insertion, or using your Yii script manager:

$.fn.googlemap = function(){
    // author: Christian Salazar <christiansalazarh@gmail.com>
    var src='';
    var z = $(this);
    var address = jQuery.trim(z.attr('streetnumber'))
        z.html("<iframe src='"+src+"' width="+z.attr('width')+" height="
    return src;


In any place were you require the google map, insert a DIV or any HTML element having this attributes:

<div id='map' streetnumber='946' streetname='LAKE+DESTINY+RD'
        cityname='ALTAMONTE+SPRINGS' statecode='FL' zipcode='32714'
        zoom=18 width=500 height=300>

STEP 3 Use the script, in this way:

// you can use it in multiple selectors, 
// as an example: $("ul.maps li").googlemap();
// will process all LI items having the required attributes
// displaying a map each.

It will produce:


As an extra feature, the jquery extension provided here will return the URL:

  var url = $('#mymap').googlemap();
  $('#mymap').parent().append("<a href='"+url+"'>enlarge map</a>");

Total 2 comments

#16704 report it
bluyell at 2014/03/21 10:04am
hi @thearith, and what the error is showing you ?

please show the error. this is a very basic jquery call, it cant fail unless you have a problem in your jquery scripts, try cleaning your assets directory

#14629 report it
thearith at 2013/08/30 02:45am
help me

@Christian Salazar, i have done follow your code but it still not work in _form.

Leave a comment

Please to leave your comment.

Write new article