Loading

line, area, scatter, spline-area, step-area, spline, step, step-after, step-before

NameDefault
--warp-view-chart-label-color#8e8e8e
--warp-view-chart-grid-color#8e8e8e
NameTypeDescription
dataGTS, GTS[], custom dataData to display, numeric GTS only
globalParamsOptionGlobal options (see above) concerning this tile
paramsOption[]List of options (see above) concerning each displayed dataset depending of the index of this array
eventsEvents[]List of events to emit (see below)

Supported option per series are:

  • datasetColor: Hex CSS color of the series. ie: '#fff00f'
  • type: Chart type (line, area, scatter, step-area, spline-area, spline, step, step-after, step-before)
  • xAxis: In case of multi-X axis support, represents the index of related axis.
  • yAxis: In case of multi-Y axis support, represents the index of related axis.
1 4 <% 
  DROP NEWGTS 'g' STORE
  1 30 <% 
    'ts' STORE 
    $g $ts RAND + STU * NOW + NaN NaN NaN RAND ADDVALUE DROP 
  %> FOR
$g %> FOR STACKTOLIST 'data' STORE
{ 
  'data' $data 
  'params' [ 
    { 'datasetColor' '#dc3545' 'xAxis' 0 }
    { 'datasetColor' '#ff9900' 'xAxis' 0 }
    { 'type' 'area' 'datasetColor' '#90d743' 'xAxis' 1 }
    { 'datasetColor' 'white' 'xAxis' 0 }
  ]
}  

Custom data

Custom data for line and scatter only:

<% [ 0 10 <% DROP [ RAND 10 * 5 -   RAND 10 * 5 - ] %> FOR ] %> 'rand' STORE
  {
    'title' 'Test'
    'globalParams' { }
    'data' [
      { 'label' 'A' 'values' @rand }
      { 'label' 'B' 'values' @rand }
    ]
  }

Samples

Simple line chart

<div style="height: 500px">
<discovery-tile url="https://sandbox.senx.io/api/v0/exec" type="line" chart-title="Line chart">
1 4 <% DROP 
  NEWGTS 'g' STORE
  1 10 <% 'ts' STORE 
    $g $ts RAND + STU * NOW + NaN NaN NaN RAND ADDVALUE DROP 
  %> FOR
  $g 
%> FOR
</discovery-tile>
</div>
1 4 <% DROP NEWGTS 'g' STORE 1 10 <% 'ts' STORE $g $ts RAND + STU * NOW + NaN NaN NaN RAND ADDVALUE DROP %> FOR $g %> FOR

Simple area chart

<div style="height: 500px">
<discovery-tile url="https://sandbox.senx.io/api/v0/exec" type="area" chart-title="area chart">
1 4 <% DROP 
  NEWGTS 'g' STORE
  1 10 <% 'ts' STORE 
    $g $ts RAND + STU * NOW + NaN NaN NaN RAND ADDVALUE DROP 
  %> FOR
  $g 
%> FOR
</discovery-tile>
</div>
1 4 <% DROP NEWGTS 'g' STORE 1 10 <% 'ts' STORE $g $ts RAND + STU * NOW + NaN NaN NaN RAND ADDVALUE DROP %> FOR $g %> FOR

Multi Axis charts

<div style="height: 500px">
<discovery-tile url="https://sandbox.senx.io/api/v0/exec" type="area" chart-title="multi Y axis">
    1 4 <% 'i' STORE NEWGTS 'g' STORE
    1 10 <% 'ts' STORE $g $ts RAND + STU * NOW + NaN NaN NaN RAND $i 2 * * ADDVALUE DROP %> FOR
    $g
    %> FOR STACKTOLIST 'data' STORE
    { 'data' $data 'params' [ { 'yAxis' 0 } { 'yAxis' 0 } { 'yAxis' 1 } { 'yAxis' 2 } ] }
</discovery-tile>
</div>
1 4 <% 'i' STORE NEWGTS 'g' STORE 1 10 <% 'ts' STORE $g $ts RAND + STU * NOW + NaN NaN NaN RAND $i 2 * * ADDVALUE DROP %> FOR $g %> FOR STACKTOLIST 'data' STORE { 'data' $data 'params' [ { 'yAxis' 0 } { 'yAxis' 0 } { 'yAxis' 1 } { 'yAxis' 2 } ] }
<div style="height: 500px">
<discovery-tile url="https://sandbox.senx.io/api/v0/exec" type="area" chart-title="multi X axis">
    1 4 <% 'i' STORE NEWGTS 'g' STORE
    1 10 <% 'ts' STORE $g $ts RAND + 1 d * NOW + $i w - NaN NaN NaN RAND $i 2 * * ADDVALUE DROP %> FOR
    $g
    %> FOR STACKTOLIST 'data' STORE
    { 'data' $data 'params' [ { 'xAxis' 0 } { 'xAxis' 1 } { 'xAxis' 1 } { 'xAxis' 2 } ] }
</discovery-tile>
</div>
1 4 <% 'i' STORE NEWGTS 'g' STORE 1 10 <% 'ts' STORE $g $ts RAND + 1 d * NOW + $i w - NaN NaN NaN RAND $i 2 * * ADDVALUE DROP %> FOR $g %> FOR STACKTOLIST 'data' STORE { 'data' $data 'params' [ { 'xAxis' 0 } { 'xAxis' 1 } { 'xAxis' 1 } { 'xAxis' 2 } ] }

Mixed chart

<div style="height: 500px">
<discovery-tile url="https://sandbox.senx.io/api/v0/exec" type="area" chart-title="Mixed chart">
    1 4 <% 'i' STORE NEWGTS 'g' STORE
    1 10 <% 'ts' STORE $g $ts RAND + 1 d * NOW + $i w - NaN NaN NaN RAND $i 2 * * ADDVALUE DROP %> FOR
    $g
    %> FOR STACKTOLIST 'data' STORE
    { 'data' $data 'params' [ { 'xAxis' 0 } { 'xAxis' 1 } { 'xAxis' 1 } { 'xAxis' 2 } ] }
</discovery-tile>
</div>
1 4 <% DROP NEWGTS 'g' STORE 1 10 <% 'ts' STORE $g $ts RAND + STU * NOW + NaN NaN NaN RAND ADDVALUE DROP %> FOR $g %> FOR STACKTOLIST 'data' STORE { 'data' $data 'params' [ { 'type' 'area' } { 'type' 'step' } { 'type' 'line' } { 'type' 'spline-area' } ] }