Copyright | (C) 2016-2025 David M. Johnson |
---|---|
License | BSD3-style (see the file LICENSE) |
Maintainer | David M. Johnson <code@dmj.io> |
Stability | experimental |
Portability | non-portable |
Safe Haskell | None |
Language | Haskell2010 |
Miso.Canvas
Description
Synopsis
- type Canvas a = ReaderT Context JSM a
- newtype Pattern = Pattern JSVal
- newtype Gradient = Gradient JSVal
- newtype ImageData = ImageData JSVal
- data LineCapType
- data PatternType
- data LineJoinType
- data DirectionType
- data TextAlignType
- data TextBaselineType
- data CompositeOperation
- data StyleArg
- type Coord = (Double, Double)
- canvas :: forall action canvasState. (FromJSVal canvasState, ToJSVal canvasState) => [Attribute action] -> (DOMRef -> Canvas canvasState) -> (canvasState -> Canvas ()) -> View action
- canvas_ :: forall action canvasState. (FromJSVal canvasState, ToJSVal canvasState) => [Attribute action] -> (DOMRef -> JSM canvasState) -> (canvasState -> JSM ()) -> View action
- globalCompositeOperation :: CompositeOperation -> Canvas ()
- clearRect :: (Double, Double, Double, Double) -> Canvas ()
- fillRect :: (Double, Double, Double, Double) -> Canvas ()
- strokeRect :: (Double, Double, Double, Double) -> Canvas ()
- beginPath :: () -> Canvas ()
- closePath :: () -> Canvas ()
- moveTo :: Coord -> Canvas ()
- lineTo :: Coord -> Canvas ()
- fill :: () -> Canvas ()
- rect :: (Double, Double, Double, Double) -> Canvas ()
- stroke :: () -> Canvas ()
- bezierCurveTo :: (Double, Double, Double, Double, Double, Double) -> Canvas ()
- arc :: (Double, Double, Double, Double, Double) -> Canvas ()
- arcTo :: (Double, Double, Double, Double, Double) -> Canvas ()
- quadraticCurveTo :: (Double, Double, Double, Double) -> Canvas ()
- direction :: DirectionType -> Canvas ()
- fillText :: (MisoString, Double, Double) -> Canvas ()
- font :: MisoString -> Canvas ()
- strokeText :: (MisoString, Double, Double) -> Canvas ()
- textAlign :: TextAlignType -> Canvas ()
- textBaseline :: TextBaselineType -> Canvas ()
- addColorStop :: (Gradient, Double, Color) -> Canvas ()
- createLinearGradient :: (Double, Double, Double, Double) -> Canvas Gradient
- createPattern :: (Image, PatternType) -> Canvas Pattern
- createRadialGradient :: (Double, Double, Double, Double, Double, Double) -> Canvas Gradient
- fillStyle :: StyleArg -> Canvas ()
- lineCap :: LineCapType -> Canvas ()
- lineJoin :: LineJoinType -> Canvas ()
- lineWidth :: Double -> Canvas ()
- miterLimit :: Double -> Canvas ()
- shadowBlur :: Double -> Canvas ()
- shadowColor :: Color -> Canvas ()
- shadowOffsetX :: Double -> Canvas ()
- shadowOffsetY :: Double -> Canvas ()
- strokeStyle :: StyleArg -> Canvas ()
- scale :: (Double, Double) -> Canvas ()
- rotate :: Double -> Canvas ()
- translate :: Coord -> Canvas ()
- transform :: (Double, Double, Double, Double, Double, Double) -> Canvas ()
- setTransform :: (Double, Double, Double, Double, Double, Double) -> Canvas ()
- drawImage :: (Image, Double, Double) -> Canvas ()
- drawImage' :: (Image, Double, Double, Double, Double) -> Canvas ()
- createImageData :: (Double, Double) -> Canvas ImageData
- getImageData :: (Double, Double, Double, Double) -> Canvas ImageData
- setImageData :: (ImageData, Int, Double) -> Canvas ()
- height :: ImageData -> Canvas Double
- width :: ImageData -> Canvas Double
- putImageData :: (ImageData, Double, Double) -> Canvas ()
- globalAlpha :: Double -> Canvas ()
- clip :: () -> Canvas ()
- save :: () -> Canvas ()
- restore :: () -> Canvas ()
- gradient :: Gradient -> StyleArg
- pattern_ :: Pattern -> StyleArg
- color :: Color -> StyleArg
Types
data LineCapType Source #
Constructors
LineCapButt | |
LineCapRound | |
LineCapSquare |
Instances
Show LineCapType Source # | |
Defined in Miso.Canvas Methods showsPrec :: Int -> LineCapType -> ShowS # show :: LineCapType -> String # showList :: [LineCapType] -> ShowS # | |
Eq LineCapType Source # | |
Defined in Miso.Canvas | |
ToJSVal LineCapType Source # | |
Defined in Miso.Canvas Methods toJSVal :: LineCapType -> JSM JSVal Source # toJSValListOf :: [LineCapType] -> JSM JSVal Source # | |
MakeArgs LineCapType Source # | |
Defined in Miso.Canvas |
data PatternType Source #
Instances
FromJSVal PatternType Source # | |
Defined in Miso.Canvas Methods fromJSVal :: JSVal -> JSM (Maybe PatternType) Source # fromJSValUnchecked :: JSVal -> JSM PatternType Source # fromJSValListOf :: JSVal -> JSM (Maybe [PatternType]) Source # fromJSValUncheckedListOf :: JSVal -> JSM [PatternType] Source # | |
ToJSVal PatternType Source # | |
Defined in Miso.Canvas Methods toJSVal :: PatternType -> JSM JSVal Source # toJSValListOf :: [PatternType] -> JSM JSVal Source # |
data LineJoinType Source #
Constructors
LineJoinBevel | |
LineJoinRound | |
LineJoinMiter |
Instances
Show LineJoinType Source # | |
Defined in Miso.Canvas Methods showsPrec :: Int -> LineJoinType -> ShowS # show :: LineJoinType -> String # showList :: [LineJoinType] -> ShowS # | |
Eq LineJoinType Source # | |
Defined in Miso.Canvas | |
ToJSVal LineJoinType Source # | |
Defined in Miso.Canvas Methods toJSVal :: LineJoinType -> JSM JSVal Source # toJSValListOf :: [LineJoinType] -> JSM JSVal Source # | |
MakeArgs LineJoinType Source # | |
Defined in Miso.Canvas |
data DirectionType Source #
Instances
Show DirectionType Source # | |
Defined in Miso.Canvas Methods showsPrec :: Int -> DirectionType -> ShowS # show :: DirectionType -> String # showList :: [DirectionType] -> ShowS # | |
Eq DirectionType Source # | |
Defined in Miso.Canvas Methods (==) :: DirectionType -> DirectionType -> Bool # (/=) :: DirectionType -> DirectionType -> Bool # | |
ToJSVal DirectionType Source # | |
Defined in Miso.Canvas Methods toJSVal :: DirectionType -> JSM JSVal Source # toJSValListOf :: [DirectionType] -> JSM JSVal Source # | |
MakeArgs DirectionType Source # | |
Defined in Miso.Canvas |
data TextAlignType Source #
Instances
Show TextAlignType Source # | |
Defined in Miso.Canvas Methods showsPrec :: Int -> TextAlignType -> ShowS # show :: TextAlignType -> String # showList :: [TextAlignType] -> ShowS # | |
Eq TextAlignType Source # | |
Defined in Miso.Canvas Methods (==) :: TextAlignType -> TextAlignType -> Bool # (/=) :: TextAlignType -> TextAlignType -> Bool # | |
ToJSVal TextAlignType Source # | |
Defined in Miso.Canvas Methods toJSVal :: TextAlignType -> JSM JSVal Source # toJSValListOf :: [TextAlignType] -> JSM JSVal Source # | |
MakeArgs TextAlignType Source # | |
Defined in Miso.Canvas |
data TextBaselineType Source #
Constructors
TextBaselineAlphabetic | |
TextBaselineTop | |
TextBaselineHanging | |
TextBaselineMiddle | |
TextBaselineIdeographic | |
TextBaselineBottom |
Instances
Show TextBaselineType Source # | |
Defined in Miso.Canvas Methods showsPrec :: Int -> TextBaselineType -> ShowS # show :: TextBaselineType -> String # showList :: [TextBaselineType] -> ShowS # | |
Eq TextBaselineType Source # | |
Defined in Miso.Canvas Methods (==) :: TextBaselineType -> TextBaselineType -> Bool # (/=) :: TextBaselineType -> TextBaselineType -> Bool # | |
ToJSVal TextBaselineType Source # | |
Defined in Miso.Canvas Methods toJSVal :: TextBaselineType -> JSM JSVal Source # toJSValListOf :: [TextBaselineType] -> JSM JSVal Source # | |
MakeArgs TextBaselineType Source # | |
Defined in Miso.Canvas |
data CompositeOperation Source #
Constructors
SourceOver | |
SourceAtop | |
SourceIn | |
SourceOut | |
DestinationOver | |
DestinationAtop | |
DestinationIn | |
DestinationOut | |
Lighter | |
Copy | |
Xor |
Instances
Show CompositeOperation Source # | |
Defined in Miso.Canvas Methods showsPrec :: Int -> CompositeOperation -> ShowS # show :: CompositeOperation -> String # showList :: [CompositeOperation] -> ShowS # | |
Eq CompositeOperation Source # | |
Defined in Miso.Canvas Methods (==) :: CompositeOperation -> CompositeOperation -> Bool # (/=) :: CompositeOperation -> CompositeOperation -> Bool # | |
ToJSVal CompositeOperation Source # | |
Defined in Miso.Canvas Methods toJSVal :: CompositeOperation -> JSM JSVal Source # toJSValListOf :: [CompositeOperation] -> JSM JSVal Source # | |
MakeArgs CompositeOperation Source # | |
Defined in Miso.Canvas |
Constructors
ColorArg Color | |
GradientArg Gradient | |
PatternArg Pattern |
Property
Arguments
:: forall action canvasState. (FromJSVal canvasState, ToJSVal canvasState) | |
=> [Attribute action] | |
-> (DOMRef -> Canvas canvasState) | Init function, takes |
-> (canvasState -> Canvas ()) | Callback to render graphics using this canvas' context, takes init state as arg. |
-> View action |
Element for drawing on a <canvas>. This function abstracts over the context and interpret callback, including dimension ("2d" or "3d") canvas.
Arguments
:: forall action canvasState. (FromJSVal canvasState, ToJSVal canvasState) | |
=> [Attribute action] | |
-> (DOMRef -> JSM canvasState) | Init function, takes |
-> (canvasState -> JSM ()) | Callback to render graphics using this canvas' context, takes init state as arg. |
-> View action |
Another variant of canvas, this is not specialized to ReaderT
. This is
useful when building applications w/ three.js, or other libraries where
explicit context is not necessary.
API
strokeText :: (MisoString, Double, Double) -> Canvas () Source #
createRadialGradient :: (Double, Double, Double, Double, Double, Double) -> Canvas Gradient Source #
lineCap :: LineCapType -> Canvas () Source #
miterLimit :: Double -> Canvas () Source #
shadowBlur :: Double -> Canvas () Source #
shadowColor :: Color -> Canvas () Source #
setImageData :: (ImageData, Int, Double) -> Canvas () Source #
- imageData.data[index
- = 255](https:/www.w3schools.comtags/canvas_imagedata_data.asp)
globalAlpha :: Double -> Canvas () Source #