Element: <oj-c-picto-chart-item>

CORE PACK

Oracle® JavaScript Extension Toolkit (JET)
21.0.0
G39657-01

Since:
  • 20.0.0
Module:
  • picto-chart-item

QuickNav

Attributes


JET PictoChart Item

The oj-c-picto-chart-item element is used to declare properties for picto chart items and is only valid as the child of a template element for the itemTemplate slot of oj-c-picto-chart.

 
 <oj-c-picto-chart data='[[dataProvider]]'>
  <template slot='itemTemplate' data-oj-as='item'>
    <oj-c-picto-chart-item  count='[[item.data.count]]' name='[[item.data.name]]' ></oj-c-picto-chart-item>
  </template>
 </oj-c-picto-chart>


Usage

Signature:

interface CPictoChartItemElement

Typescript Import Format
//To typecheck the element APIs, import as below.
import { CPictoChartItemElement } from "oj-c/picto-chart-item";

//For the transpiled javascript to load the element's module, import as below
import "oj-c/picto-chart-item";

For additional information visit:


Attributes

border-color :string

The border color of the item. Does not apply if custom image is specified.

border-style :"dashed"|"solid"

The border style of the item. Does not apply if custom image is specified.

border-width :number

The border width of the item. Does not apply if custom image is specified.

categories :Array<string>

An array of category strings corresponding to the picto chart items. This allows highlighting and filtering of items.
Default Value:
  • '[]'

color :string

The color of the item. Does not apply if custom image is specified.

column-span :string

The number of columns each shape (or custom image) spans. Used for creating a picto chart with mixed item sizes.

count :string

Specifies the number of times that the shape (or custom image) is drawn.

drilling :"off"|"inherit"|"on"

Whether drilling is enabled on the item. Drillable items will show a pointer cursor on hover and fire an ojDrill event on click (double click if selection is enabled). To enable drilling for all items at once, use the drilling attribute in the top level.
Default Value:
  • 'inherit'

name :string

The name of the item. Used for default tooltip and accessibility.

row-span :string

The number of rows each shape (or custom image) spans. Used for creating a picto chart with mixed item sizes.

shape :"none"|"square"|"circle"|"diamond"|"human"|"plus"|"star"|"triangleDown"|"triangleUp"|"rectangle"

The shape of the item. Can take the name of a built-in shape or the SVG path commands for a custom shape. "None" will make the item transparent and can be used to create gaps. Does not apply if custom image is specified.
Default Value:
  • 'rectangle'

short-desc :string

The description of the item. This is used for customizing the tooltip text.

source :string

The URI of the custom image. If specified, it takes precedence over shape.

source-hover :string

The optional URI for the hover state. If not specified, the source image will be used.

source-hover-selected :string

The optional URI for the hover selected state. If not specified, the source image will be used.

source-selected :string

The optional URI for the selected state. If not specified, the source image will be used.