如何將一個六角形網格變成一個擠壓的六角形網格？

我有這些函數爲六角形網格。他們爲一個正常的六角形網格工作很好。這些功能對於一個擠壓的六角形網格將會是什麼？通過擠壓六角形網格，我的意思是每個六角形比其高度更寬的網格。如何將一個六角形網格變成一個擠壓的六角形網格？

coordinates_to_pixel = function(x, y) { 
    var pixel_x = s_hex_size * 3/2 * x 
    var pixel_y = s_hex_size * Math.sqrt(3) * (y + x/2) 
    return { x: pixel_x, y: pixel_y } 
} 

pixel_to_coordinates = function(x, y) { 
    var q = 2/3 * x/s_hex_size 
    var r = (1/3 * Math.sqrt(3) * y - 1/3 * x)/s_hex_size 
    var cube = convert_axial_to_cube_coordinates(q,r) 
    var round = round_cube_coordinates(cube.x, cube.y, cube.z) 
    var axial = convert_cube_to_axial_coordinates(round.x, round.y, round.z) 
    return { x:axial.x, y:axial.y } 
} 

hex_points = function(x, y) { 
    var pixel = coordinates_to_pixel(x,y) 

    var points = '' 
    for (var i = 0; i < 6; i++) { 
     var angle = 2 * Math.PI/6 * i 

     var point_x = (hex_size * Math.cos(angle)) + pixel.x + canvas_width/2 
     var point_y = (hex_size * Math.sin(angle)) + pixel.y + canvas_height/2 

     if (i != 0) { points = points + ' '; } 
     points = points + point_x.toString() + ',' + point_y.toString() 
    } 
    return points 
})

這裏是我的意思是擠壓六角形網格的圖像。 hex grid image

下面是轉化率和舍入函數。

convert_axial_to_cube_coordinates = function(q,r) { 
    return { 
     x: q, 
     y: -1 * q - r, 
     z: r 
    } 
} 


convert_cube_to_axial_coordinates = function(x,y,z) { 
    return {x: x, y: z} 
} 


round_cube_coordinates = function(x,y,z) { 
    var rx = Math.round(x) 
    var ry = Math.round(y) 
    var rz = Math.round(z) 

    var x_diff = Math.abs(rx - x) 
    var y_diff = Math.abs(ry - y) 
    var z_diff = Math.abs(rz - z) 

    if (x_diff > y_diff && x_diff > z_diff) { 
     rx = -1 * ry - rz 
    } else if (y_diff > z_diff) { 
     ry = -1 * rx - rz 
    } else { 
     rz = -1 * rx - ry 
    } 

    return {x: rx, y: ry, z: rz} 
}

來源

2014-04-02 Dan

這將取決於如何'convert_axial_to_cube_coordinates'作品，但（3）''通過更換Math.sqrt的Math.sqrt'兩個實例（3）* squish_factor'可能是一個良好的開端。 'squish_factor'當然是一個0到1之間的實際數字，對於拉伸來說，或者大於1。 –

我嘗試用（Math.sqrt（3）* squish_factor）替換Math.sqrt（3），但是然後pixel_to_coordinate中的y是錯誤的。在十六進制，20，它認爲我超過了20，-16。此外，如果有幫助，我還會使用轉換函數更新我的文章。 – Dan

想通了。 coordinates_to_pixel是Math.sqrt（3）*擠壓因子。 Pixel_to_coordinates是Math.sqrt（3）/ squish_factor。一個是繁殖另一個是分裂。

來源

2014-04-02 12:30:05 Dan

如何將一個六角形網格變成一個擠壓的六角形網格？

回答

相關問題