1.4.0 • Published 10 months ago
mathplotter v1.4.0
MathPlotter
Poor man's Desmos.
Features
- Multiple plots.
- Implicit functions.
- Inequalities.
- Pan & zoom.
- Adaptive sampling.
- Automatic parameters, value & min/max sliders.
- Over 50 functions supported, courtesy of
math.js. - Straightforward API.
Getting started
MathPlotter is distributed as umd package. Load jsxgraphcore.js, math.js and plotter.js:
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/jsxgraph@1.9.2/distrib/jsxgraphcore.min.js.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjs/13.1.1/math.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jsxgraph/1.9.2/jsxgraph.css" />
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/mathplotter/plotter.min.js"></script> Setup HTML:
<div id="plotterElement"></div>Instantiate MathPlotter:
var plotter = new MathPlotter("plotterElement");
plotter.init();Config
Pass config options as a second argument to the constructor of MathPlotter:
var plotter = new MathPlotter("plotterElement", {
// config options
});Instance API
Methods in the following table can be called on the plotter instance from the examples above.
| Function | Description | Call |
|---|---|---|
plot | Plots one or more functions | One:plot("x")'Multiple:plot("a * sin(b * x) + c;a * cos(b * x) + c;tanh(x);(x^2 + y^2 – 1)^3 = x^2 y^3")Param hints:plot([{fn: "a * sin(b * x) + c", pars: [{ name: "a", value: 5 }, { name: "c", value: 1 }]}, {fn: "x + 2"}]) |
save | Saves and downloads the plot in SVG format. | save() |
destroy | Removes all event handlers, destroys elements created by MathPlotter, and frees memory. | destroy() |
Static API
Unlike the methods above, the following methods are called on MathPlotter statically.
| Function | Description | Call |
|---|---|---|
Fire | Creates a headless instance, plots the given expressions, and destroys the instance immediately. Returns SVG screenshot of the plot. | Fire("ln(x)") |
Build
To build plotter.min.js & plotter.css:
npm i & npm run buildTo start the dev server:
npm run devTo release a new version:
npm run release:minor