From d26f7778ba426b96125c14b5477fcbc16cd20175 Mon Sep 17 00:00:00 2001 From: Nathan McRae Date: Fri, 15 Aug 2025 20:54:21 -0700 Subject: [PATCH] Fix text styling and rotation Had the units wrong --- src/TernaryGraph.purs | 19 +++++++++++-------- 1 file changed, 11 insertions(+), 8 deletions(-) diff --git a/src/TernaryGraph.purs b/src/TernaryGraph.purs index 43cc1ef..41ccdd2 100644 --- a/src/TernaryGraph.purs +++ b/src/TernaryGraph.purs @@ -88,12 +88,12 @@ svgLine { start: {x: x1, y: y1}, end: {x: x2, y: y2} } = svgText :: String -> Point -> Number -> TextStyle -> Dimension -> XMLFragment svgText text { x: x, y: y } angle style dimension = - XMLFragment $ " (toString style.sizePx) <> "px;line-height:131%;font-family:'" <> style.typeface <> "';font-variant-position:super;fill:#000000;stroke:#000000;stroke-width:0.0999998;stroke-linecap:round;stop-color:#000000;fill-opacity:1\" " - <> "transform=\"translate(" <> (toString centerX) <> ", " <> (toString centerY) <> ") rotate(" <> (toString angle) <> ")\">" <> text <> "" + XMLFragment $ " (toString style.sizePx) <> "px;line-height:131%;font-family:'" <> style.typeface <> "';fill:#000000;stroke:#000000;stroke-width:0.0999998;stroke-linecap:round;stop-color:#000000;fill-opacity:1\" " + <> "transform=\"translate(" <> (toString centerX) <> ", " <> (toString centerY) <> ") rotate(" <> (toString (angle * 180.0 / pi)) <> ")\">" <> text <> "" where - -- TODO: why /4? this also was needed in python implementation - centerX = x - dimension.widthPx / 4.0 - centerY = y - dimension.heightPx / 4.0 + offset = rotate angle {x: dimension.widthPx, y: dimension.heightPx} + centerX = x - offset.x / 2.0 + centerY = y - offset.y / 2.0 -- TODO: Make axis tick size a parameter getTick :: Number -> Int -> Int -> Line @@ -170,18 +170,21 @@ ternaryGraph scale xOffset yOffset definition textDimensions = result axis2TitleDim = Map.lookup (Tup.Tuple definition.axis2Label definition.axisTitleTextStyle) textDimensions axis3TitleDim = Map.lookup (Tup.Tuple definition.axis3Label definition.axisTitleTextStyle) textDimensions + axis1TitlePos = {x: 0.0, y: 0.9} + axis2TitlePos = rotate (2.0 * pi / 3.0) axis1TitlePos + axis3TitlePos = rotate (-2.0 * pi / 3.0) axis1TitlePos axisTitleSize = definition.axisTitleTextStyle.sizePx axisTitlesSvg :: Array (Either.Either String XMLFragment) axisTitlesSvg = [ case axis1TitleDim of Maybe.Nothing -> Either.Left ("Failed to find '" <> definition.axis1Label <> "' in dimensions map") - Maybe.Just dim -> Either.Right $ svgText definition.axis1Label (transform scale xOffset yOffset {x: 0.0, y: 0.9}) 0.0 definition.axisTitleTextStyle dim, + Maybe.Just dim -> Either.Right $ svgText definition.axis1Label (transform scale xOffset yOffset axis1TitlePos) 0.0 definition.axisTitleTextStyle dim, case axis2TitleDim of Maybe.Nothing -> Either.Left ("Failed to find '" <> definition.axis2Label <> "' in dimensions map") - Maybe.Just dim -> Either.Right $ svgText definition.axis2Label (transform scale xOffset yOffset {x: -(sin (2.0 * pi / 3.0)), y: -0.7}) (-60.0) definition.axisTitleTextStyle dim, + Maybe.Just dim -> Either.Right $ svgText definition.axis2Label (transform scale xOffset yOffset axis2TitlePos) (-pi / 3.0) definition.axisTitleTextStyle dim, case axis3TitleDim of Maybe.Nothing -> Either.Left ("Failed to find '" <> definition.axis3Label <> "' in dimensions map") - Maybe.Just dim -> Either.Right $ svgText definition.axis3Label (transform scale xOffset yOffset {x: (sin (2.8 * pi / 3.0)), y: -0.7}) 60.0 definition.axisTitleTextStyle dim + Maybe.Just dim -> Either.Right $ svgText definition.axis3Label (transform scale xOffset yOffset axis3TitlePos) (pi / 3.0) definition.axisTitleTextStyle dim ] axisTickStarts = map (\line -> line.start)