Edge-based shadow casting with proper width
This commit is contained in:
1 parent
14ef21d657
commit
9b5f0d7e37
1 file changed
+31
-11
+31
-11
@@ -170,11 +170,6 @@
|
|||||||
|
|
||||||
var water = isWater(h);
|
var water = isWater(h);
|
||||||
|
|
||||||
var sunX = wx + TILE;
|
|
||||||
var sunY = wy - TILE;
|
|
||||||
var sunH = heightMap[sunX + ',' + sunY] || 0;
|
|
||||||
var isInShadow = (sunH >= h);
|
|
||||||
|
|
||||||
for (var level = 1; level <= h; level++) {
|
for (var level = 1; level <= h; level++) {
|
||||||
var hRight;
|
var hRight;
|
||||||
if (level > (heightMap[(wx + TILE) + ',' + wy] || 0)) {
|
if (level > (heightMap[(wx + TILE) + ',' + wy] || 0)) {
|
||||||
@@ -192,21 +187,46 @@
|
|||||||
drawTile(wx, wy, level, true, hRight, hBack, false);
|
drawTile(wx, wy, level, true, hRight, hBack, false);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (isInShadow && h > 0) {
|
if (h > 0) {
|
||||||
|
var shadowFront = (heightMap[(wx + TILE) + ',' + wy] || 0) - h;
|
||||||
|
var shadowLeft = (heightMap[wx + ',' + (wy - TILE)] || 0) - h;
|
||||||
|
|
||||||
|
if (shadowFront > 0) {
|
||||||
|
var shadowWidth = Math.min(shadowFront * 2, TILE);
|
||||||
|
var t = shadowWidth / TILE;
|
||||||
var top1 = project(wx + GAP/2, wy + TILE - GAP/2, h * HEIGHT_UNIT);
|
var top1 = project(wx + GAP/2, wy + TILE - GAP/2, h * HEIGHT_UNIT);
|
||||||
var top2 = project(wx + TILE - GAP/2, wy + TILE - GAP/2, h * HEIGHT_UNIT);
|
var top2 = project(wx + TILE - GAP/2, wy + TILE - GAP/2, h * HEIGHT_UNIT);
|
||||||
var top3 = project(wx + TILE - GAP/2, wy + GAP/2, h * HEIGHT_UNIT);
|
var topA = project(wx + GAP/2 + (TILE - GAP) * t, wy + TILE - GAP/2, h * HEIGHT_UNIT);
|
||||||
var top4 = project(wx + GAP/2, wy + GAP/2, h * HEIGHT_UNIT);
|
var topB = project(wx + TILE - GAP/2 - (TILE - GAP) * t, wy + TILE - GAP/2, h * HEIGHT_UNIT);
|
||||||
|
|
||||||
ctx.fillStyle = 'rgba(0, 0, 0, 0.35)';
|
ctx.fillStyle = 'rgba(0, 0, 0, 0.4)';
|
||||||
ctx.beginPath();
|
ctx.beginPath();
|
||||||
ctx.moveTo(top1[0], top1[1]);
|
ctx.moveTo(top1[0], top1[1]);
|
||||||
|
ctx.lineTo(topA[0], topA[1]);
|
||||||
|
ctx.lineTo(topB[0], topB[1]);
|
||||||
ctx.lineTo(top2[0], top2[1]);
|
ctx.lineTo(top2[0], top2[1]);
|
||||||
ctx.lineTo(top3[0], top3[1]);
|
|
||||||
ctx.lineTo(top4[0], top4[1]);
|
|
||||||
ctx.closePath();
|
ctx.closePath();
|
||||||
ctx.fill();
|
ctx.fill();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (shadowLeft > 0) {
|
||||||
|
var shadowWidth = Math.min(shadowLeft * 2, TILE);
|
||||||
|
var t = shadowWidth / TILE;
|
||||||
|
var top4 = project(wx + GAP/2, wy + GAP/2, h * HEIGHT_UNIT);
|
||||||
|
var top1 = project(wx + GAP/2, wy + TILE - GAP/2, h * HEIGHT_UNIT);
|
||||||
|
var topA = project(wx + GAP/2, wy + GAP/2 + (TILE - GAP) * t, h * HEIGHT_UNIT);
|
||||||
|
var topB = project(wx + GAP/2, wy + TILE - GAP/2 - (TILE - GAP) * t, h * HEIGHT_UNIT);
|
||||||
|
|
||||||
|
ctx.fillStyle = 'rgba(0, 0, 0, 0.4)';
|
||||||
|
ctx.beginPath();
|
||||||
|
ctx.moveTo(top4[0], top4[1]);
|
||||||
|
ctx.lineTo(topA[0], topA[1]);
|
||||||
|
ctx.lineTo(topB[0], topB[1]);
|
||||||
|
ctx.lineTo(top1[0], top1[1]);
|
||||||
|
ctx.closePath();
|
||||||
|
ctx.fill();
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in new issue
Block a user