Introduction

This article demonstrates how to create an interactive business report with data visualization widgets using Klipse.

Function plots

In this article, we use a plotter named Function Plot.

The probability of prime numbers

In terms of probability, the prime number theorem states that if you pick a natural number x at random, the probability P(x) that that number will be a prime number is about 1 / ln(x). This means that the average gap between consecutive prime numbers among the first x integers is approximately ln(x).

{
  xAxis: {
    type: 'log', 
    domain: [1e6, 1e9]
  },
  yAxis: {
    domain: [0, .1] 
  },
  data: [{
    fn: '1/log(x)'
  }]
}	

Multiple graphs on the same chart

{
  data: [
    { fn: 'x', color: 'pink' },
    { fn: '-x' },
    { fn: 'x * x' },
    { fn: 'x * x * x' },
    { fn: 'x * x * x * x' }
  ]
}

Integrals

{
  xAxis: {
    type: 'log',
    domain: [0.01, 1]
  },
  yAxis: {
    domain: [-100, 100] 
  },
  grid: true,
  data: [{
    fn: '1/x * cos(1/x)',
    // to make it look like a definite integral
    closed: true
  }]
}

Derivative

if updateOnMouseMove is set to true then tangent line is computed whenever the mouse is moved inside the canvas (let x0x0 be the mouse’s abscissa then the tangent line to the point (x0,f(x0))(x0,f(x0)) is computed whenever the position of the mouse changes)

{
  yAxis: {domain: [-1, 9]},
  data: [{
    fn: 'x^2',
    derivative: {
      fn: '2 * x',
      updateOnMouseMove: true
    }
  }]
}