2011-05-03 45 views
0

我正在使用一些JavaScript来创建一个漂亮的小图像“地图”。我不是指像映射图像部分那样的图像映射,但是我的意思是根据由算法产生的设置图案将预设图像形成为数组。如何使用算法随机生成使用预设图像的“地图”?

我怎样才能让图像对他们有某种基本模式?

[编辑1]

我明白,我需要,使图像按列先形成,然后通过行。

***我现在正在重写格式来完成上面的操作。

如果有帮助,我希望草地在上面,然后是三块以下的泥土,然后是石头和卵石。草地总是一层深,我想要顶部的空气给块的高度感。空气可以是任何高度,但它需要高一个或低一个,然后是旁边的那个。

[/编辑1]

[编辑2]

这是到目前为止它做什么的链接: http://cl.ly/2s1h213E332r3i3v2a01

下面是该网站的一个zip至今: http://cl.ly/1T0f2P1G333T1N1u0c31

我试图让它看起来更像我在[编辑1]中描述的有组织。

[/编辑2]

<html> 
<body> 
<script type="text/javascript"> 

var blockList = 'air,stone,grass,dirt,cobble,plank'; 

function blockGetId(ID) { 
    var blockGet = blockList.split(",")[ID]; 
    return '<img src="images/' + blockGet + '.png" />'; 
} 

function blockRandom() { 
    var blockCount = blockList.split(",").length; 
    var blockId = Math.round(Math.random()*(blockCount-1)); 
    document.write(blockGetId(blockId)); 
} 

function rowTable(width) { 
    var w = 0; 

    while (w < width) { 
     document.write('<td class="cell">'); 
     blockRandom(); 
     document.write(' </td>'); 
     w++; 
    } 
} 

function blockTable(width, height) { 
    var h = 0; 

    document.write('<table class="cell"><style>.cell{width:16px;height:16px;colspacing:0px;margin:0px;padding:0px;}.cell hover{border: 5px;}</style>'); 
    while (h < height) { 
     document.write('<tr class="cell">'); 
     rowTable(width); 
     document.write('</tr>'); 
     h++; 
    } 
    document.write('</table>'); 
} 

blockTable(25,25); 

</script> 
</body> 
</html> 
+0

您尚未提供足够的关于您要完成的任务的信息,也没有提出直观的问题。 – Dutchie432 2011-05-03 19:48:21

+0

你可以提供你希望生成的截图吗?也许在图像编辑器中制作它的行为会让你对这个问题有所了解。 – AShelly 2011-05-03 21:22:15

回答