Skip to content

Latest commit

 

History

14 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Charts — a simple Desmos-style graphing calculator

Open-source, single-page graphing calculator. Type expressions on the left, they graph instantly on the right — with real typeset math input (stacked fractions, superscript exponents) powered by MathQuill.

Run it: open index.html in a browser (or serve the folder with any static server). Needs internet for the CDN assets (MathQuill, fonts).

What you can type

Input Result
y = 2x + 3, x^2, f(x) = ... function graphs
1/2 true stacked fraction, parsed as ½
(2, 3) a point — drag it on the graph
x = 4, 2x = 6, x + y = 4, 2y = x solved automatically (vertical lines, implicit lines)
y < 2x + 1, x + y ≤ 4, x > 3 shaded inequality regions (dashed = strict)
a = 1 a slider — use a in any other line
y = |x - 2|, sqrt, pi, e absolute value, roots, constants
trig & more sin cos tan · sec csc cot · asin acos atan · sinh cosh tanh · ln log exp · floor ceil round · min max abs

Features

  • Typeset math editing (MathQuill — the engine Desmos uses): / builds a live stacked fraction, ^ a real exponent, * shows as ·, <= as
  • Drag to reshape: lines and parabolas get handles (rotate a line around a point, drag a parabola's vertex or curvature) — the equation rewrites live in the list
  • Rise over run: animated slope walk when a line is plotted; a labeled slope triangle appears while adjusting handles
  • Smart tracing: press and drag along any curve to read coordinates; the dot snaps to intersections, roots and intercepts
  • Snap control (top bar): snap dragged points to Off / ½ / 1 / 2 grid steps
  • Math keyboard (⌨): every available symbol and function, one click to insert
  • Whole-unit grid: squares are always whole numbers — zooming never subdivides into confusing fractional squares
  • 40+ color themes, per-line colors, hide/show, autosave to localStorage

Files

  • index.html — page + math keyboard + help
  • calc.js — everything: parser, canvas renderer, interactions
  • style.css — UI styles
  • theme.css — the theme palette definitions (body.theme-* CSS variables)

About

Web app that allows you to plot your linear/quadratic equations and get a visual result.

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages