Create Documentation

[EriKWDev]

Todo

• Add docs page
• Add comments with runnable examples to common functions
• Add docstrings to files
• Add more comprehensive and explained examples
• Document coordinate system

[EriKWDev]

I wrote an initial explanation of the coordinate system in #16 (#16 (comment)):

The Coordinate System of Nanim

The coordinate system of Nanim is a bit "weird", but it is intentional and has its logic. I have not yet documented it, so here's a start:

No matter what size of canvas you use, coordinates will always map from 0 to 1000 in a square with 500, 500 in the center. If the canvas is not a perfect square, (500, 500) will still remain the center of the canvas, and unit "1000" will represent pixel position min(width, height) + offset as in the picture below:

The reason I did this was that I usually render videos at many different resolutions and want them all to "look the same" - even if the ratio changes!

Here is an example:

import nanim

proc myScene(): Scene =
  let
    scene = newScene()
    square = newSquare(1000) # Fills the height/width of the inner square, no matter canvas size

  square.moveTo(500, 500) # Puts square in center, no matter the canvas  size

  square.stroke(newColor("#db235d"), 10)
  square.fill(newColor("#00000000"))

  scene.add(square)

  return scene

when isMainModule:
  render(myScene)

Notice now, when I resize the canvas (either by dragging the window or by passing --height:XX, --width:XX and/or --ratio:XX), the square will always fill the smallest of the width and the height and remain in the center:

This all stems from the fact that I scale the canvas using this function:

nanim/src/nanim/core.nim

Line 361 in eb03959

proc scaleToUnit(scene: Scene, fraction: float = 1000f, compensate: bool = true) =

I should probably both document this behaviour and also add an option to use exact pixels as unit instead.