Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
199 changes: 132 additions & 67 deletions _data/components/discretebarchart.yml
Original file line number Diff line number Diff line change
@@ -1,73 +1,138 @@
directive : "o-chart"
directive: "o-chart"
chart: true

apiTitle: "OChartComponent"

inheritedAttributes: [{
component: "OChartComponent",
path: "addons/charts/overview/api",
attributes: ["chart-height", "chart-width", "type", "x-axis", "y-axis", "x-label", "y-label", "x-data-type", "y-data-type", "data", "chart-parameters"]
}]
inheritedAttributes:
[
{
component: "OChartComponent",
path: "addons/charts/overview/api",
attributes:
[
"chart-height",
"chart-width",
"type",
"x-axis",
"y-axis",
"x-label",
"y-label",
"x-data-type",
"y-data-type",
"data",
"chart-parameters",
"show-legend",
"legend-position",
"legend-title",
"show-grid-lines",
"color",
"show-tooltip",
"show-data-label",
"show-x-axis",
"show-y-axis",
"show-x-axis-label",
"show-y-axis-label",
"x-formatting",
"y-formatting",
"auto-scale",
"gradient",
"active-entries",
"custom-colors",
],
},
]

attributes: [
{
name: "showValues",
description: "Type of chart",
type: "boolean",
default: "true"
},{
name: "duration",
description: "Duration in ms to take when updating chart. For things like bar charts, each bar can animate by itself but the total time taken should be this value.",
type: "number",
default: 500
},{
name: "showLegend",
description: "Show or not legend",
type: "boolean",
default: "false"
},{
name: "staggerLabels",
description: "Makes the X labels stagger at different distances from the axis so they're less likely to overlap.",
type: "boolean",
default: false
},{
name: "rotateLabels",
description: "Rotates the X axis labels by the specified degree.",
type: "number",
default: 0
},{
name: "wrapLabels",
description: "Splits long X labels by new lines in order to prevent overlapping.",
type: "boolean",
default: "true"
},{
name: "showXAxis",
description: "Display or hide the X axis",
type: "boolean",
default: "true"
},{
name: "showYAxis",
description: "Display or hide the Y axis",
type: "boolean",
default: "true"
},{
name: "rightAlignYAxis",
description: "When only one Y axis is used, this puts the Y axis on the right side instead of the left.",
type: "boolean",
default: "false"
},{
name: "margin",
description: "Object containing the margins for the chart or component. You can specify only certain margins in the object to change just those parts.",
type: "object",
default: ""
},{
name: "agroup",
type: "boolean",
default: false
}]
attributes:
[
{
name: "scheme-type",
description: "Defines the color scale type used by the chart. Allowed values are 'ordinal' and 'linear'.",
type: "string",
default: "ordinal",
},
{
name: "animations",
description: "Enables or disables chart animations.",
type: "boolean",
default: true,
},
{
name: "round-domains",
description: "Rounds axis domains to align grid lines evenly.",
type: "boolean",
default: false,
},
{
name: "trim-x-axis-ticks",
description: "Controls whether X axis tick labels are trimmed when exceeding the maximum length.",
type: "boolean",
default: true,
},
{
name: "trim-y-axis-ticks",
description: "Controls whether Y axis tick labels are trimmed when exceeding the maximum length.",
type: "boolean",
default: true,
},
{
name: "rotate-x-axis-ticks",
description: "Enables automatic rotation of X axis tick labels to prevent overlapping.",
type: "boolean",
default: true,
},
{
name: "max-x-axis-tick-length",
description: "Maximum length of X axis tick labels when trimming is enabled.",
type: "number",
default: 16,
},
{
name: "max-y-axis-tick-length",
description: "Maximum length of Y axis tick labels when trimming is enabled.",
type: "number",
default: 16,
},
{
name: "wrap-ticks",
description: "Allows axis tick labels to wrap into multiple lines based on available space.",
type: "boolean",
default: false,
},
{
name: "no-bar-when-zero",
description: "Prevents rendering bars when their value is zero.",
type: "boolean",
default: true,
},
{
name: "round-edges",
description: "Renders bars with rounded edges.",
type: "boolean",
default: true,
},
{
name: "bar-padding",
description: "Defines the spacing in pixels between bars.",
type: "number",
default: 8,
},
{
name: "y-scale-min",
description: "Defines the minimum value of the Y axis.",
type: "number",
},
{
name: "y-scale-max",
description: "Defines the maximum value of the Y axis.",
type: "number",
},
]

