{ "schemaVersion": "1.0.0", "readme": "", "modules": [ { "kind": "javascript-module", "path": "vaadin-chart.js", "declarations": [], "exports": [ { "kind": "js", "name": "*", "declaration": { "name": "*", "module": "src/vaadin-chart.js" } } ] }, { "kind": "javascript-module", "path": "vaadin-chart-series.js", "declarations": [], "exports": [ { "kind": "js", "name": "*", "declaration": { "name": "*", "module": "src/vaadin-chart-series.js" } } ] }, { "kind": "javascript-module", "path": "src/vaadin-chart-mixin.js", "declarations": [ { "kind": "mixin", "description": "", "name": "ChartMixin", "members": [ { "kind": "field", "name": "additionalOptions", "privacy": "public", "type": { "text": "Options | undefined" }, "description": "Represents additional JSON configuration.", "attribute": "additional-options" }, { "kind": "field", "name": "categories", "privacy": "public", "type": { "text": "ChartCategories | undefined" }, "description": "If categories are present names are used instead of numbers for the category axis.\nThe format of categories can be an `Array` with a list of categories, such as `['2010', '2011', '2012']`\nor a mapping `Object`, like `{0:'1',9:'Target (10)', 15: 'Max'}`.", "attribute": "categories" }, { "kind": "field", "name": "categoryMax", "privacy": "public", "type": { "text": "number" }, "description": "Category-axis maximum value. Defaults to `undefined`.", "attribute": "category-max" }, { "kind": "field", "name": "categoryMin", "privacy": "public", "type": { "text": "number" }, "description": "Category-axis minimum value. Defaults to `undefined`.", "attribute": "category-min" }, { "kind": "field", "name": "categoryPosition", "privacy": "public", "type": { "text": "string" }, "description": "The position of the category axis. Acceptable values are `left`, `right`, `top` and `bottom`\nexcept for bar charts which only accept `left` and `right`.\nWith the default value, charts appear as though they have `category-position=\"bottom\"`\nexcept for bar charts that appear as though they have `category-position=\"left\"`.\n\nDefaults to `undefined`", "attribute": "category-position" }, { "kind": "field", "name": "chart3d", "privacy": "public", "type": { "text": "boolean" }, "description": "Specifies whether to show chart in 3 or in 2 dimensions.\nSome display angles are added by default to the \"chart.options3d\" (`{alpha: 15, beta: 15, depth: 50}`).\n3D display options can be modified via `additionalOptions`.\nThe thickness of a Pie chart can be set on `additionalOptions` through `plotOptions.pie.depth`.\n3D is supported by Bar, Column, Pie and Scatter3D charts.\nMore info available at [Highcharts](https://www.highcharts.com/docs/chart-concepts/3d-charts).", "attribute": "chart3d" }, { "kind": "field", "name": "configuration", "privacy": "public", "type": { "text": "!Highcharts.Chart | undefined" }, "description": "Configuration object that exposes the JS Api to configure the chart.\n\nMost important methods are:\n- `addSeries (Object options, [Boolean redraw], [Mixed animation])`\n- `addAxis (Object options, [Boolean isX], [Boolean redraw], [Mixed animation])`\n- `setTitle (Object title, object subtitle, Boolean redraw)`\n\nMost important properties are:\n- `configuration.series`: An array of the chart's series. Detailed API for Series object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Series)\n- `configuration.xAxis`: An array of the chart's x axes. Detailed API for Axis object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Axis)\n- `configuration.yAxis`: An array of the chart's y axes. Detailed API for Axis object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Axis)\n- `configuration.title`: The chart title.\n\nFor detailed documentation of available API check the [API site](http://api.highcharts.com/class-reference/classes.list)", "attribute": "configuration" }, { "kind": "field", "name": "emptyText", "privacy": "public", "type": { "text": "string" }, "description": "Specifies the message displayed on a chart without displayable data.", "attribute": "empty-text" }, { "kind": "field", "name": "noLegend", "privacy": "public", "type": { "text": "boolean" }, "description": "Specifies whether to hide legend or show.\nLegend configuration can be set up via additionalOptions property", "attribute": "no-legend" }, { "kind": "field", "name": "options", "description": "Highcharts configuration object derived from the chart's reactive\nproperties, base config, and `additionalOptions`.", "type": { "text": "!Options" }, "readonly": true }, { "kind": "field", "name": "polar", "privacy": "public", "type": { "text": "boolean" }, "description": "When present, cartesian charts like line, spline, area and column are transformed\ninto the polar coordinate system.", "attribute": "polar" }, { "kind": "field", "name": "stacking", "privacy": "public", "type": { "text": "string" }, "description": "Specifies how series are stacked on top of each other.\nPossible values are null, \"normal\" or \"percent\".\nIf \"stack\" property is not defined on the vaadin-chart-series elements, then series will be put into\nthe default stack.", "attribute": "stacking" }, { "kind": "field", "name": "subtitle", "privacy": "public", "type": { "text": "string" }, "description": "Represents the subtitle of the chart.", "attribute": "subtitle" }, { "kind": "field", "name": "timeline", "privacy": "public", "type": { "text": "boolean" }, "description": "Specifies whether the chart is a normal chart or a timeline chart.\nValue of this property is ignored for Gantt charts (type=\"gantt\").", "attribute": "timeline" }, { "kind": "field", "name": "title", "privacy": "public", "type": { "text": "string" }, "description": "Represents the title of the chart.", "attribute": "title" }, { "kind": "field", "name": "tooltip", "privacy": "public", "type": { "text": "boolean" }, "description": "Whether or not to show tooltip when hovering data points.", "attribute": "tooltip" }, { "kind": "field", "name": "type", "privacy": "public", "type": { "text": "string" }, "description": "Sets the default series type of the chart.\nNote that `'bar'`, `'gauge'` and `'solidgauge'` should be set as default series type.", "attribute": "type" }, { "kind": "method", "name": "updateConfiguration", "parameters": [ { "name": "jsonConfiguration", "description": "Object chart configuration. Most important properties are:\n\n- annotations `Object[]` custom labels or shapes that can be tied to points, axis coordinates or chart pixel coordinates.\nDetailed API for annotations object is available in [API Site](http://api.highcharts.com/highcharts/annotations)\n- chart `Object` with options regarding the chart area and plot area as well as general chart options.\nDetailed API for chart object is available in [API Site](http://api.highcharts.com/highcharts/chart)\n- credits `Object` with options regarding the chart area and plot area as well as general chart options.\nDetailed API for credits object is available in [API Site](http://api.highcharts.com/highcharts/credits)\n- plotOptions `Object` wrapper for config objects for each series type.\nDetailed API for plotOptions object is available in [API Site](http://api.highcharts.com/highcharts/plotOptions)\n- series `Object[]` the actual series to append to the chart.\nDetailed API for series object is available in [API Site](http://api.highcharts.com/highcharts/series)\n- subtitle `Object` the chart's subtitle.\nDetailed API for subtitle object is available in [API Site](http://api.highcharts.com/highcharts/subtitle)\n- title `Object` the chart's main title.\nDetailed API for title object is available in [API Site](http://api.highcharts.com/highcharts/title)\n- tooltip `Object` Options for the tooltip that appears when the user hovers over a series or point.\nDetailed API for tooltip object is available in [API Site](http://api.highcharts.com/highcharts/tooltip)\n- xAxis `Object[]` The X axis or category axis. Normally this is the horizontal axis.\nDetailed API for xAxis object is available in [API Site](http://api.highcharts.com/highcharts/xAxis)\n- yAxis `Object[]` The Y axis or value axis. Normally this is the vertical axis.\nDetailed API for yAxis object is available in [API Site](http://api.highcharts.com/highcharts/yAxis)\n- zAxis `Object[]` The Z axis or depth axis for 3D plots.\nDetailed API for zAxis object is available in [API Site](http://api.highcharts.com/highcharts/zAxis)", "type": { "text": "!Options" } }, { "name": "resetConfiguration", "description": "Optional boolean that should be set to true if no other chart configuration was set before or\nif existing configuration should be discarded.", "type": { "text": "boolean=" } } ], "description": "Update the chart configuration.\nThis JSON API provides a simple single-argument alternative to the configuration property.\n\nStyling properties specified in this configuration will be ignored. To learn about chart styling\nplease see the CSS Styling section above." } ], "events": [], "attributes": [ { "name": "additional-options", "type": { "text": "Options | undefined" }, "description": "Represents additional JSON configuration.", "fieldName": "additionalOptions" }, { "name": "categories", "type": { "text": "ChartCategories | undefined" }, "description": "If categories are present names are used instead of numbers for the category axis.\nThe format of categories can be an `Array` with a list of categories, such as `['2010', '2011', '2012']`\nor a mapping `Object`, like `{0:'1',9:'Target (10)', 15: 'Max'}`.", "fieldName": "categories" }, { "name": "category-max", "type": { "text": "number" }, "description": "Category-axis maximum value. Defaults to `undefined`.", "fieldName": "categoryMax" }, { "name": "category-min", "type": { "text": "number" }, "description": "Category-axis minimum value. Defaults to `undefined`.", "fieldName": "categoryMin" }, { "name": "category-position", "type": { "text": "string" }, "description": "The position of the category axis. Acceptable values are `left`, `right`, `top` and `bottom`\nexcept for bar charts which only accept `left` and `right`.\nWith the default value, charts appear as though they have `category-position=\"bottom\"`\nexcept for bar charts that appear as though they have `category-position=\"left\"`.\n\nDefaults to `undefined`", "fieldName": "categoryPosition" }, { "name": "chart3d", "type": { "text": "boolean" }, "description": "Specifies whether to show chart in 3 or in 2 dimensions.\nSome display angles are added by default to the \"chart.options3d\" (`{alpha: 15, beta: 15, depth: 50}`).\n3D display options can be modified via `additionalOptions`.\nThe thickness of a Pie chart can be set on `additionalOptions` through `plotOptions.pie.depth`.\n3D is supported by Bar, Column, Pie and Scatter3D charts.\nMore info available at [Highcharts](https://www.highcharts.com/docs/chart-concepts/3d-charts).", "fieldName": "chart3d" }, { "name": "configuration", "type": { "text": "!Highcharts.Chart | undefined" }, "description": "Configuration object that exposes the JS Api to configure the chart.\n\nMost important methods are:\n- `addSeries (Object options, [Boolean redraw], [Mixed animation])`\n- `addAxis (Object options, [Boolean isX], [Boolean redraw], [Mixed animation])`\n- `setTitle (Object title, object subtitle, Boolean redraw)`\n\nMost important properties are:\n- `configuration.series`: An array of the chart's series. Detailed API for Series object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Series)\n- `configuration.xAxis`: An array of the chart's x axes. Detailed API for Axis object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Axis)\n- `configuration.yAxis`: An array of the chart's y axes. Detailed API for Axis object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Axis)\n- `configuration.title`: The chart title.\n\nFor detailed documentation of available API check the [API site](http://api.highcharts.com/class-reference/classes.list)", "fieldName": "configuration" }, { "name": "empty-text", "type": { "text": "string" }, "description": "Specifies the message displayed on a chart without displayable data.", "fieldName": "emptyText" }, { "name": "no-legend", "type": { "text": "boolean" }, "description": "Specifies whether to hide legend or show.\nLegend configuration can be set up via additionalOptions property", "fieldName": "noLegend" }, { "name": "polar", "type": { "text": "boolean" }, "description": "When present, cartesian charts like line, spline, area and column are transformed\ninto the polar coordinate system.", "fieldName": "polar" }, { "name": "stacking", "type": { "text": "string" }, "description": "Specifies how series are stacked on top of each other.\nPossible values are null, \"normal\" or \"percent\".\nIf \"stack\" property is not defined on the vaadin-chart-series elements, then series will be put into\nthe default stack.", "fieldName": "stacking" }, { "name": "subtitle", "type": { "text": "string" }, "description": "Represents the subtitle of the chart.", "fieldName": "subtitle" }, { "name": "timeline", "type": { "text": "boolean" }, "description": "Specifies whether the chart is a normal chart or a timeline chart.\nValue of this property is ignored for Gantt charts (type=\"gantt\").", "fieldName": "timeline" }, { "name": "title", "type": { "text": "string" }, "description": "Represents the title of the chart.", "fieldName": "title" }, { "name": "tooltip", "type": { "text": "boolean" }, "description": "Whether or not to show tooltip when hovering data points.", "fieldName": "tooltip" }, { "name": "type", "type": { "text": "string" }, "description": "Sets the default series type of the chart.\nNote that `'bar'`, `'gauge'` and `'solidgauge'` should be set as default series type.", "fieldName": "type" } ], "mixins": [ { "name": "ResizeMixin", "package": "@vaadin/component-base/src/resize-mixin.js" } ], "parameters": [ { "name": "superClass" } ] } ], "exports": [ { "kind": "js", "name": "ChartMixin", "declaration": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } } ] }, { "kind": "javascript-module", "path": "src/vaadin-chart-series-mixin.js", "declarations": [ { "kind": "mixin", "description": "", "name": "ChartSeriesMixin", "members": [ { "kind": "field", "name": "additionalOptions", "privacy": "public", "type": { "text": "SeriesOptionsType | undefined" }, "description": "Represents additional JSON configuration.", "attribute": "additional-options" }, { "kind": "field", "name": "markers", "privacy": "public", "type": { "text": "string" }, "description": "Shows/hides data-point markers for line-like series.\nAcceptable input are:\n - `shown`: markers are always visible\n - `hidden`: markers are always hidden\n - `auto`: markers are visible for widespread data and hidden, when data is dense *(default)*", "attribute": "markers" }, { "kind": "field", "name": "neckPosition", "privacy": "public", "type": { "text": "number | string" }, "description": "The height of the neck, the lower part of the funnel.\nA number defines pixel width, a percentage string defines a percentage of the plot area height. Defaults to 30%.\nNote that this property only applies for \"funnel\" charts.", "attribute": "neck-position" }, { "kind": "field", "name": "neckWidth", "privacy": "public", "type": { "text": "number | string" }, "description": "The width of the neck, the lower part of the funnel.\nA number defines pixel width, a percentage string defines a percentage of the plot area width. Defaults to 30%.\nNote that this property only applies for \"funnel\" charts.", "attribute": "neck-width" }, { "kind": "field", "name": "options", "privacy": "public", "type": { "text": "!ChartSeriesOptions" }, "description": "Object with the configured options defined and used to create a series.", "readonly": true, "attribute": "options" }, { "kind": "method", "name": "setSeries", "parameters": [ { "name": "series", "description": "Object of type `Highcharts.Series`", "type": { "text": "!Series" } } ], "description": "Method to attach a series object of type `Highcharts.Series`." }, { "kind": "field", "name": "stack", "privacy": "public", "type": { "text": "number | string" }, "description": "Used to group series in a different stacks.\n\"stacking\" property should be specified either for each series or in plotOptions.\nIt is recommended to place series in a single stack, when they belong to the same yAxis.", "attribute": "stack" }, { "kind": "field", "name": "title", "privacy": "public", "type": { "text": "string" }, "description": "The name of the series as shown in the legend, tooltip etc.", "attribute": "title" }, { "kind": "field", "name": "type", "privacy": "public", "type": { "text": "string" }, "description": "A string with the type of the series.\nDefaults to `'line'` in case no type is set for the chart.\nNote that `'bar'`, `'gauge'` and `'solidgauge'` should be set as default series type on ``.", "attribute": "type" }, { "kind": "field", "name": "unit", "privacy": "public", "type": { "text": "string" }, "description": "Used to connect the series to an axis; if multiple series have the same `unit`, they will share axis.\nDisplayed as a title for the axis.\nIf no unit is defined, then series will be connected to the first axis.", "attribute": "unit" }, { "kind": "field", "name": "valueMax", "privacy": "public", "type": { "text": "number" }, "description": "Value-axis maximum-value.\nSee the 'valueMin'", "attribute": "value-max" }, { "kind": "field", "name": "valueMin", "privacy": "public", "type": { "text": "number" }, "description": "Value-axis minimum-value.\nSets the value to a series bound by 'unit' property.\nOtherwise sets the value to the first series.\nUndefined by default (determined from data).", "attribute": "value-min" }, { "kind": "field", "name": "values", "privacy": "public", "type": { "text": "ChartSeriesValues" }, "description": "An array of data used by the series.\nFormat depends on the chart type and can be:\n - An array of numerical values `[y0, y1, y2, y3,...]`\n - An array of arrays with 2 values (`x`, `y`) `[ [x0, y0], [x1, y1], [x2, y2], ... ]`\n - An array of objects, each one describing one point `[ {x: x0, y: y0, name: 'Point0', color: '#FF0000'}, {...}, ...]`\n\n See more in [API Site](https://api.highcharts.com/highcharts/series)", "attribute": "values" } ], "attributes": [ { "name": "additional-options", "type": { "text": "SeriesOptionsType | undefined" }, "description": "Represents additional JSON configuration.", "fieldName": "additionalOptions" }, { "name": "markers", "type": { "text": "string" }, "description": "Shows/hides data-point markers for line-like series.\nAcceptable input are:\n - `shown`: markers are always visible\n - `hidden`: markers are always hidden\n - `auto`: markers are visible for widespread data and hidden, when data is dense *(default)*", "fieldName": "markers" }, { "name": "neck-position", "type": { "text": "number | string" }, "description": "The height of the neck, the lower part of the funnel.\nA number defines pixel width, a percentage string defines a percentage of the plot area height. Defaults to 30%.\nNote that this property only applies for \"funnel\" charts.", "fieldName": "neckPosition" }, { "name": "neck-width", "type": { "text": "number | string" }, "description": "The width of the neck, the lower part of the funnel.\nA number defines pixel width, a percentage string defines a percentage of the plot area width. Defaults to 30%.\nNote that this property only applies for \"funnel\" charts.", "fieldName": "neckWidth" }, { "name": "options", "type": { "text": "!ChartSeriesOptions" }, "description": "Object with the configured options defined and used to create a series.", "readonly": true, "fieldName": "options" }, { "name": "stack", "type": { "text": "number | string" }, "description": "Used to group series in a different stacks.\n\"stacking\" property should be specified either for each series or in plotOptions.\nIt is recommended to place series in a single stack, when they belong to the same yAxis.", "fieldName": "stack" }, { "name": "title", "type": { "text": "string" }, "description": "The name of the series as shown in the legend, tooltip etc.", "fieldName": "title" }, { "name": "type", "type": { "text": "string" }, "description": "A string with the type of the series.\nDefaults to `'line'` in case no type is set for the chart.\nNote that `'bar'`, `'gauge'` and `'solidgauge'` should be set as default series type on ``.", "fieldName": "type" }, { "name": "unit", "type": { "text": "string" }, "description": "Used to connect the series to an axis; if multiple series have the same `unit`, they will share axis.\nDisplayed as a title for the axis.\nIf no unit is defined, then series will be connected to the first axis.", "fieldName": "unit" }, { "name": "value-max", "type": { "text": "number" }, "description": "Value-axis maximum-value.\nSee the 'valueMin'", "fieldName": "valueMax" }, { "name": "value-min", "type": { "text": "number" }, "description": "Value-axis minimum-value.\nSets the value to a series bound by 'unit' property.\nOtherwise sets the value to the first series.\nUndefined by default (determined from data).", "fieldName": "valueMin" }, { "name": "values", "type": { "text": "ChartSeriesValues" }, "description": "An array of data used by the series.\nFormat depends on the chart type and can be:\n - An array of numerical values `[y0, y1, y2, y3,...]`\n - An array of arrays with 2 values (`x`, `y`) `[ [x0, y0], [x1, y1], [x2, y2], ... ]`\n - An array of objects, each one describing one point `[ {x: x0, y: y0, name: 'Point0', color: '#FF0000'}, {...}, ...]`\n\n See more in [API Site](https://api.highcharts.com/highcharts/series)", "fieldName": "values" } ], "parameters": [ { "name": "superClass" } ] } ], "exports": [ { "kind": "js", "name": "ChartSeriesMixin", "declaration": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } } ] }, { "kind": "javascript-module", "path": "src/vaadin-chart-series.js", "declarations": [ { "kind": "class", "description": "`` is a custom element for creating series for Vaadin Charts.\n\n### Basic use\n\nTo use ``, add it inside a `` element:\n\n```html\n\n \n\n```\n\n`` accepts `values` as an array attribute, so you can add it to your element definition:\n\n```html\n\n```\n\nwhich will add a new line series, where each value will be a data point.\nLook for the Properties session to see all available attributes.\n\n### Dynamically adding and removing series\n\nYou are also able to add and remove series by using DOM API.\n\nTo create a new series, call `document.createElement('vaadin-chart-series')` and append it to your ``:\n\n```js\nconst chart = document.querySelector('vaadin-chart');\nconst newSeries = document.createElement('vaadin-chart-series');\nnewSeries.values = [10, 20, 30, 40, 50];\nchart.appendChild(newSeries);\n```\n\nIn order to remove it, you should use the series to be removed as a reference for the `#removeChild()` call:\n\n```js\nconst chart = document.querySelector('vaadin-chart');\nconst seriesToBeRemoved = chart.querySelector('vaadin-chart-series');\nchart.removeChild(seriesToBeRemoved);\n```", "name": "ChartSeries", "members": [ { "kind": "field", "name": "additionalOptions", "privacy": "public", "type": { "text": "SeriesOptionsType | undefined" }, "description": "Represents additional JSON configuration.", "attribute": "additional-options", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "kind": "field", "name": "markers", "privacy": "public", "type": { "text": "string" }, "description": "Shows/hides data-point markers for line-like series.\nAcceptable input are:\n - `shown`: markers are always visible\n - `hidden`: markers are always hidden\n - `auto`: markers are visible for widespread data and hidden, when data is dense *(default)*", "attribute": "markers", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "kind": "field", "name": "neckPosition", "privacy": "public", "type": { "text": "number | string" }, "description": "The height of the neck, the lower part of the funnel.\nA number defines pixel width, a percentage string defines a percentage of the plot area height. Defaults to 30%.\nNote that this property only applies for \"funnel\" charts.", "attribute": "neck-position", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "kind": "field", "name": "neckWidth", "privacy": "public", "type": { "text": "number | string" }, "description": "The width of the neck, the lower part of the funnel.\nA number defines pixel width, a percentage string defines a percentage of the plot area width. Defaults to 30%.\nNote that this property only applies for \"funnel\" charts.", "attribute": "neck-width", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "kind": "field", "name": "options", "privacy": "public", "type": { "text": "!ChartSeriesOptions" }, "description": "Object with the configured options defined and used to create a series.", "readonly": true, "attribute": "options", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "kind": "method", "name": "setSeries", "parameters": [ { "name": "series", "description": "Object of type `Highcharts.Series`", "type": { "text": "!Series" } } ], "description": "Method to attach a series object of type `Highcharts.Series`.", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "kind": "field", "name": "stack", "privacy": "public", "type": { "text": "number | string" }, "description": "Used to group series in a different stacks.\n\"stacking\" property should be specified either for each series or in plotOptions.\nIt is recommended to place series in a single stack, when they belong to the same yAxis.", "attribute": "stack", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "kind": "field", "name": "title", "privacy": "public", "type": { "text": "string" }, "description": "The name of the series as shown in the legend, tooltip etc.", "attribute": "title", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "kind": "field", "name": "type", "privacy": "public", "type": { "text": "string" }, "description": "A string with the type of the series.\nDefaults to `'line'` in case no type is set for the chart.\nNote that `'bar'`, `'gauge'` and `'solidgauge'` should be set as default series type on ``.", "attribute": "type", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "kind": "field", "name": "unit", "privacy": "public", "type": { "text": "string" }, "description": "Used to connect the series to an axis; if multiple series have the same `unit`, they will share axis.\nDisplayed as a title for the axis.\nIf no unit is defined, then series will be connected to the first axis.", "attribute": "unit", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "kind": "field", "name": "valueMax", "privacy": "public", "type": { "text": "number" }, "description": "Value-axis maximum-value.\nSee the 'valueMin'", "attribute": "value-max", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "kind": "field", "name": "valueMin", "privacy": "public", "type": { "text": "number" }, "description": "Value-axis minimum-value.\nSets the value to a series bound by 'unit' property.\nOtherwise sets the value to the first series.\nUndefined by default (determined from data).", "attribute": "value-min", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "kind": "field", "name": "values", "privacy": "public", "type": { "text": "ChartSeriesValues" }, "description": "An array of data used by the series.\nFormat depends on the chart type and can be:\n - An array of numerical values `[y0, y1, y2, y3,...]`\n - An array of arrays with 2 values (`x`, `y`) `[ [x0, y0], [x1, y1], [x2, y2], ... ]`\n - An array of objects, each one describing one point `[ {x: x0, y: y0, name: 'Point0', color: '#FF0000'}, {...}, ...]`\n\n See more in [API Site](https://api.highcharts.com/highcharts/series)", "attribute": "values", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } } ], "mixins": [ { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" }, { "name": "PolylitMixin", "package": "@vaadin/component-base/src/polylit-mixin.js" } ], "superclass": { "name": "LitElement", "package": "lit" }, "tagName": "vaadin-chart-series", "customElement": true, "attributes": [ { "name": "additional-options", "type": { "text": "SeriesOptionsType | undefined" }, "description": "Represents additional JSON configuration.", "fieldName": "additionalOptions", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "name": "markers", "type": { "text": "string" }, "description": "Shows/hides data-point markers for line-like series.\nAcceptable input are:\n - `shown`: markers are always visible\n - `hidden`: markers are always hidden\n - `auto`: markers are visible for widespread data and hidden, when data is dense *(default)*", "fieldName": "markers", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "name": "neck-position", "type": { "text": "number | string" }, "description": "The height of the neck, the lower part of the funnel.\nA number defines pixel width, a percentage string defines a percentage of the plot area height. Defaults to 30%.\nNote that this property only applies for \"funnel\" charts.", "fieldName": "neckPosition", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "name": "neck-width", "type": { "text": "number | string" }, "description": "The width of the neck, the lower part of the funnel.\nA number defines pixel width, a percentage string defines a percentage of the plot area width. Defaults to 30%.\nNote that this property only applies for \"funnel\" charts.", "fieldName": "neckWidth", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "name": "options", "type": { "text": "!ChartSeriesOptions" }, "description": "Object with the configured options defined and used to create a series.", "readonly": true, "fieldName": "options", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "name": "stack", "type": { "text": "number | string" }, "description": "Used to group series in a different stacks.\n\"stacking\" property should be specified either for each series or in plotOptions.\nIt is recommended to place series in a single stack, when they belong to the same yAxis.", "fieldName": "stack", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "name": "title", "type": { "text": "string" }, "description": "The name of the series as shown in the legend, tooltip etc.", "fieldName": "title", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "name": "type", "type": { "text": "string" }, "description": "A string with the type of the series.\nDefaults to `'line'` in case no type is set for the chart.\nNote that `'bar'`, `'gauge'` and `'solidgauge'` should be set as default series type on ``.", "fieldName": "type", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "name": "unit", "type": { "text": "string" }, "description": "Used to connect the series to an axis; if multiple series have the same `unit`, they will share axis.\nDisplayed as a title for the axis.\nIf no unit is defined, then series will be connected to the first axis.", "fieldName": "unit", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "name": "value-max", "type": { "text": "number" }, "description": "Value-axis maximum-value.\nSee the 'valueMin'", "fieldName": "valueMax", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "name": "value-min", "type": { "text": "number" }, "description": "Value-axis minimum-value.\nSets the value to a series bound by 'unit' property.\nOtherwise sets the value to the first series.\nUndefined by default (determined from data).", "fieldName": "valueMin", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } }, { "name": "values", "type": { "text": "ChartSeriesValues" }, "description": "An array of data used by the series.\nFormat depends on the chart type and can be:\n - An array of numerical values `[y0, y1, y2, y3,...]`\n - An array of arrays with 2 values (`x`, `y`) `[ [x0, y0], [x1, y1], [x2, y2], ... ]`\n - An array of objects, each one describing one point `[ {x: x0, y: y0, name: 'Point0', color: '#FF0000'}, {...}, ...]`\n\n See more in [API Site](https://api.highcharts.com/highcharts/series)", "fieldName": "values", "inheritedFrom": { "name": "ChartSeriesMixin", "module": "src/vaadin-chart-series-mixin.js" } } ], "events": [] } ], "exports": [ { "kind": "js", "name": "ChartSeries", "declaration": { "name": "ChartSeries", "module": "src/vaadin-chart-series.js" } } ] }, { "kind": "javascript-module", "path": "src/vaadin-chart.js", "declarations": [ { "kind": "class", "description": "`` is a Web Component for creating high quality charts.\n\n### Basic use\n\nThere are two ways of configuring your `` element: **HTML API**, **JS API** and **JSON API**.\nNote that you can make use of all APIs in your element.\n\n#### Using HTML API\n\n`vaadin-chart` has a set of attributes to make it easier for you to customize your chart.\n\n```html\n\n \n\n```\n\n> Note that while you can set type for each series individually, for some types, such as `'bar'`, `'gauge'` and `'solidgauge'`, you\n> have to set it as the default series type on `` in order to work properly.\n\n#### Using JS API\n\nUse [`configuration`](#/elements/vaadin-chart#property-configuration) property to set chart title, categories and data:\n\n```js\nconst chart = document.querySelector('vaadin-chart');\n\n// Wait for default configuration to be ready\nrequestAnimationFrame(() => {\n const configuration = chart.configuration;\n configuration.setTitle({ text: 'The chart title' });\n // By default there is one X axis, it is referenced by configuration.xAxis[0].\n configuration.xAxis[0].setCategories(['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']);\n configuration.addSeries({\n type: 'column',\n data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]\n });\n});\n```\n\n#### Using JS JSON API\n\nUse [`updateConfiguration`](#/elements/vaadin-chart#method-updateConfiguration) method to set chart title, categories and data:\n\n```js\nconst chart = document.querySelector('vaadin-chart');\nchart.updateConfiguration({\n title: {\n text: 'The chart title'\n },\n subtitle: {\n text: 'Subtitle'\n },\n xAxis: {\n categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']\n },\n series: [{\n type: 'column',\n data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]\n }]\n});\n```\n\n**Note:** chart style customization cannot be done via the JS or JSON API.\nStyling properties in the JSON configuration will be ignored. The following section discusses chart styling.\n\n### CSS Styling\n\nChart appearance is primarily controlled by CSS style rules.\nA comprehensive list of the supported style classes can be found at\nhttps://www.highcharts.com/docs/chart-design-and-style/style-by-css\n\nSee also the [Chart Styling](https://vaadin.com/docs/latest/components/charts/css-styling) documentation.\n\n### RTL support\n\n`vaadin-charts` as well as [Highcharts](https://www.highcharts.com/) by itself are not adjusting the layout\nbased on the `dir` attribute. In order to make `vaadin-charts` display RTL content properly additional\nJSON configuration should be used.\nEach chart should be updated based on the specific needs, but general recommendations are:\n\n 1. Set `reversed` to true for xAxis (https://api.highcharts.com/highcharts/xAxis.reversed).\n 2. Set `useHTML` to true for text elements, i.e. `tooltip` (https://api.highcharts.com/highcharts/tooltip.useHTML).\n 3. Set `rtl` to true for `legend` (https://api.highcharts.com/highcharts/legend.rtl).\n\n### Setting colors\n\nAlthough charts can be styled as described above, there is a simpler way for setting colors.\nColors can be set using CSS custom properties `--vaadin-charts-color-{n}` (where `n` goes from `0 - 9`).\n\nFor example `--vaadin-charts-color-0` sets the color of the first series on a chart.", "name": "Chart", "members": [ { "kind": "field", "name": "additionalOptions", "privacy": "public", "type": { "text": "Options | undefined" }, "description": "Represents additional JSON configuration.", "attribute": "additional-options", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "kind": "field", "name": "categories", "privacy": "public", "type": { "text": "ChartCategories | undefined" }, "description": "If categories are present names are used instead of numbers for the category axis.\nThe format of categories can be an `Array` with a list of categories, such as `['2010', '2011', '2012']`\nor a mapping `Object`, like `{0:'1',9:'Target (10)', 15: 'Max'}`.", "attribute": "categories", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "kind": "field", "name": "categoryMax", "privacy": "public", "type": { "text": "number" }, "description": "Category-axis maximum value. Defaults to `undefined`.", "attribute": "category-max", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "kind": "field", "name": "categoryMin", "privacy": "public", "type": { "text": "number" }, "description": "Category-axis minimum value. Defaults to `undefined`.", "attribute": "category-min", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "kind": "field", "name": "categoryPosition", "privacy": "public", "type": { "text": "string" }, "description": "The position of the category axis. Acceptable values are `left`, `right`, `top` and `bottom`\nexcept for bar charts which only accept `left` and `right`.\nWith the default value, charts appear as though they have `category-position=\"bottom\"`\nexcept for bar charts that appear as though they have `category-position=\"left\"`.\n\nDefaults to `undefined`", "attribute": "category-position", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "kind": "field", "name": "chart3d", "privacy": "public", "type": { "text": "boolean" }, "description": "Specifies whether to show chart in 3 or in 2 dimensions.\nSome display angles are added by default to the \"chart.options3d\" (`{alpha: 15, beta: 15, depth: 50}`).\n3D display options can be modified via `additionalOptions`.\nThe thickness of a Pie chart can be set on `additionalOptions` through `plotOptions.pie.depth`.\n3D is supported by Bar, Column, Pie and Scatter3D charts.\nMore info available at [Highcharts](https://www.highcharts.com/docs/chart-concepts/3d-charts).", "attribute": "chart3d", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "kind": "field", "name": "configuration", "privacy": "public", "type": { "text": "!Highcharts.Chart | undefined" }, "description": "Configuration object that exposes the JS Api to configure the chart.\n\nMost important methods are:\n- `addSeries (Object options, [Boolean redraw], [Mixed animation])`\n- `addAxis (Object options, [Boolean isX], [Boolean redraw], [Mixed animation])`\n- `setTitle (Object title, object subtitle, Boolean redraw)`\n\nMost important properties are:\n- `configuration.series`: An array of the chart's series. Detailed API for Series object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Series)\n- `configuration.xAxis`: An array of the chart's x axes. Detailed API for Axis object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Axis)\n- `configuration.yAxis`: An array of the chart's y axes. Detailed API for Axis object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Axis)\n- `configuration.title`: The chart title.\n\nFor detailed documentation of available API check the [API site](http://api.highcharts.com/class-reference/classes.list)", "attribute": "configuration", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "kind": "field", "name": "emptyText", "privacy": "public", "type": { "text": "string" }, "description": "Specifies the message displayed on a chart without displayable data.", "attribute": "empty-text", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "kind": "field", "name": "noLegend", "privacy": "public", "type": { "text": "boolean" }, "description": "Specifies whether to hide legend or show.\nLegend configuration can be set up via additionalOptions property", "attribute": "no-legend", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "kind": "field", "name": "options", "description": "Highcharts configuration object derived from the chart's reactive\nproperties, base config, and `additionalOptions`.", "type": { "text": "!Options" }, "readonly": true, "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "kind": "field", "name": "polar", "privacy": "public", "type": { "text": "boolean" }, "description": "When present, cartesian charts like line, spline, area and column are transformed\ninto the polar coordinate system.", "attribute": "polar", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "kind": "field", "name": "stacking", "privacy": "public", "type": { "text": "string" }, "description": "Specifies how series are stacked on top of each other.\nPossible values are null, \"normal\" or \"percent\".\nIf \"stack\" property is not defined on the vaadin-chart-series elements, then series will be put into\nthe default stack.", "attribute": "stacking", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "kind": "field", "name": "subtitle", "privacy": "public", "type": { "text": "string" }, "description": "Represents the subtitle of the chart.", "attribute": "subtitle", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "kind": "field", "name": "timeline", "privacy": "public", "type": { "text": "boolean" }, "description": "Specifies whether the chart is a normal chart or a timeline chart.\nValue of this property is ignored for Gantt charts (type=\"gantt\").", "attribute": "timeline", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "kind": "field", "name": "title", "privacy": "public", "type": { "text": "string" }, "description": "Represents the title of the chart.", "attribute": "title", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "kind": "field", "name": "tooltip", "privacy": "public", "type": { "text": "boolean" }, "description": "Whether or not to show tooltip when hovering data points.", "attribute": "tooltip", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "kind": "field", "name": "type", "privacy": "public", "type": { "text": "string" }, "description": "Sets the default series type of the chart.\nNote that `'bar'`, `'gauge'` and `'solidgauge'` should be set as default series type.", "attribute": "type", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "kind": "method", "name": "updateConfiguration", "parameters": [ { "name": "jsonConfiguration", "description": "Object chart configuration. Most important properties are:\n\n- annotations `Object[]` custom labels or shapes that can be tied to points, axis coordinates or chart pixel coordinates.\nDetailed API for annotations object is available in [API Site](http://api.highcharts.com/highcharts/annotations)\n- chart `Object` with options regarding the chart area and plot area as well as general chart options.\nDetailed API for chart object is available in [API Site](http://api.highcharts.com/highcharts/chart)\n- credits `Object` with options regarding the chart area and plot area as well as general chart options.\nDetailed API for credits object is available in [API Site](http://api.highcharts.com/highcharts/credits)\n- plotOptions `Object` wrapper for config objects for each series type.\nDetailed API for plotOptions object is available in [API Site](http://api.highcharts.com/highcharts/plotOptions)\n- series `Object[]` the actual series to append to the chart.\nDetailed API for series object is available in [API Site](http://api.highcharts.com/highcharts/series)\n- subtitle `Object` the chart's subtitle.\nDetailed API for subtitle object is available in [API Site](http://api.highcharts.com/highcharts/subtitle)\n- title `Object` the chart's main title.\nDetailed API for title object is available in [API Site](http://api.highcharts.com/highcharts/title)\n- tooltip `Object` Options for the tooltip that appears when the user hovers over a series or point.\nDetailed API for tooltip object is available in [API Site](http://api.highcharts.com/highcharts/tooltip)\n- xAxis `Object[]` The X axis or category axis. Normally this is the horizontal axis.\nDetailed API for xAxis object is available in [API Site](http://api.highcharts.com/highcharts/xAxis)\n- yAxis `Object[]` The Y axis or value axis. Normally this is the vertical axis.\nDetailed API for yAxis object is available in [API Site](http://api.highcharts.com/highcharts/yAxis)\n- zAxis `Object[]` The Z axis or depth axis for 3D plots.\nDetailed API for zAxis object is available in [API Site](http://api.highcharts.com/highcharts/zAxis)", "type": { "text": "!Options" } }, { "name": "resetConfiguration", "description": "Optional boolean that should be set to true if no other chart configuration was set before or\nif existing configuration should be discarded.", "type": { "text": "boolean=" } } ], "description": "Update the chart configuration.\nThis JSON API provides a simple single-argument alternative to the configuration property.\n\nStyling properties specified in this configuration will be ignored. To learn about chart styling\nplease see the CSS Styling section above.", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } } ], "events": [ { "type": { "text": "CustomEvent" }, "description": "Fired when a new series is added.", "name": "chart-add-series" }, { "type": { "text": "CustomEvent" }, "description": "Fired after a chart is exported.", "name": "chart-after-export" }, { "type": { "text": "CustomEvent" }, "description": "Fired after a chart is printed.", "name": "chart-after-print" }, { "type": { "text": "CustomEvent" }, "description": "Fired before a chart is exported.", "name": "chart-before-export" }, { "type": { "text": "CustomEvent" }, "description": "Fired before a chart is printed.", "name": "chart-before-print" }, { "type": { "text": "CustomEvent" }, "description": "Fired when clicking on the plot background.", "name": "chart-click" }, { "type": { "text": "CustomEvent" }, "description": "Fired when drilldown point is clicked.", "name": "chart-drilldown" }, { "type": { "text": "CustomEvent" }, "description": "Fired when drilling up from a drilldown series.", "name": "chart-drillup" }, { "type": { "text": "CustomEvent" }, "description": "Fired after all the drilldown series has been drilled up.", "name": "chart-drillupall" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the chart finishes resizing.", "name": "chart-end-resize" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the chart has finished loading.", "name": "chart-load" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the chart is redrawn: after `Chart.configuration.redraw()`, or after an axis, series, or point is modified with the `redraw` option set to true.", "name": "chart-redraw" }, { "type": { "text": "CustomEvent" }, "description": "Fired when an area of the chart has been selected.", "name": "chart-selection" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the point is clicked.", "name": "point-click" }, { "type": { "text": "CustomEvent" }, "description": "Fired while dragging a point.", "name": "point-drag" }, { "type": { "text": "CustomEvent" }, "description": "Fired when starting to drag a point.", "name": "point-drag-start" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the point is dropped.", "name": "point-drop" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the legend item belonging to the point is clicked.", "name": "point-legend-item-click" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the mouse leaves the area close to the point.", "name": "point-mouse-out" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the mouse enters the area close to the point.", "name": "point-mouse-over" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the point is removed from the series.", "name": "point-remove" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the point is selected either programmatically or by clicking on the point.", "name": "point-select" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the point is unselected either programmatically or by clicking on the point.", "name": "point-unselect" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the point is updated programmatically through `.updateConfiguration()` method.", "name": "point-update" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the series has finished its initial animation.", "name": "series-after-animate" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the checkbox next to the series' name in the legend is clicked.", "name": "series-checkbox-click" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the series is clicked.", "name": "series-click" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the series is hidden after chart generation time.", "name": "series-hide" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the legend item belonging to the series is clicked.", "name": "series-legend-item-click" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the mouse leaves the graph.", "name": "series-mouse-out" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the mouse enters the graph.", "name": "series-mouse-over" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the series is shown after chart generation time.", "name": "series-show" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the minimum and maximum is set for the X axis.", "name": "xaxes-extremes-set" }, { "type": { "text": "CustomEvent" }, "description": "Fired when the minimum and maximum is set for the Y axis.", "name": "yaxes-extremes-set" } ], "mixins": [ { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" }, { "name": "ThemableMixin", "package": "@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js" }, { "name": "ElementMixin", "package": "@vaadin/component-base/src/element-mixin.js" }, { "name": "PolylitMixin", "package": "@vaadin/component-base/src/polylit-mixin.js" }, { "name": "LumoInjectionMixin", "package": "@vaadin/vaadin-themable-mixin/lumo-injection-mixin.js" } ], "superclass": { "name": "LitElement", "package": "lit" }, "tagName": "vaadin-chart", "customElement": true, "attributes": [ { "name": "additional-options", "type": { "text": "Options | undefined" }, "description": "Represents additional JSON configuration.", "fieldName": "additionalOptions", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "name": "categories", "type": { "text": "ChartCategories | undefined" }, "description": "If categories are present names are used instead of numbers for the category axis.\nThe format of categories can be an `Array` with a list of categories, such as `['2010', '2011', '2012']`\nor a mapping `Object`, like `{0:'1',9:'Target (10)', 15: 'Max'}`.", "fieldName": "categories", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "name": "category-max", "type": { "text": "number" }, "description": "Category-axis maximum value. Defaults to `undefined`.", "fieldName": "categoryMax", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "name": "category-min", "type": { "text": "number" }, "description": "Category-axis minimum value. Defaults to `undefined`.", "fieldName": "categoryMin", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "name": "category-position", "type": { "text": "string" }, "description": "The position of the category axis. Acceptable values are `left`, `right`, `top` and `bottom`\nexcept for bar charts which only accept `left` and `right`.\nWith the default value, charts appear as though they have `category-position=\"bottom\"`\nexcept for bar charts that appear as though they have `category-position=\"left\"`.\n\nDefaults to `undefined`", "fieldName": "categoryPosition", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "name": "chart3d", "type": { "text": "boolean" }, "description": "Specifies whether to show chart in 3 or in 2 dimensions.\nSome display angles are added by default to the \"chart.options3d\" (`{alpha: 15, beta: 15, depth: 50}`).\n3D display options can be modified via `additionalOptions`.\nThe thickness of a Pie chart can be set on `additionalOptions` through `plotOptions.pie.depth`.\n3D is supported by Bar, Column, Pie and Scatter3D charts.\nMore info available at [Highcharts](https://www.highcharts.com/docs/chart-concepts/3d-charts).", "fieldName": "chart3d", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "name": "configuration", "type": { "text": "!Highcharts.Chart | undefined" }, "description": "Configuration object that exposes the JS Api to configure the chart.\n\nMost important methods are:\n- `addSeries (Object options, [Boolean redraw], [Mixed animation])`\n- `addAxis (Object options, [Boolean isX], [Boolean redraw], [Mixed animation])`\n- `setTitle (Object title, object subtitle, Boolean redraw)`\n\nMost important properties are:\n- `configuration.series`: An array of the chart's series. Detailed API for Series object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Series)\n- `configuration.xAxis`: An array of the chart's x axes. Detailed API for Axis object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Axis)\n- `configuration.yAxis`: An array of the chart's y axes. Detailed API for Axis object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Axis)\n- `configuration.title`: The chart title.\n\nFor detailed documentation of available API check the [API site](http://api.highcharts.com/class-reference/classes.list)", "fieldName": "configuration", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "name": "empty-text", "type": { "text": "string" }, "description": "Specifies the message displayed on a chart without displayable data.", "fieldName": "emptyText", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "name": "no-legend", "type": { "text": "boolean" }, "description": "Specifies whether to hide legend or show.\nLegend configuration can be set up via additionalOptions property", "fieldName": "noLegend", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "name": "polar", "type": { "text": "boolean" }, "description": "When present, cartesian charts like line, spline, area and column are transformed\ninto the polar coordinate system.", "fieldName": "polar", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "name": "stacking", "type": { "text": "string" }, "description": "Specifies how series are stacked on top of each other.\nPossible values are null, \"normal\" or \"percent\".\nIf \"stack\" property is not defined on the vaadin-chart-series elements, then series will be put into\nthe default stack.", "fieldName": "stacking", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "name": "subtitle", "type": { "text": "string" }, "description": "Represents the subtitle of the chart.", "fieldName": "subtitle", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "name": "timeline", "type": { "text": "boolean" }, "description": "Specifies whether the chart is a normal chart or a timeline chart.\nValue of this property is ignored for Gantt charts (type=\"gantt\").", "fieldName": "timeline", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "name": "title", "type": { "text": "string" }, "description": "Represents the title of the chart.", "fieldName": "title", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "name": "tooltip", "type": { "text": "boolean" }, "description": "Whether or not to show tooltip when hovering data points.", "fieldName": "tooltip", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } }, { "name": "type", "type": { "text": "string" }, "description": "Sets the default series type of the chart.\nNote that `'bar'`, `'gauge'` and `'solidgauge'` should be set as default series type.", "fieldName": "type", "inheritedFrom": { "name": "ChartMixin", "module": "src/vaadin-chart-mixin.js" } } ] } ], "exports": [ { "kind": "js", "name": "Chart", "declaration": { "name": "Chart", "module": "src/vaadin-chart.js" } } ] } ] }