2011-05-03 2 views
0

나는 좋은 작은 이미지 "지도"를 만들기 위해 일부 자바 스크립트로 작업하고 있습니다. 나는 이미지의 일부분을 맵핑하는 것과 같은 이미지 맵을 의미하는 것이 아니라, 미리 설정된 이미지가 알고리즘에 의해 생성 된 세트 패턴에 따라 표시된 어레이를 갖도록하는 것을 의미한다.알고리즘을 사용하여 사전 설정 이미지를 사용하여 임의로 "지도"를 생성 할 수 있습니까?

이미지에 이미지의 기본 패턴이 있도록하려면 어떻게해야합니까?

[편집 1]

나는 이미지가 다음 행으로, 처음에 열을 기준으로 형성 할 필요가 있음을 이해한다.

*** 이제 위의 행을 수행 할 형식을 다시 작성하고 있습니다.

도움이된다면 그 위에 잔디가 있고, 그 아래에 3 개의 블록이 있고, 그 아래에 돌과 자갈이 묻어 있습니다. 잔디는 항상 한 층 깊숙이 있으며, 맨 위에 공기를 넣어 블록에 높이감을 부여합니다. 공기는 어떤 높이라도 될 수 있지만, 높이가 낮거나 낮아야합니다. 여기 http://cl.ly/2s1h213E332r3i3v2a01

지금까지 사이트의 지퍼입니다 : http://cl.ly/1T0f2P1G333T1N1u0c31

는 [/ 편집 1]

[편집 2]

다음

는 지금까지 무엇을하는지에 대한 링크입니다

나는 [편집 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

+0

제작하고자하는 내용의 스크린 샷을 제공 할 수 있습니까? 아마도 이미지 편집기에서 그것을 생성하는 행동은 당신에게 문제에 대한 통찰력을 줄 것입니다. – AShelly

답변

0

는 미트 파텔의 블로그에 대한 simple map generation를 살펴 보자. 이것은지도 생성을위한 알고리즘에 영감을 줄 수 있습니다. 지도는 Perlin noise을 사용합니다.

관련 문제