Skip to content

Instantly share code, notes, and snippets.

@YenTheFirst

YenTheFirst/generated.html

Created June 30, 2012 00:11
Show Gist options
  • Save YenTheFirst/3021533 to your computer and use it in GitHub Desktop.
Save YenTheFirst/3021533 to your computer and use it in GitHub Desktop.
Download ZIP
image maker thingy
Raw
generated.html
<html><body>
<div style='position: absolute; left: 0px; top: 0px; background: url("http://tile.stamen.com/terrain/13/1312/3165.png") -10px -10px no-repeat; width: 256px; height:256px;'> </div>
<div style='position: absolute; left: 0px; top: 246px; background: url("http://tile.stamen.com/terrain/13/1312/3166.png") -10px 0px no-repeat; width: 256px; height:256px;'> </div>
<div style='position: absolute; left: 0px; top: 502px; background: url("http://tile.stamen.com/terrain/13/1312/3167.png") -10px 0px no-repeat; width: 256px; height:256px;'> </div>
<div style='position: absolute; left: 0px; top: 758px; background: url("http://tile.stamen.com/terrain/13/1312/3168.png") -10px 0px no-repeat; width: 256px; height:10px;'> </div>
<div style='position: absolute; left: 246px; top: 0px; background: url("http://tile.stamen.com/terrain/13/1313/3165.png") 0px -10px no-repeat; width: 256px; height:256px;'> </div>
<div style='position: absolute; left: 246px; top: 246px; background: url("http://tile.stamen.com/terrain/13/1313/3166.png") 0px 0px no-repeat; width: 256px; height:256px;'> </div>
<div style='position: absolute; left: 246px; top: 502px; background: url("http://tile.stamen.com/terrain/13/1313/3167.png") 0px 0px no-repeat; width: 256px; height:256px;'> </div>
<div style='position: absolute; left: 246px; top: 758px; background: url("http://tile.stamen.com/terrain/13/1313/3168.png") 0px 0px no-repeat; width: 256px; height:10px;'> </div>
<div style='position: absolute; left: 502px; top: 0px; background: url("http://tile.stamen.com/terrain/13/1314/3165.png") 0px -10px no-repeat; width: 256px; height:256px;'> </div>
<div style='position: absolute; left: 502px; top: 246px; background: url("http://tile.stamen.com/terrain/13/1314/3166.png") 0px 0px no-repeat; width: 256px; height:256px;'> </div>
<div style='position: absolute; left: 502px; top: 502px; background: url("http://tile.stamen.com/terrain/13/1314/3167.png") 0px 0px no-repeat; width: 256px; height:256px;'> </div>
<div style='position: absolute; left: 502px; top: 758px; background: url("http://tile.stamen.com/terrain/13/1314/3168.png") 0px 0px no-repeat; width: 256px; height:10px;'> </div>
<div style='position: absolute; left: 758px; top: 0px; background: url("http://tile.stamen.com/terrain/13/1315/3165.png") 0px -10px no-repeat; width: 256px; height:256px;'> </div>
<div style='position: absolute; left: 758px; top: 246px; background: url("http://tile.stamen.com/terrain/13/1315/3166.png") 0px 0px no-repeat; width: 256px; height:256px;'> </div>
<div style='position: absolute; left: 758px; top: 502px; background: url("http://tile.stamen.com/terrain/13/1315/3167.png") 0px 0px no-repeat; width: 256px; height:256px;'> </div>
<div style='position: absolute; left: 758px; top: 758px; background: url("http://tile.stamen.com/terrain/13/1315/3168.png") 0px 0px no-repeat; width: 256px; height:10px;'> </div>
<div style='position: absolute; left: 1014px; top: 0px; background: url("http://tile.stamen.com/terrain/13/1316/3165.png") 0px -10px no-repeat; width: 10px; height:256px;'> </div>
<div style='position: absolute; left: 1014px; top: 246px; background: url("http://tile.stamen.com/terrain/13/1316/3166.png") 0px 0px no-repeat; width: 10px; height:256px;'> </div>
<div style='position: absolute; left: 1014px; top: 502px; background: url("http://tile.stamen.com/terrain/13/1316/3167.png") 0px 0px no-repeat; width: 10px; height:256px;'> </div>
<div style='position: absolute; left: 1014px; top: 758px; background: url("http://tile.stamen.com/terrain/13/1316/3168.png") 0px 0px no-repeat; width: 10px; height:10px;'> </div>
</body></html>
Raw
gistfile1.py
def make_html(base_url, zoom, tile_y, tile_x, width, height, offset_x, offset_y):
f=open("your_image.html", "w")
f.write("<html><body>\n")
pixel_per_tile = 256
end_x = tile_x + int(ceil((float(width + offset_x) / pixel_per_tile))) -1
end_y = tile_y + int(ceil((float(height + offset_y) / pixel_per_tile))) -1
print end_x, end_y, end_x - tile_x, end_y - tile_y
for x in xrange(tile_x, end_x+1):
for y in xrange(tile_y, end_y+1):
url = "%s/%d/%d/%d.png" % (base_url, zoom, x, y)
coords = [
max(0,(x - tile_x) * pixel_per_tile - offset_x),
max(0,(y - tile_y) * pixel_per_tile - offset_y),
]
pos = [0,0]
if x==tile_x:
pos[0] = -offset_x
if y==tile_y:
pos[1] = -offset_y
size = [pixel_per_tile] * 2
if x==end_x:
size[0] = width - coords[0]
if y==end_y:
size[1] = height - coords[1]
f.write("<div style='position: absolute;\
left: %dpx; top: %dpx;\
background: url(\"%s\") %dpx %dpx no-repeat;\
width: %dpx; height:%dpx;'>\
</div>\n" % args)
f.write("</body></html>")
f.close()
make_html("http://tile.stamen.com/terrain", 13, 3165, 1312, 1024, 768, 10, 10)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment