lichartee/doc/references.md
linarphy 9dc9f1466c
State & License
- Add state interface with jsplot
- Update documentation
- Update License
- Fix issue when no title is set
- Update exemples used in test.js
2024-01-27 06:03:14 +01:00

513 lines
8 KiB
Markdown
Raw Permalink Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

# API Reference
## Manager
A Manager allows to manipulate multiple [Canvas](#canvas) inside a DOM
element
### Manager.parent_element
*property*: **Element**
DOM element containing every canvas Element
### Manager.list_canvas
*property*: **list<Canvas>**
List of [Canvas](#canvas) managed
### Manager.add_canvas
Add a managed canvas
Parameters:
- *width*(optional): **int**
Width in pixel of the canvas Element. Default to 100
- *height*(optional): **int**
Height in pixel of the canvas Element. Default to 100
- *position*(optional): **int**
Position of the added Canvas in the
[parent_element](#manager-parent_element) and in
[list_canvas](#manager-list_canvas). Default to 0
Return:
**Canvas**: the created [Canvas](#canvas)
### Manager.draw
Draw every managed [Canvas](#canvas)
### Manager.remove_canvas
Remove a canvas at a given position
Parameters:
- *position(optional)*: **int**
Position of the canvas to delete. Default to 0
## Canvas
### Canvas.ctx
*property*: **CanvasRenderingContext2D**
API interface of the associated canvas Element
### Canvas.figure
*property*: **Figure**
Figure held
### Canvas.draw
Render the figure to the canvas
## Figure
A figure hold multiple axes. That the object which contains every plot
elements
### Figure.width
*property*: **int**
Width of the figure (related to each axes)
### Figure.height
*property*: **int**
Height of the figure (related to each axes)
### Figure.list_axes
*property*: **list<Axes>**
List of [Axes](#axes).
### Figure.add_axes
Add an [Axes](#axes) to this figure
Parameters:
- *width*(optional): **int**
Relative width of the new [Axes](#axes). Default to 50
- *height*(optional): **int**
Relative height of the new [Axes](#axes). Default to 50
- *position*(optional): **int**
Position of the new [Axes](#axes) in the [list_axes](#figure-list_axes).
Default to 0
Return:
**Axes**: Added [Axes](#axes)
### Figure.remove_axes
Remove an [Axes](#axes) in a given position
Parameters:
- *position*: **int**
Position of the [Axes](#axes) to delete
## Axes
An Axes represents one plot in a [Figure](#figure)
### Axes.width
*property*: **int**
Width of the axes (relative to the [Figure](#figure))
### Axes.height
*property*: **int**
Height of the axes (relative to the [Figure](#figure))
### Axes.title
*property*: **Title**
[Title](#title) of the axes
### Axes.lines
*property*: **list<Line>**
List of lines
### Axes.plot
Plot y versus x as lines and/or markers
Parameters:
- *x*: **list<Number>**
x data
- *y*: **list<Number>**
y data
- *linestyle*(optional): **String**
Style of the line between `solid`, `dotted`, `dashdot`, `dashed` or
empty for no line. Default value to `solid`
- *linecolor*(optional): **String**
Color of the line whith a form like `rgb(x,y,z)`, or `#abcdef` or
a name of a color. Default value to `black`
- *markerstyle*(optional): **String**
Style of the marker for each point between `circle`, `point`, `little`,
`cross` or empty for no marker. Default to `circle`
- *markercolor*(optional): **String**
Color of the marker for each point with the same format than the
*linecolor* option. Default to `black`
- *markersize*(optional): **Number**
Size of the marker for each point in pixel. Default to 5
### Axes.draw
Render the axes to the canvas
Parameters:
- *ctx*: **CanvasRenderingContext2D**
Context of the canvas
- *view*: **2dlist<Number>**
Window were to draw the canvas
## Line
A line, with a color and a line style
### Line.x
*property*: **list<Number>**
xdata
### Line.y
*property*: **list<Number>**
ydata
### Line.linestyle
*property*: **String**
Style of the line between `solid`, `dotted`, `dashdot`, `dashed` or
empty for no line. Default value to `solid`
### Line.linecolor
*property*: **String**
Color of the line whith a form like `rgb(x,y,z)`, or `#abcdef` or
a name of a color. Default value to `black`
### Line.markerstyle
*property*: **String**
Style of the marker for each point between `circle`, `point`, `little`,
`cross` or empty for no marker. Default to `circle`
### Line.markercolor
*property*: **String**
Color of the marker for each point with the same format than
[linecolor](#line-linecolor) property. Default to `black`
### Line.markersize
*property*: **Number**
Size of the marker for each point in pixel. Default to 5
### Line.draw
Draw the line in the box coordinate
Parameters:
- *ctx*: **CanvasRenderingContext2D**
Context of the canvas
- *box*: **list<list<int>>**
Box where to draw the line (absolute dimension)
- *view*: **list<list<Number>>**
Box where to draw the line (in the xdata and ydata scale). It links
absolute coordinate and value.
### Line.drawLine
Draw a line in the given context at the given coordinates
Parameters:
- *ctx*: **CanvasRenderingContext2D**
Context of the canvas
- *x_coordinates*: **1dlist<Number>**
x coordinates
- *y_coordinates*: **1dlist<Number>**
y coordinates
### Line.drawPoints
Draw points in the given context at the given coordinates
Parameters:
- *ctx*: **CanvasRenderingContext2D**
Context of the canvas
- *x_coordinates*: **1dlist<Number>**
x coordinates
- *y_coordinates*: **1dlist<Number>**
y coordinates
## Font
An object representing a font
### Font.size
*property*: **int**
Size of the font (in pixel)
### Font.family
*property*: **String**
"Family" of the font (Times new roman, Lato, etc.)
### Font.color
*property*: **String**
Color of the font with the form `#abcdef`, `rgb(x,y,z)` or a name of a
color
## Title
Title of an axes
### Title.content
*property*: **String**
Content of a title
### Title.font
*property*: **String**
[Font](#Font) of a title
### Title.draw
Draw the title in the given box
Parameters:
- *ctx*: **CanvasRenderingContext2D**
Context of the canvas
- *box*: **2darray<Number>**
Window where to write the title on
Return:
**2darray<Number>**: New window for the plot
## Axis
Axis (x and y) of the axes (not separated xaxis and yaxis)
### Axis.number_x_tick
*property*: **int**
Number of x axis tick
### Axis.number_y_tick
*property*: **int**
Number of y axis tick
### Axis.size_tick
*property*: **int**
Size of each tick
### Axis.margin
*property*: **int**
Size of the margin
### Axis.text_height
*property*: **int**
Height of the text label
### Axis.draw
Draw xaxis and yaxis to canvas
Parameters:
- *ctx*: **CanvasRenderingContext2D**
Context of the canvas
- *box*: **2darray<Number>**
Window where to draw the axis on the canvas
- *view*: **2darray<Number>**
Window where to draw the canvas with real value (in space of plot)
Return:
**2darray<Number>**: New window where to draw the rest of the plot
## jsplot
State-based interface to lichartee. It provides an implicit,
MATLAB-like, way of plotting. Needs a `<main>` node in the html
### jsplot.manager
*property*: **Manager**
[Manager](#manager) currently managed
### jsplot.plot
Plot y versus x as lines and/or markers
Parameters:
- *x*: **list<Number>**
x data
- *y*: **list<Number>**
y data
- *linestyle*(optional): **String**
Style of the line between `solid`, `dotted`, `dashdot`, `dashed` or
empty for no line. Default value to `solid`
- *linecolor*(optional): **String**
Color of the line whith a form like `rgb(x,y,z)`, or `#abcdef` or
a name of a color. Default value to `black`
- *markerstyle*(optional): **String**
Style of the marker for each point between `circle`, `point`, `little`,
`cross` or empty for no marker. Default to `circle`
- *markercolor*(optional): **String**
Color of the marker for each point with the same format than the
*linecolor* option. Default to `black`
- *markersize*(optional): **Number**
Size of the marker for each point in pixel. Default to 5
### jsplot.title
Set a title for the Axes
Parameters:
- *content*: **String**
Text to use for the title
### jsplot.show
Render the current canvas and create a new canvas for a next plot
## get_ext_array
Get max or min of a 1d array of number
Parameters:
- *array*: **list<Number>**
Array where to get max/min values
- *f*: **function**
`Math.max` or `Math.min`
- *sign*: **int**
-1 if max, 1 if min
Return:
**Number**: Max/min value of the 1d array