timjs / elm-collage

Create interactive vector graphics and position them relative to each other
BSD 3-Clause "New" or "Revised" License
58 stars 19 forks source link

Outlined Polygon is not auto-closed #26

Closed timting closed 2 years ago

timting commented 6 years ago

The documentation states that Polygon will auto-close all shapes; however when I was outlining a polygon today, it only traced the line segments which were defined by the list of tuples and didn't auto-close it. I'm new to Elm and Collage - is this expected behavior?

timjs commented 6 years ago

Hi @timting!

Sorry for my slow reaction. Can you send me a small example? The code below works for me:

w = 100

points =
    [ ( 0, 20 )
    , ( -20, 0 )
    , ( 0, -20 )
    , ( w, -20 )
    , ( w + 20, 0 )
    , ( w, 20 )
    ]

shape =
    polygon points
        |> styled
            ( uniform Color.red
            , solid thin (uniform Color.black)
            )
        |> center
timting commented 6 years ago
---- MODEL ----

type alias Model =
    { shape : Collage.Shape
    }

init : ( Model, Cmd Msg )
init =
    ( { shape = Collage.polygon [ ( 15, 15 ), ( 0, 15 ), ( 0, 0 ) ]
      }
    , Cmd.none
    )

---- UPDATE ----

type Msg
    = NoOp

update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
    ( model, Cmd.none )

---- VIEW ----

view : Model -> Html Msg
view model =
    div []
        [ svg (Collage.outlined Collage.defaultLineStyle model.shape)
        ]

---- PROGRAM ----

main : Program Never Model Msg
main =
    Html.program
        { view = view
        , init = init
        , update = update
        , subscriptions = always Sub.none
        }

is what I have. Now that I understand how things work better, I think what is happening is the the svg command is creating too tight a viewbox for the triangle, so it's clipping one edge. This works fine with the svgBox command with a larger box.

Thanks for the reply, and no problem on the delay - life's busy!