0
私が作っている2次元ゲームの単純な高さマップを作成するためにキャンバスを作成しています。通常のキャンバスサイズ（150px * 300px）では通常のようですが、キャンバスを拡大して（大きな地図の場合）、インテリアコンテンツのサイズを同じサイズにしたい場合、現在行っていることは機能していません。HTML-キャンバス要素はサイズを増やしますが、コンテンツを同じサイズにします
私のコードはここにある：
<body>
<script>
var hai = 1; //World width. I was tinkering with this to make the result that I wanted, but at the end, the entire heigtmap needs to be exported via base64 url. 5 canvas' right next to eachother LOOKS like what I want, but I can't get a base64 url for all 5 together, only one.
var runnin = 0;
while(runnin != hai){
var can = document.createElement("canvas");
can.id = "canvasite"
can.style = "width: 150px; height: 75px;"
document.body.appendChild(can);
c = document.getElementById('canvasite'),
ctx = c.getContext('2d');
var x = 0
if(runnin == 0){
var endheight = c.height/2
}
var y = endheight;
var widd = 0
while(widd != c.width){
ctx.fillStyle = "rgba("+0+","+255+","+0+","+(255/255)+")";
ctx.fillRect(x, y, 1, 1);
var ychan = Math.floor((Math.random() * 6) + 1);
if(ychan == 1){
var y=y+2
}else if(ychan == 2){
var y=y+1
}else if(ychan == 3){
var y=y-1
}else if(ychan == 4){
var y=y-2
}else{
var y=y
}
var hig = y
while(hig != c.height){
ctx.fillStyle = "rgba("+0+","+255+","+0+","+(255/255)+")";
ctx.fillRect(x, hig, 1, 1);
var hig = hig+1
}
var widd = widd+1
var x=x+1
}
var endheight = y
var runnin = runnin+1
document.getElementById('canvasite').setAttribute('id','nAn')
}
</script>
</body>私はそれで言うように、それは私が何をしたいの半分を与えます。 これは、長いheightmapを与えますが、私はそこからbase64のURLを取得することはできません。
私が試したことは、完全なbase64のURLを持つことができません。また、世界の幅が3の場合でも1つのキャンバスで同じことをすることができますので、base64そこからのURL？
ありがとうございました。
編集：私は基本的なプログラマです、私のコードで間違いがある場合は、