NoRedInk / elm-plot-rouge / Svg.Coordinates

Disclaimer: If you're looking for a plotting library, then please use elm-plot instead, as this library is not made to be user friendly. If you feel like you're missing something in elm-plot, you're welcome to open an issue in the repo and I'll see what I can do to accommodate your needs!


This module contains helpers for cartesian/SVG coordinate translation.

Plane


type alias Plane =
{ x : Axis
, y : Axis 
}

The properties of your plane.


type alias Axis =
{ marginLower : Basics.Float
, marginUpper : Basics.Float
, length : Basics.Float
, min : Basics.Float
, max : Basics.Float 
}

The axis of the plane.

Plane from data

You may want to produce a plane which fits all your data. For that you need to find the minimum and maximum values withing your data in order to calculate the domain and range.

minimum : (a -> Basics.Float) -> List a -> Basics.Float

Helper to extract the minimum value amongst your coordinates.

Cartesian to SVG

toSVGX : Plane -> Basics.Float -> Basics.Float

Translate a SVG x-coordinate to its cartesian x-coordinate.

toSVGY : Plane -> Basics.Float -> Basics.Float

Translate a SVG y-coordinate to its cartesian y-coordinate.

scaleSVG : Axis -> Basics.Float -> Basics.Float

For scaling a cartesian value to a SVG value. Note that this will not return a coordinate on the plane, but the scaled value.

SVG to cartesian

toCartesianX : Plane -> Basics.Float -> Basics.Float

Translate a cartesian x-coordinate to its SVG x-coordinate.

toCartesianY : Plane -> Basics.Float -> Basics.Float

Translate a cartesian y-coordinate to its SVG y-coordinate.

scaleCartesian : Axis -> Basics.Float -> Basics.Float

For scaling a SVG value to a cartesian value. Note that this will not return a coordinate on the plane, but the scaled value.

Helpers


type alias Point =
{ x : Basics.Float, y : Basics.Float }

Representation of a point in your plane.

place : Plane -> Point -> Svg.Attribute msg

A transform translate(x, y) SVG attribute. Beware that using this and and another transform attribute on the same node, will overwrite the first. If that's the case, just make one yourself:

myTransformAttribute : Svg.Attribute msg
myTransformAttribute =
    transform <|
        "translate("
            ++ String.fromFloat (toSVGX plane x)
            ++ ","
            ++ String.fromFloat (toSVGY plane y)
            ++ ") "
            ++ "rotateX("
            ++ whatever
            ++ ")"

placeWithOffset : Plane -> Point -> Basics.Float -> Basics.Float -> Svg.Attribute msg

Place at coordinate, but you may add a SVG offset. See place above for important notes.