标签: isometric

我可以根据Drawing Isometric game worlds上的公式绘制我的地图。但是我怎样才能根据它在地图图层 div 上的位置找到一个图块的 xy 呢？

为了清楚起见，我的图块的左侧样式是 1036px，顶部样式是 865px。根据这些CSS属性如何根据地图找到图块的x和y位置？

图块宽度为 200，高度为 100。

非常感谢。

我的javascript代码是这样的：

this.drawTiles = function(min_x, max_x, min_y, max_y) {
    if (min_x < 0) min_x = 0;
    if (min_y < 0) min_y = 0;
    if (max_x < 0) max_x = thisObj.MAXSIZE;
    if (max_y < 0) max_y = thisObj.MAXSIZE;
    if (max_x > this.mapSize - 1) max_x = this.mapSize - 1;
    if (max_y > this.mapSize - 1) max_y = this.mapSize - 1;
    if (min_x < this.mapSize - 1) …

好吧,坚持这里.我正在做一些WebGL,我正在尝试制作一个等距立方体.我不想使用Three.js.我想首先了解我的代码中出了什么问题.我一直在研究,我能找到的唯一教程似乎是OpenGL

无论如何 - 这是我的drawScene函数:

function drawScene() {

this.gl.clear(this.gl.COLOR_BUFFER_BIT | this.gl.DEPTH_BUFFER_BIT);
mat4.perspective(45, this.gl.viewportWidth / this.gl.viewportHeight, 0.1, 100.0, pMatrix);
mvMatrix = mat4.lookAt([0,0,40], [0, 0, 0], [0, 1, 0]);

_globalNext = this._first;

    while(_globalNext) {
    _globalNext.render();
    }

}

并且渲染功能是

function render() {

mvPushMatrix();

//transform. order matters.
mat4.translate(mvMatrix, [this._x, this._y, this._z]);
mat4.rotate(mvMatrix, 0.01745*this._rot, [this._axisX, this._axisY, this._axisZ]);
mat4.scale(mvMatrix,  [this._scaleX,this._scaleY,this._scaleZ]);

//bind the buffers.
this.gl.bindBuffer(this.gl.ARRAY_BUFFER, this._positionBuff);
this.gl.vertexAttribPointer(this._shader.vertexPositionAttribute, this._positionBuff.itemSize,   this.gl.FLOAT, false, 0, 0);

this.gl.bindBuffer(this.gl.ARRAY_BUFFER, this._colorBuff);
this.gl.vertexAttribPointer(this._shader.vertexColorAttribute, this._colorBuff.itemSize, this.gl.FLOAT, false, 0, 0);

this.gl.bindBuffer(this.gl.ELEMENT_ARRAY_BUFFER, this._indexBuff);
this.setMatrixUniforms(this.gl);
this.gl.drawElements(this.gl.TRIANGLES, this._indexBuff.numItems, this.gl.UNSIGNED_SHORT, 0);

    if(this._usePopper …

嗨，大家好。我正在尝试在 photoshop 上学习等距图片。我在网上找到了一个例子，就像一张图片。在这张图片中，左边的方块是我的瓷砖。我应该把它转换成右边的钻石。

但我想知道，我怎样才能最实用地做到这一点？我已将旋转转换为 45'。我现在该怎么办？我使用了同样的扭曲，但我不知道我应该输入哪些值。

X： ？于：？华：？于：？H：？角度： ？

我的正方形是 200px/200px。以及我必须输入哪些值才能使其像图片中的菱形一样（是否有任何数学公式？）

在Tiled编辑器中有一个等距映射示例:"isometric_grass_and_water.tmx".此示例显示了具有64x32像素大小的图块的简单等距映射.

我需要知道瓷砖边的大小,所以我只是用了毕达哥拉斯定理:

在直角三角形ABC侧AC =宽度/ 2 = 32并且侧AB =高度/ 2 = 16.因此,区块(BC)的侧面可以被计算为:

所以整块瓷砖是菱形,每边= 35.777.

然而,当我向Tiled添加尺寸为35.77 x 35.77的方形物体时,它不适合网格(它实际上比在瓷砖上更大).但是,如果我添加尺寸为32 x 32的物体 - 它非常适合.

请看一下这张图片(对象A是32x32,B是35.77x35x77):

这怎么可能？Tiled是否使用了某种缩放,或者我的计算出了什么问题？

我试图在等距2D游戏中确定鼠标在哪个精灵上.我认为我最好的选择是将每个精灵不同的颜色绘制成一个单独的renderTarget2D并将其转换为一个Texture2D点,此时我可以从鼠标点获取颜色数据并根据绘制的精灵进行检查.

我使用该方法的问题是,我无法将单个精灵的颜色更改为纯色.如果我更改了spriteBatch.Draw调用中的颜色,它只会对精灵的颜色进行着色而不是将其绘制为纯色,因此从纹理中检索的数据无效.

有任何建议或帮助以纯色绘制这些精灵？

我正在努力将鼠标/屏幕坐标转换为等距瓷砖索引.我已经尝试了我在这里或在互联网上找到的每一个公式,但它们似乎都没有用,或者我错过了一些东西. http://i.imgur.com/HnKpYmG.png 这是一张图片,原点位于左上角,一个图块的尺寸为128x64像素.

我要感谢任何帮助,谢谢.