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.