warp view bar

Bar chart

type = bar

Vertical bar chart:

Stacked Horizontal bar chart:

Stacked horizontal bar chart with custom data:

CSS vars

• Tooltip
  • --warp-view-chart-legend-bg
  • --warp-view-chart-legend-color
• Size
  • --warp-view-chart-width
  • --warp-view-chart-height
• Colors
  • --warp-view-chart-grid-color
  • --warp-view-font-color

Specific attributes

See common attributes

Events

See common events

Data format

GTS, GTS array or complex data.

It could also be a specific format for custom data:

{
  "title": "Test",
  "columns":  [ "A", "B", "C", "D" ],
  "rows": [
    [ "label X", 15, 56, 44, 22 ],
    [ "label Y", 1, 5, 4, 2 ],
    [ "label Z", 14, 45, 78, 12 ]
  ]
}

Specific complex data params

See common params

Specific options and globalParams

See common options

Name	Type	Default	Description
timeMode	string	'date'	date, timestamp
horizontal	boolean	false	Either an horizontal or vertical bar chart
stacked	boolean	false	Stacked bar chart

Sample

<warpview-tile
          url="https://warp.senx.io/api/v0/exec"
          responsive="true"
          type="bar">
0 2 <% 'j' STORE
    NEWGTS 'series' $j TOSTRING + RENAME 'gts' STORE
    0 10 <%
        'i' STORE
        $gts NOW $i STU * + RAND RAND RAND 1000.0 * RAND ADDVALUE DROP
    %> FOR
    $gts
%> FOR
</warpview-tile>