Hey guys wondered if anybody could shed some light on this really annoying issue I am having with an embedded google maps.

 

I have the map embedded and it works great, except one major flaw - the marker is not auto focussed meaning users have to "find" the maker. Is there any code or anything I can use to tell the map to auto focus on the marker?

 

I have searched and the only solutions I can find are for non embedded type maps.

 

Appreciate any help or guidance. Thanks.

 

Here is my embedded code:

<iframe src="http://maps.google.co.uk/maps?f=q&source=s_q&hl=en&geocode=&q=2+Sheen+Road+Richmond+LONDON+TW9+1AE&aq=&sll=51.5405,-3.2655&sspn=0.172321,0.528374&ie=UTF8&hq=&hnear=2+Sheen+Rd,+Richmond,+Surrey+TW9+1AE,+United+Kingdom&t=m&z=14&ll=51.461294,-0.302532&output=embed" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" width="418" height="287"></iframe>
<small><a style="color: #0000ff; text-align: left;" href="http://maps.google.co.uk/maps?f=q&source=embed&hl=en&geocode=&q=2+Sheen+Road+Richmond+LONDON+TW9+1AE&aq=&sll=51.5405,-3.2655&sspn=0.172321,0.528374&ie=UTF8&hq=&hnear=2+Sheen+Rd,+Richmond,+Surrey+TW9+1AE,+United+Kingdom&t=m&z=14&ll=51.461294,-0.302532" rel="nofollow" target="_blank">View our London Office in a larger map</a></small>

Why not just use API v3? If all you want is a map with a marker, the code is very simple. You can then use "bounds" to center the marker. There are examples in the documentation you could practically copy and paste.

I will have a look into it, but would it work within a shortcode in wp?

Mike, i had a good look at the documentation for v3 of the api and in all honesty its way over my head.

 

So, new problem -

 

The client has this:

 

And they want it in there new site.

 

Tried litterally ripping the old code, and putting it in a new page on the site, but a warning box appears telling me it uses api v2 which is depreciated now blah blah blah and dont really fancy creating a new map with hundreds of markers on it.

 

