Вы можете сделать это с помощью функции reshape()
или с функциями melt()
/ cast()
в пакете reshape. Для второго варианта пример кода:
library(reshape)
cast(dat1, name ~ numbers)
Или с помощью reshape2
library(reshape2)
dcast(dat1, name ~ numbers)
В вашем коде вы определили drawMap
функцию, но она не вызывается. Вызовите функцию drawMap для onload
изображения.
const canvas = document.getElementById("GameCanvas");
const ctx = canvas.getContext("2d");
var testMap = [
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[1,1,1,1,1,1,1,1,1,1],
[1,1,1,1,1,1,1,1,1,1]
];
const testBlock = new Image();
testBlock.src = "https://mdn.mozillademos.org/files/5397/rhino.jpg"
testBlock.onload = drawMap;
let posX = 0;
let posY = 0;
function drawMap () {
for (let i = 0; i < testMap.length; i++) {
for (let j = 0; j < testMap[i].length; j++) {
if (testMap[i][j] == 1) {
ctx.drawImage(testBlock, 0, 0, 16, 16, posX, posY, 16, 16);
}
posX += 16;
}
posX = 0;
posY += 16;
};
}
<canvas id = "GameCanvas" width = "800" height = "480"></canvas>
Убедитесь, что ваше изображение загружено, прежде чем рисовать с ним.
Вы можете сделать это, позвонив drawMap
в testBlock.onload
.
Вот рабочая демонстрация (просто нажмите Run code snippet
):
var testMap = [
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1]
];
var testBlock = new Image();
testBlock.onload = drawMap;
testBlock.src = "https://i.stack.imgur.com/R6JFX.png"
function drawMap() {
var canvas = document.getElementById("GameCanvas")
var ctx = canvas.getContext("2d")
var posX = 0;
var posY = 0;
for (var i = 0; i < testMap.length; i++) {
for (var j = 0; j < testMap[i].length; j++) {
if (testMap[i][j] == 1) {
ctx.drawImage(testBlock, 0, 0, 16, 16, posX, posY, 16, 16);
}
posX += 16;
}
posX = 0;
posY += 16;
};
}
<body>
<canvas id="GameCanvas" width="160" height="96" style="border:1px solid #000000;" />
</body>