- Add state interface with jsplot - Update documentation - Update License - Fix issue when no title is set - Update exemples used in test.js
8 KiB
API Reference
Manager
A Manager allows to manipulate multiple Canvas inside a DOM element
Manager.parent_element
property: Element
DOM element containing every canvas Element
Manager.list_canvas
property: list
List of 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 and in list_canvas. Default to 0
Return:
Canvas: the created Canvas
Manager.draw
Draw every managed 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
List of Axes.
Figure.add_axes
Add an Axes to this figure
Parameters:
- width(optional): int
Relative width of the new Axes. Default to 50
- height(optional): int
Relative height of the new Axes. Default to 50
- position(optional): int
Position of the new Axes in the list_axes. Default to 0
Return:
Axes: Added Axes
Figure.remove_axes
Remove an Axes in a given position
Parameters:
- position: int
Position of the Axes to delete
Axes
An Axes represents one plot in a Figure
Axes.width
property: int
Width of the axes (relative to the Figure)
Axes.height
property: int
Height of the axes (relative to the Figure)
Axes.title
property: Title
Title of the axes
Axes.lines
property: list
List of lines
Axes.plot
Plot y versus x as lines and/or markers
Parameters:
- x: list
x data
- y: list
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
Window were to draw the canvas
Line
A line, with a color and a line style
Line.x
property: list
xdata
Line.y
property: list
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 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>
Box where to draw the line (absolute dimension)
- view: list<list>
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
x coordinates
- y_coordinates: 1dlist
y coordinates
Line.drawPoints
Draw points in the given context at the given coordinates
Parameters:
- ctx: CanvasRenderingContext2D
Context of the canvas
- x_coordinates: 1dlist
x coordinates
- y_coordinates: 1dlist
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 of a title
### Title.draw
Draw the title in the given box
Parameters:
- ctx: CanvasRenderingContext2D
Context of the canvas
- box: 2darray
Window where to write the title on
Return:
2darray: 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
Window where to draw the axis on the canvas
- view: 2darray
Window where to draw the canvas with real value (in space of plot)
Return:
2darray: 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 currently managed
jsplot.plot
Plot y versus x as lines and/or markers
Parameters:
- x: list
x data
- y: list
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
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