Home

Awesome

image

<p align="center"> <a href="https://npmjs.org/package/function-plot"> <img src="https://img.shields.io/npm/v/function-plot.svg?style=flat" alt="NPM"> </a> <a href="https://app.fossa.com/projects/git%2Bgithub.com%2Fmauriciopoppe%2Ffunction-plot?ref=badge_shield" alt="FOSSA Status"><img src="https://app.fossa.com/api/projects/git%2Bgithub.com%2Fmauriciopoppe%2Ffunction-plot.svg?type=shield"/></a> <a href="https://github.com/feross/standard"> <img src="https://img.shields.io/badge/code%20style-standard-blue" alt="js-standard-style"> </a> </p>

function-plot is a powerful library built on top of <a href="http://d3js.org/">D3.js</a> whose purpose is to render functions with little configuration, think of it as a little clone of Google's plotting utility: y = x * x

The library currently supports interactive line charts and scatterplots, whenever the graph scale is modified the function is evaluated again with the new bounds, result: infinite graphs!

Edit function-plot

image,

Thanks to @liuyao12 for the initial version of the Observable notebook, you can check his own version here https://beta.observablehq.com/@liuyao12/function-plot

Installation

npm install function-plot

Usage

import functionPlot from 'function-plot'
functionPlot({
  target: '#root',
  data: [
    {
      fn: 'x^2',
      derivative: {
        fn: '2*x',
        updateOnMouseMove: true
      }
    }
  ]
})

Resources

License

2015-2023 MIT © Mauricio Poppe

FOSSA Status