inheritedOutputs: [{
component: "ChartComponent",
path: "charts/overview",
outputs: ["onDoubleTap", "onPinch", "onPress", "onRotate", "onSwipe", "onTap"]
}]
inheritedOutputs:
[
{
component: "ChartComponent",
path: "addons/charts/overview/api",
outputs: ["onSelect", "onActivate", "onDeactivate", "onDataLoaded"],
},
]
178 changes: 91 additions & 87 deletions _data/components/donutchart.yml
Original file line number Diff line number Diff line change
@@ -1,93 +1,97 @@
directive : "o-chart"
directive: "o-chart"
chart: true

apiTitle: "OChartComponent"

inheritedAttributes: [{
component: "OChartComponent",
path: "addons/charts/overview/api",
attributes: ["chart-height", "chart-width", "type", "x-axis", "y-axis", "x-label", "y-label", "x-data-type", "y-data-type", "data", "chart-parameters"]
}]
inheritedAttributes:
[
{
component: "OChartComponent",
path: "addons/charts/overview/api",
attributes:
[
"chart-height",
"chart-width",
"type",
"x-axis",
"y-axis",
"x-label",
"y-label",
"x-data-type",
"y-data-type",
"data",
"chart-parameters",
"show-legend",
"legend-position",
"legend-title",
"show-grid-lines",
"color",
"show-tooltip",
"show-data-label",
"show-x-axis",
"show-y-axis",
"show-x-axis-label",
"show-y-axis-label",
"x-formatting",
"y-formatting",
"auto-scale",
"gradient",
"active-entries",
"custom-colors"
],
},
]

attributes: [{
name: "showLegend",
description: "Whether to display the legend or not",
type: "boolean",
default: "true"
},{
name: "legendPosition",
description: "Position of the legend (top, right, bottom)",
type: "string",
default: "top"
},{
name: "duration",
description: "Duration in ms to take when updating chart. For things like bar charts, each bar can animate by itself but the total time taken should be this value.",
type: "number",
default: 500
},{
name: "donutRatio",
description: "Percent of pie radius to cut out of the middle to make the donut. It is multiplied by the outer radius to calculate the inner radius, thus it should be between 0 and 1.",
type: "number",
default: 0.35
},{
name: "cornerRadius",
description: "Corner radius of donut slices",
type: "number",
default: 0
},{
name: "showLabels",
description: "Display donut labels",
type: "boolean",
default: "true"
},{
name: "labelType",
description: "Type of data shown in the label (key, value, percent)",
type: "string",
default: 0
},{
name: "labelThreshold",
description: "Configure the minimum slice size for labels to show up",
type: "number",
default: 0.01
},{
name: "labelSunbeamLayout",
description: "Enable or disable Sunbeam layout for labels",
type: "boolean",
default: "true"
},{
name: "labelsOutside",
description: "Whether donut chart labels should be outside the slices instead of inside them",
type: "boolean",
default: "false"
},{
name: "color",
description: "Colors to use for the different data.",
type: "string[]"
},{
name: "valueType",
description: "Formats value(s)",
type: "string"
},{
name: "showTooltip",
description: "Enable or disable the tooltip",
type: "boolean",
default: true
},{
name: "startAngle",
description: "Function used to manage the starting angle of the donut chart",
type: "function"
},{
name: "endAngle",
description: "Function used to manage the ending angle of the donut chart",
type: "function"
},{
name: "colorData",
description: "List of colors for each value in the Y axis of the chart",
type: "OColorData[] = { value: string, color: string }"
}]
attributes:
[
{
name: "show-labels",
description: "Controls whether labels are displayed on chart slices.",
type: "boolean",
default: false,
},
{
name: "label-formatting",
description: "Defines a formatting function used to customize the text displayed in slice labels.",
type: "function",
},
{
name: "trim-labels",
description: "Controls whether slice labels are trimmed when they exceed the maximum label length.",
type: "boolean",
default: true,
},
{
name: "max-label-length",
description: "Maximum length of slice labels when label trimming is enabled.",
type: "number",
default: 10,
},
{
name: "explode-slices",
description: "Separates slices from the center to visually emphasize them.",
type: "boolean",
default: false,
},
{
name: "donut",
description: "Renders the pie chart as a donut chart.",
type: "boolean",
default: false,
},
{
name: "donut-ratio",
description: "Defines the inner radius ratio of the donut chart. Equivalent to arcWidth.",
type: "number",
default: 0,
},
]

inheritedOutputs: [{
component: "ChartComponent",
path: "charts/overview",
outputs: ["onDoubleTap", "onPinch", "onPress", "onRotate", "onSwipe", "onTap"]
}]
inheritedOutputs:
[
{
component: "ChartComponent",
path: "addons/charts/overview/api",
outputs: ["onSelect", "onActivate", "onDeactivate", "onDataLoaded"],
},
]
Loading