jxxcarlson / elm-cell-grid / CellGrid.RenderWebGL

Render a CellGrid using WebGL. See also the examples.

Note: WebGL can only handle grids of about 100x100. Drawing more cells exceeds the vertex limit, resulting in a partially blank image. CellGrid.Image can handle larger grids with ease.

Rendering functions

asHtml : { width : Basics.Int, height : Basics.Int } -> (a -> Color) -> CellGrid a -> Html msg

Render a cell grid into an html element of the given width and height.

The cells are stretched to use up all available space. For customized cell sizes, see meshToHtml.

LowLevel


type alias Vertex =
{ x : Basics.Float
, y : Basics.Float
, z : Basics.Float
, r : Basics.Float
, g : Basics.Float
, b : Basics.Float 
}

An individual vertex.


type alias CellStyle a =
{ toColor : a -> Color
, cellWidth : Basics.Float
, cellHeight : Basics.Float 
}

Style an individual cell

cellStyle : CellStyle Bool
cellStyle =
    { toColor =
        \b ->
            if b then
                Color.green

            else
                Color.red
    , cellWidth = 10
    , cellHeight = 10
    }

meshFromCellGrid : CellStyle a -> CellGrid a -> WebGL.Mesh Vertex

Create a mesh from a grid and a style for each cell.

meshToHtml : { width : Basics.Int, height : Basics.Int } -> WebGL.Mesh Vertex -> Html msg

Render a Mesh Vertex into an html element of the given width and height.

Internals

Internal functions exposed for testing.

meshFromCellGridHelp : CellStyle a -> CellGrid a -> List ( Vertex, Vertex, Vertex )