Question

编辑：显然，PI在JavaScript中是有限的（这是有道理的）。但这给我带来了一个重大问题。下一个计算我需要的角度的最佳方法是什么？

好吧，首先，我的代码： http://jsfiddle.net/joshlalonde/vtfyj/34/

我绘制的立方体可以打开120度角。因此，坐标是基于（h）8和θ（120）计算的。

在第46行，我有一个for循环，其中包含一个用于创建行/列的嵌套for循环。

它有些微妙，但我注意到线条并没有完全匹配。用于确定每个立方体位置的代码在第49行。立方体原点的第一个参数（我的x值）中的一个是关闭的。任何人都可以帮助弄清楚它是什么吗？

var cube = new Cube(
            origin.x + (j * -w * (Math.PI)) +
            (i * w * (Math.PI))
            , origin.y + j * (h / 2) +
            i * (h / 2) +
            (-k*h), h);

很抱歉，如果这令人困惑。 I，j和k指的是由for循环递增的变量。基本上，这是一个三维for循环。

我认为问题出在Math.PI上。宽度不是问题，或者我相信。我最初使用的是3.2（我不知何故猜到了，它看起来排得很好。但我不知道这个神奇的数字是多少）。我猜测它与转换为Radians的角度有关，但我不明白为什么Math.PI / 180不是解决方案。我尝试过多种方法。 60（以度为单位）* Math.PI / 180不起作用。它的用途是什么？

编辑：这可能只是一个与JavaScript相关的数学问题。数学在理论上是正确的，但无法正确计算。我会接受这种不完美之处，以免以非正统的方式重写代码。我可以说要绕过使用trig数学会花费很多。

Answer 1

有两个问题......

将第35行更改为var w=h*Math.sin(30);。此处的30与this.theta / 4 Cube方法中的getWidth相匹配，因为this.theta等于120。
使用以下代码生成新多维数据集的位置。您不需要Math.Pi。您需要在计算中同时使用立方体宽度和高度。
```
var cube = new Cube(
    origin.x+ -j*w - i*h,
    origin.y + -j*w/2 + i*h/2,
    h);
```

Answer 2

好吧我找到了解决方案！这很简单 - 我使用的是度数而不是弧度。

function Cube(x, y, h) {
this.x = x
this.y = y
this.h = h;
this.theta = 120*Math.PI/180;

this.getWidth = function () {
    return (this.h * Math.sin(this.theta / 2));
};
this.width = this.getWidth();

this.getCorner = function () {
    return  (this.h / 2);
};
this.corner = this.getCorner();

}

显然Javascript trig函数使用Radians，这是一个问题。我做的下一个修复是对立方体中每个点的偏移。它不需要一个！（o.O idk为什么。但无论它是什么。我留下了旧代码，以防我后来发现原因。）

 function draw() {
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
ctx.fillStyle = "#000";
ctx.fillRect(0, 0, canvas.width, canvas.height); // Draw a black canvas

var h = 32;

var width = Math.sin(60*Math.PI/180);
var w = h*width;

var row = 9; // column and row will always be same (to make cube)

var column = row;
var area = row * column;
var height = 1;

row--;
column--;
height--;

var origin = {
    x: canvas.width / 2,
    y: (canvas.height / 2) - (h * column/2) + height*h
};

var offset = Math.sqrt(3)/2;
offset = 1;

for (var i = 0; i <= row; i++) {
    for (var j = 0; j <= column; j++) {
        for (var k = 0; k <= height; k++) {

        var cube = new Cube(
            origin.x + (j * -w * offset) +
            (i * w * offset)
            , origin.y + (j * (h / 2) * offset) +
            (i * (h / 2) * offset) +
            (-k*h*offset), h);
            var cubes = {};  
        cubes[i+j+k] = cube; // Store to array

        if (j == column) {
            drawCube(2, cube);
        }

        if (i == row) {
            drawCube(1, cube);
        }

        if (k == height) {
        drawCube(0,cube);
        }

        }
    }
}

}

请在此处查看完整的Jsfiddle：http://jsfiddle.net/joshlalonde/vtfyj/41/

为什么我的台词不匹配？

2 个答案: