hello, my ultimate goal is to have this display a 8x8 grid of images (google map images)that will update based on a variable.i wanted to be able to change stuff such as zoom, starting location, styles, ect and then run it. atm i just have the single image to figure it out as i have minimal knowledge with scripting and am trying to figure it out.
this is the code i have so far.
Code:
<!DOCTYPE html>
<html>
<body>
<script>
var vzoom=15
var vsize="640x640"
var vmaptype="roadmap"
var x1=51.363244, y1=4.847011;
var x2=x1-10, y2=y1-10;
document.write(x1);
document.write("<p></p>");
document.write(x2);
document.write("<p></p>");
//these were for visual aid that the variables were working
//this image is the unedited link that works
document.write('<a href="http://maps.googleapis.com/maps/api/staticmap?center=52.37907,4.844264&zoom=13&format=png&sensor=false&size=640x480&maptype=roadmap&style=element:labels|visibility:off&style=feature:transit|visibility:off&style=feature:landscape|visibility:off&style=feature:administrative|visibility:off&style=feature:poi|visibility:off&style=feature:road|color:0x808080"><img src="http://maps.googleapis.com/maps/api/staticmap?center=52.37907,4.844264&zoom=13&format=png&sensor=false&size=640x480&maptype=roadmap&style=element:labels|visibility:off&style=feature:transit|visibility:off&style=feature:landscape|visibility:off&style=feature:administrative|visibility:off&style=feature:poi|visibility:off&style=feature:road|color:0x808080" border="0"> </a>')
//this is the edited link with variables that wont load properly(properties are blank from the first variable on)
document.write('<a href="http://maps.googleapis.com/maps/api/staticmap?center="x1","y1"&zoom="vzoom"&format=png&sensor=false&size="vsize"&maptype="vmaptype"&style=element:labels|visibility:off&style=feature:transit|visibility:off&style=feature:landscape|visibility:off&style=feature:administrative|visibility:off&style=feature:poi|visibility:off&style=feature:road|color:0x808080"><img src="http://maps.googleapis.com/maps/api/staticmap?center="x1","y1"&zoom="vzoom"&format=png&sensor=false&size="vsize"&maptype="vmaptype"&style=element:labels|visibility:off&style=feature:transit|visibility:off&style=feature:landscape|visibility:off&style=feature:administrative|visibility:off&style=feature:poi|visibility:off&style=feature:road|color:0x808080" border="0"> </a>')
//this is another edited version that wont load(properties show the edited text)
document.write('<a href="http://maps.googleapis.com/maps/api/staticmap?center=x1,y1&zoom=vzoom&format=png&sensor=false&size=vsize&maptype=vmaptype&style=element:labels|visibility:off&style=feature:transit|visibility:off&style=feature:landscape|visibility:off&style=feature:administrative|visibility:off&style=feature:poi|visibility:off&style=feature:road|color:0x808080"><img src="http://maps.googleapis.com/maps/api/staticmap?center=x1,y1&zoom=vzoom&format=png&sensor=false&size=vsize&maptype=vmaptype&style=element:labels|visibility:off&style=feature:transit|visibility:off&style=feature:landscape|visibility:off&style=feature:administrative|visibility:off&style=feature:poi|visibility:off&style=feature:road|color:0x808080" border="0"> </a>')
</script>
ive been trying to get the variables working. but im new and i dont know what to do.
ive searched for hours and am tired of it. im sure someone will be able to solve this. i plan on using this to create multiple masks of the same area. thanks for any help in advance.
and try changing the center=x,y and press enter. a different map will apear. so basically i wanted to have a html doc that will open and have the center x,y ect, as a variable that you could change before loading it. im new to scripting and javascript seemed like a logical way to introduce variables to html doc. but i have no idea if everything im doing is completely wrong or if my code is just written incorrectly.
Well, just for starters, you need to stop using document.write(). document.write() ceased being NEEDED when Netscape 4 replaced Netscape 3 and became even less helpful once MSIE 5 arrived. Say about 13 years ago.
i was going to have a grid of images not just one. and i wanted it to offset the image based on the position of the first image. not like css position but the actual map center position. so kinda like
Okay...so now you have the means to do so, and better than using document.write().
Can I ask what the point of the <a> is?
Since the URL is the same as that of the image, if the user clicks on it then it will just open that one image alone in the window, replacing the entire grid. Surely that's not what you are after??
__________________
An optimist sees the glass as half full.
A pessimist sees the glass as half empty.
A realist drinks it no matter how much there is.
you have been a huge help thank you so much. im new to scripting i didnt realize that is what <a> did. i was just reading online tutorials, that are apparently like 13 years old lol, trying to figure it out.
Before you post, read our: 