Is there anyway I can import this code into a new google map?

 

       var point0 = new GLatLng(35.092945313732635,33.211669921875); //cyprus
               var marker0 = new GMarker(point0, icon2);
               map.addOverlay(marker0);
               var point1 = new GLatLng(22.735656852206482,57.2607421875);//oman
               var marker1 = new GMarker(point1, icon);
               map.addOverlay(marker1);
               var point2 = new GLatLng(24.00632619875113,44.6484375);//saudi
               var marker2 = new GMarker(point2, icon2);
               map.addOverlay(marker2);
               var point3 = new GLatLng(25.175116531621764,55.34912109375);//dubai
               var marker3 = new GMarker(point3, icon2);
               map.addOverlay(marker3);
               var point4 = new GLatLng(36.14231087352999,-5.34759521484375);//gibralter
               var marker4 = new GMarker(point4, icon);
               map.addOverlay(marker4);
               var point5 = new GLatLng(3.1624555302378474,102.041015625);//malaysia 
               var marker5 = new GMarker(point5, icon2);
               map.addOverlay(marker5);
               var point6 = new GLatLng(1.318243056862001,103.86474609375); //singapore 
               var marker6 = new GMarker(point6, icon);
               map.addOverlay(marker6);
               var point7 = new GLatLng(22.277262697940692,114.18356895446777); // hong kong 
               var marker7 = new GMarker(point7, icon2);
               map.addOverlay(marker7);
               var point8 = new GLatLng(54.32453296307182,-4.3883514404296875); //IOM 
               var marker8 = new GMarker(point8, icon);
               map.addOverlay(marker8);
               var point9 = new GLatLng(51.5556190757,-3.3918714082); //lantrisant 
               var marker9 = new GMarker(point9, icon2); 
               map.addOverlay(marker9);
               var point10 = new GLatLng(53.3962082104,-3.0150691931); //Birkenhead
               var marker10 = new GMarker(point10, icon);
               map.addOverlay(marker10);
               var point11 = new GLatLng(52.632148375,-2.7697467470); //shrewsbury
               var marker11 = new GMarker(point11, icon2);
               map.addOverlay(marker11);
               var point12 = new GLatLng(53.715402931509004,-6.3576507568359375); //Drogheda
               var marker12 = new GMarker(point12, icon);
               map.addOverlay(marker12);
               var point13 = new GLatLng(53.513980372412384,-6.5430450439453125);//Dunshaughlin 
               var marker13 = new GMarker(point13, icon2);
               map.addOverlay(marker13);
               var point14 = new GLatLng(52.11240908504091,-4.07867431640625);//Lampeter &long=
               var marker14 = new GMarker(point14, icon);
               map.addOverlay(marker14);
               var point15 = new GLatLng(52.9356793211,-1.1816452883); //nottingham
               var marker15 = new GMarker(point15, icon2);
               map.addOverlay(marker15);
               var point16 = new GLatLng(53.767181217343925,-1.77978515625); //Bradford
               var marker16 = new GMarker(point16, icon);
               map.addOverlay(marker16);
               var point17 = new GLatLng(51.4668744724,-0.0578856913); //Peckham
               var marker17 = new GMarker(point17, icon2);
               map.addOverlay(marker17);
               var point18 = new GLatLng(53.7892887454,-2.9820352089);//Blackpool
               var marker18 = new GMarker(point18, icon);
               map.addOverlay(marker18);
               var point19 = new GLatLng(50.45171138711746,-3.5547637939453125); //torbay 
               var marker19 = new GMarker(point19, icon2);
               map.addOverlay(marker19);
               var point20 = new GLatLng(49.18349869228674,-2.105984687805176); //st helier 
			var marker20 = new GMarker(point20, icon);
               map.addOverlay(marker20);
               var point21 = new GLatLng(51.453365088385986,-0.9413909912109375); // Early, Reading 
               var marker21 = new GMarker(point21, icon2);
               map.addOverlay(marker21);
               var point22 = new GLatLng(53.22553720854758,-4.140365123748779); //bangor 
               var marker22 = new GMarker(point22, icon);
               map.addOverlay(marker22);
               var point23 = new GLatLng(53.002595308805745,-2.1787261962890625); // stoke on trent
               var marker23 = new GMarker(point23, icon2);
               map.addOverlay(marker23);
               var point24 = new GLatLng(15.665354182093287,47.63671875); // yemen 
               var marker24 = new GMarker(point24, icon);
               map.addOverlay(marker24);
               var point25 = new GLatLng(39.40735095661695,-9.134187698364258); // portugal 
               var marker25 = new GMarker(point25, icon2);
               map.addOverlay(marker25);
               var point26 = new GLatLng(50.37098482868069,-4.1332948207855225); //plymouth 
               var marker26 = new GMarker(point26, icon);
               map.addOverlay(marker26);
               var point27 = new GLatLng(51.62090756871551,-3.932982087135315); //SA1 
               var marker27 = new GMarker(point27, icon2);
               map.addOverlay(marker27);
               var point28 = new GLatLng(51.47860327187394,-3.6972427368164062);//porthcawl
               var marker28 = new GMarker(point28, icon);
               map.addOverlay(marker28);
               var point29 = new GLatLng(52.15023869755407,-3.39752197265625); //Builth
               var marker29 = new GMarker(point29, icon2);
               map.addOverlay(marker29);
               var point30 = new GLatLng(51.77078774404608,-4.462251663208008); //Laugharne
               var marker30 = new GMarker(point30, icon2);
               map.addOverlay(marker30);
              	var point31 = new GLatLng(55.83522882231773,-4.2681884765625); //Glasgow &long=
               var marker31 = new GMarker(point31, icon);
               map.addOverlay(marker31);
               var point32 = new GLatLng(55.596971267985076,-2.52685546875); //scotland 2 &long=
               var marker32 = new GMarker(point32, icon2);
               map.addOverlay(marker32);
               /*var point33 = new GLatLng(,);
               var marker33 = new GMarker(point33, icon);
               map.addOverlay(marker33);*/

 

Thanks for any help or advise on the matter.

You can't use v2 code any more. You have to re-write the code using API v3.

 

If it, as it appears, is just a load of markers on a map, it shouldn't be too difficult.

 

Here's an example: http://gmaps-samples-v3.googlecode.com/svn/trunk/toomanymarkers/toomanymarkers.html

 

Their marker code: http://gmaps-samples-v3.googlecode.com/svn/trunk/toomanymarkers/markers.js

 

Another example: http://www.lootogo.com/googlemapsapi3/markerPlugin.html

 

You could take the code for the second example, add your extra markers and remove the Clear button (and the code that clears the markers) as I presume you don't need that.

 

 

I've made you an example using your first three locations: http://jsfiddle.net/brightonmike/m3hnC/

 

You may need to use the bounds feature so the map "centers" on all your locations.

 

Simples!

Edited April 30, 201214 yr by brightonmike

So I just change the code for the markers to my own data? and replace those in my html file?

 

Yes, thats all it is - a bunch of markers on the page.

 

Cheers

 

So with that example you gave, i just copy

   var t =  new Object();
   t.name = "test2"
   t.lat =  24.00632619875113
   t.lng =  44.6484375
   a[2] = t;

However many times I need it, and adjust the data to the data I have?

 

Sorry and thanks very much for taking the time - I'm not the sharpest tool in the box when it comes to anything coding related.

 

