About

jQuery-Library for inline graphs like heatmap, pie, and boolean representation

Examples

• 60
  {"color": ["green"], "type": "angle"}
• 14
  {"color": ["green"], "fullAngle": "24", "type": "angle"}
• 8
  {"borderColor": "black", "originInnerRadius": "0.5", "direction": "-1", "innerBorderRadius": "0.5", "originWidth": "1", "color": ["green", "red"], "innerRadius": "0.5", "innerBorderColor": "black", "pointerColor": "black", "fullAngle": "20", "borderWidth": "1", "pointerInnerRadius": "0", "rotation": "-90", "originIsColor": "true", "type": "angle", "innerBorderWidth": "1", "pointerWidth": "1"}
• 1
  {"color": ["green", "red", "yellow"], "borderColor": "gray", "type": "bool", "borderWidth": "2"}
• 1
  {"color": ["red", "green", "yellow"], "borderColor": "gray", "type": "bool", "borderWidth": "3"}
• 0.5
  {"rotation": "45", "type": "bool"}
• 10
  {"pointerColor": "gray", "max": "100", "type": "heat", "pointerWidth": "2", "min": "-100"}

Create your own graph

• value
  options

Representation of values with different graphtypes

• -30

  -15

  0

  15

  30
  heat
• 1,2,3

  6,5,4,3,2,1
  pie
• -1

  -0.5

  0

  0.3

  0.6

  1
  bool
• 0

  90

  60

  420

  -300
  angle

General options

• heat

  pie

  bool

  angle
  type
• warn
  interception
• blue

  red

  yellow
  interceptionColor
• 16,10

  10,16

  10,10
  width and height
• ['blue', 'orange', 'red']
  color
• 1

  3

  5
  borderWidth
• blue

  green

  red
  borderColor
• -90

  180

  0
  rotation

Options for heat

• 0

  1

  2

  3

  4
  pointerWidth
• blue

  red

  yellow

  black
  pointerColor
• 0,10

  -10,10

  -1,1
  min and max (value: 5)

Options for angle

• 360

  100

  24

  2*pi
  fullAngle (value: 5)
• 0

  0.5

  0.8

  1
  innerRadius
• black

  red

  yellow
  innerBorderColor
• 0

  1

  2
  innerBorderWidth
• 0

  0.5

  0.7

  1
  innerBorderRadius
• blue

  red

  yellow

  none
  originColor
• true

  false

  true

  false
  originIsColor
• 0

  1

  2

  3
  originWidth
• 0

  0.5

  0.7

  0.9
  originInnerRadius
• blue

  red

  yellow

  none
  pointerColor
• true

  false

  true

  false
  pointerIsColor
• 0

  1

  2

  3
  pointerWidth
• 0

  0.5

  0.7

  0.9
  pointerInnerRadius
• 1

  -1

  1

  -1
  direction (values: 60, 60, -60, -60)