linarphy/lichartee
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add doc in code

Browse source
This commit is contained in:
linarphy 2023-12-31 00:21:46 +01:00
parent 48edd1e20b
commit a244af4182
No known key found for this signature in database
GPG key ID: 0610ABB68DAA7B65
1 changed files with 134 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

149
lichartee.js
View file

@ -1,5 +1,19 @@
/**
* a manager allows to manipulate multiple canvas
*
* it's different from matplotlib, where the manager can only store one
* canvas
*
* @property Element parent_element DOM element containing every canvas
* of this manager
* @property 1darray<Canvas> list_canvas List of canvas held by this
* manager
*/
class Manager
{
/**
* @param Element parent_element Element holding the canvas
*/
constructor(parent_element)
{
this.parent_element = parent_element;
@ -41,6 +55,9 @@ class Manager
return canvas;
}
/**
* draw every canvas
*/
draw()
{
for (const index in this.list_canvas)
@ -49,6 +66,11 @@ class Manager
}
}
/**
* remove a canvas
*
* @param int position Position of the canvas to remove
*/
remove_canvas(position = 0)
{
document.removeChild(this.list_canvas[position].ctx.canvas);
@ -56,14 +78,27 @@ class Manager
}
}
/**
* a canvas allows to render a figure
*
* @property CanvasRenderingContext2D ctx Canvas API interface
* @property Figure figure Figure held by this canvas
*/
class Canvas
{
/**
* @param CanvasRenderingContext2D ctx Canvas API interface
* @param Figure figure Figure held by this canvas
*/
constructor(ctx, figure)
{
this.ctx = ctx ;
this.figure = figure;
}
/**
* render the figure to the canvas
*/
draw()
{
if (this.figure instanceof Figure.constructor)
@ -132,6 +167,15 @@ class Canvas
}
}
/**
* a figure hold axes and every plot elements
*
* @property int width Total width of this figure (related to each
* axes)
* @property int height Total height of this figure (related to each
* axes)
* @property 1darray<Axes> list_axes List of every axes
*/
class Figure
{
constructor()
@ -141,6 +185,13 @@ class Figure
this.list_axes = [];
}
/**
* add axes to this figure
*
* @param int relative_width Relative width of the new axes
* @param int relative_height Relative height of the new axes
* @param int position Position of the axes in the figure
*/
add_axes(relative_width = 50, relative_height = 50, position = 0)
{
this.width += relative_width ;
@ -150,49 +201,110 @@ class Figure
return axes;
}
/**
* remove an axes
*
* @param int position Position of the axes in the figure to delete
*/
remove_axes(position)
{
this.list_axes.splice(position, 1);
}
}
/**
* an axes represents one plot in a figure.
*
* @property int width Width of the axes
* @property int height Height of the axes
* @property String title Title of the axes
* @property 1darray<Line> lines List of lines
*/
class Axes
{
/**
* @param int width Width of the axes
* @param int height Height of the axes
* @param String title Title of the axes
*/
constructor(
width = 100 ,
height = 100 ,
position = 0 ,
title = '' ,
)
{
this.width = width ;
this.height = height ;
this.position = position;
this.title = title ;
this.lines = [] ;
}
plot(x, y, linestyle = undefined, label = '')
/**
* plot y versus x as lines
*
* @param 1darray<Number> x x data
* @param 1darray<Number> y y data
* @param object linestyle Object defining a style for a line. The
* structure of the object should be:
* {
* color: color
* style: style
* }
* where color is a string containing
* "rgb(x,y,z)", "#abcdef" or a name of
* a color, and style is "solid", "dotted",
* "dashdot" or "dashed". Default value is
* color = "black" and style = "solid"
* @param String label Label that will be displayed in the legend
*/
plot(x, y, linestyle = {color: "black", style: "solid"}, label = '')
{
if (linestyle === undefined)
{
linestyle = {
color: 'rgb(0,0,0)',
style: 'solid'
};
}
let line = new Line(x, y, linestyle, label);
this.lines.push(line);
}
}
/**
* a line, with a color and a line style
*
* @property 1darray<float> x xdata
* @property 1darray<float> y ydata
* @property object linestyle Object defining a style for a line. The
* structure of the object should be:
* {
* color: color
* style: style
* }
* where color is a string containing
* "rgb(x,y,z)", "#abcdef" or a name of
* a color, and style is "solid", "dotted",
* "dashdot" or "dashed". Default value is
* color = "black" and style = "solid"
* @property String label Label that will be displayed in the legend
*/
class Line
{
/**
* @param 1darray<float> x xdata
* @param 1darray<float> y ydata
* @param object linestyle Object defining a style for a line. The
* structure of the object should be:
* {
* color: color
* style: style
* }
* where color is a string containing
* "rgb(x,y,z)", "#abcdef" or a name of
* a color, and style is "solid", "dotted",
* "dashdot" or "dashed". Default value is
* color = "black" and style = "solid"
* @param String label Label that will be displayed in the legend
*/
constructor(
x ,
y ,
linestyle = undefined ,
label = ''
x ,
y ,
linestyle = {color: "black", style: "solid"},
label = ''
)
{
this.x = x ;
@ -204,7 +316,7 @@ class Line
/**
* draw the line in the box coordinate
*
* @param ctx ctx Context of the canvas
* @param CanvasRenderingContext2d ctx Context of the canvas
* @param 2dlist<int> box Box where to draw the line
* @param 2dlist<float> view Scale of the box (link value <->
* coordinate
@ -271,6 +383,13 @@ class Line
}
}
/**
* get max or min of a 1d array of number
*
* @param 1darray<number> array Array where to get max values
* @param function f Math.max or Math.min if we want max or min value
* @param int sign -1 if max, 1 if min
*/
function get_ext_array(array, f = Math.max, sign = -1)
{
return array.reduce(