If it helps at all this is being done in wordpress too.

Edited April 30, 201214 yr by jamesosix

I'm pretty sure of that, yes.

I'm pretty sure of that, yes.

i have over 1200 points to enter...

 

haha, is there a faster way to do this rather than c&p each and every co-ordinate?

 

edit:

If somebody can do this in a few minutes or an hour or whatever I am willing to pay for such service.

Edited April 30, 201214 yr by jamesosix

If there are that many points, I would consider storing the data in say, a KML file, and then pulling that data into the JavaScript. Having 1200 co-ordinates in the JavaScript I don't think is going to work too well....

 

I would also use the method I've posted above (the first one) for dealing with that number of markers, by "grouping" them.

yeah thats what I figured about the javascript...

 

Ughh this is way out of my depth and skills, gonna have to speak to my boss and client and really see how important for the company this is.

 

Thanks for your advice and time Mike, I do appreciate it. Do I owe you anything? Maybe a could buy you a beer or something?

 

Cheers

You don't owe me anything!

 

You could learn how to do it, there are tutorials etc, but obviously it could take a while. If the client can't wait, maybe outsource it?

 

For someone that knows JavaScript it should be a quick job, maybe 2/3 hours. Might even be someone on here willing to code it up for you.

 

Can the client not provide the list of locations as a CSV, in the format "location,coordinates"? Literally just a list of the location names followed by their coords.

Edited April 30, 201214 yr by brightonmike

You sure? I dont mind paying my dues like.

 

I can ask them if they have locatations in a csv format, but I doubt very much they do (no harm in asking though).

 

Well, if anybody feels confident taking this on, I would personally outsource this if the price is fair.

 

 

Thanks again for your help and advice Mike, very much appreciated sir.

Ok, kinda worked it.

 

I can create a new map in google maps and add the locations, by searching using the co-ords and then adding it to my map. However, this is a fairly lengthy process.

 

Would I be able to somehow take all my data and strip it, leaving me with the co-ords and location names, and then importing that as a KML file?

You could use search & replace in an editor to replace much of the tags, but you would have to manually remove the numbers as they change on each line.

 

E.g

 

                var point13 = new GLatLng(53.513980372412384,-6.5430450439453125);//Dunshaughlin 
               var marker13 = new GMarker(point13, icon2);
               map.addOverlay(marker13);

 

You would first search and "replace all" this bit:

 

var point

 

then this bit:

 

 = new GLatLng(

 

then this bit:

 

);//

 

etc, etc

 

leaving you with something like:

 

13,53.513980372412384,-6.5430450439453125),Dunshaughlin,13,13,13

 

You can't remove the "13", because that number changes on each line, though you could manually, and I would recommend you do even if it takes 20 min. You can replace the bits of code with commas, and you should then end up with a handy CSV list, ready to be imported into the JavaScript into an array.

 

Or, if you want to put the list into JavaScript, when you strip the old code, you could replace it with the new syntax. For example, you'd replace this:

 

 = new GLatLng(

 

with this:

 

var t =  new Object();
   t.lat =  

 

That then becomes:

 

    var t =  new Object();
   t.lat =  53.513980372412384
   t.lng =  -6.5430450439453125
   t.name = "Dunshaughlin"
   a[2] = t;

Edited April 30, 201214 yr by brightonmike

Did an example using Notepad++:

 

var t =  new Object();
t.lat =22.735656852206482
t.lng = 57.2607421875
t.name = "oman"
a[2] = t;				
var t =  new Object();
t.lat =24.00632619875113
t.lng = 44.6484375
t.name = "saudi"
a[2] = t;
var t =  new Object();
t.lat =25.175116531621764
t.lng = 55.34912109375
t.name = "dubai"
a[2] = t;
var t =  new Object();
t.lat =36.14231087352999
t.lng = -5.34759521484375
t.name = "gibralter"
a[2] = t;

 

It wasn't perfect. I still had to manually go through and strip some of the old numbers I didn't need. But using search & replace could make it much easier for you to do this.

 

If you think it's bad for you, last year I had to format a list of over 12000 airports, including ICAO, IATA, Airport Name, Country, City.....yeah now that was a headache!

Edited April 30, 201214 yr by brightonmike

haha thanks for the advise Mike, but I'm just gonna keep doing it the long way and just embed the damn thing. Our timeframe has expired and my boss is quite for me to spend the next day or two copying and pasting...haha.

 

Ouch, that airport job seems a real ball ache lol.

 

Now I dont so feel bad. I just wish I was code minded, now ask me to design a sexy graphic, or something it will be done in no time.

 

Cheers fella - genuinly owe you, for at least trying (so hard). Thank you

Edited April 30, 201214 yr by jamesosix