@types/echarts
- Version 4.9.22
- Published
- 12.9 MB
- 1 dependency
- MIT license
Install
npm i @types/echarts
yarn add @types/echarts
pnpm add @types/echarts
Overview
TypeScript definitions for echarts
Index
Namespaces
echarts
- connect()
- disConnect()
- dispose()
- EChartOption
- ECharts
- EChartsConvertFinder
- EChartsLoadingOption
- EChartsMediaOption
- EChartsOptionConfig
- EChartsResizeOption
- EChartsResponsiveOption
- EChartsSeriesType
- EChartTitleOption
- ERectangle
- getInstanceByDom()
- getMap()
- graphic
- Graphic
- init()
- MapObj
- registerMap()
- registerTheme()
- TypedArray
echarts/lib/echarts
- connect()
- disConnect()
- dispose()
- EChartOption
- ECharts
- EChartsConvertFinder
- EChartsLoadingOption
- EChartsMediaOption
- EChartsOptionConfig
- EChartsResizeOption
- EChartsResponsiveOption
- EChartsSeriesType
- EChartTitleOption
- ERectangle
- getInstanceByDom()
- getMap()
- graphic
- Graphic
- init()
- MapObj
- registerMap()
- registerTheme()
- TypedArray
Namespaces
namespace echarts
module 'echarts' {}
variable graphic
const graphic: Graphic;
Util methods about graphics.
function connect
connect: (group: string | ECharts[]) => void;
Connects interaction of multiple chart series. For example:
```js // set group id of each instance respectively. chart1.group = 'group1'; chart2.group = 'group1'; echarts.connect('group1'); // or incoming instance array that need to be linked. echarts.connect([chart1, chart2]); ```
Parameter group
Group id in string, or array of chart instance.
function disConnect
disConnect: (group: string) => void;
Disconnects interaction of multiple chart series. To have one single instance to be removed, you can set
group
of chart instance to be null.Parameter group
Group id in string.
function dispose
dispose: (target: ECharts | HTMLDivElement | HTMLCanvasElement) => void;
Destroys chart instance, after which the instance cannot be used any more.
Parameter target
Chart instance or container.
function getInstanceByDom
getInstanceByDom: (target: HTMLDivElement | HTMLCanvasElement) => ECharts;
Returns chart instance of dom container.
Parameter target
Chart container.
function getMap
getMap: (mapName: string) => MapObj;
Get a registed map.
Parameter mapName
Map name. {MapObj} Map data.
function init
init: ( dom: HTMLDivElement | HTMLCanvasElement, theme?: object | string, opts?: { devicePixelRatio?: number | undefined; renderer?: string | undefined; width?: number | string | undefined; height?: number | string | undefined; }) => ECharts;
Creates an ECharts instance, and returns an echartsInstance. You shall not initialize multiple ECharts instances on a single container.
Parameter dom
Instance container, usually is a
div
element with height and width defined.Parameter theme
Theme to be applied. This can be a configuring object of a theme, or a theme name registered through [echarts.registerTheme](https://echarts.apache.org/api.html#echarts.registerTheme).
Parameter opts
Chart configurations.
Parameter
{number} [opts.devicePixelRatio] Ratio of one physical pixel to the size of one device independent pixels. Browser's
window.devicePixelRatio
is used by default.Parameter
{string} [opts.renderer] Supports
'canvas'
or'svg'
. See [Render by Canvas or SVG](https://echarts.apache.org/tutorial.html#Render%20by%20Canvas%20or%20SVG).Parameter
{number} [opts.width] Specify width explicitly, in pixel. If setting to
null
/undefined
/'auto'
, width ofdom
(instance container) will be used.Parameter
{number} [opts.height] Specify height explicitly, in pixel. If setting to
null
/undefined
/'auto'
, height ofdom
(instance container) will be used.
function registerMap
registerMap: (mapName: string, geoJson: object, specialAreas?: object) => void;
Registers available maps. This can only be used after including [geo](https://echarts.apache.org/option.html#geo) component or chart series of [map](https://echarts.apache.org/option.html#series-map).
Parameter mapName
Map name, referring to
map
value set in [geo](https://echarts.apache.org/option.html#geo) component or [map](https://echarts.apache.org/option.html#series-map).Parameter geoJson
Data in GeoJson format. See [http://geojson.org/](http://geojson.org/) for more format information.
Parameter specialAreas
Zoomed part of a specific area in the map for better visual effect. See [USA Population Estimates example](https://echarts.apache.org/examples/en/editor.html?c=map-usa).
function registerTheme
registerTheme: (themeName: string, theme: object) => void;
Registers a theme, should be specified when [initialize the chart instance](https://echarts.apache.org/api.html#echarts.init).
Parameter themeName
Theme name.
Parameter theme
Theme configurations.
interface EChartOption
interface EChartOption<TSeries = EChartOption.Series> {}
property angleAxis
angleAxis?: object | undefined;
The angle axis in Polar Coordinate.
See Also
https://echarts.apache.org/en/option.html#angleAxis
property animation
animation?: boolean | undefined;
Whether to enable animation.
See Also
https://echarts.apache.org/en/option.html#animation
property animationDelay
animationDelay?: number | Function | undefined;
Delay before updating the first animation, which supports callback function for different data to have different animation effect.
Example 1
animationDelay: function (idx) { // delay for later data is larger return idx * 100; }
See Also
https://echarts.apache.org/en/option.html#animationDelay
property animationDelayUpdate
animationDelayUpdate?: number | Function | undefined;
Delay before updating animation, which supports callback function for different data to have different animation effect.
Example 1
animationDelayUpdate: function (idx) { // delay for later data is larger return idx * 100; }
See Also
https://echarts.apache.org/en/option.html#animationDelayUpdate
property animationDuration
animationDuration?: number | undefined;
Duration of the first animation, which supports callback function for different data to have different animation effect
Example 1
animationDuration: function (idx) { // delay for later data is larger return idx * 100; }
See Also
https://echarts.apache.org/en/option.html#animationDuration
property animationDurationUpdate
animationDurationUpdate?: number | Function | undefined;
Time for animation to complete, which supports callback function for different data to have different animation effect
Example 1
animationDurationUpdate: function (idx) { // delay for later data is larger return idx * 100; }
See Also
https://echarts.apache.org/en/option.html#animationDurationUpdate
property animationEasing
animationEasing?: string | undefined;
Easing method used for the first animation. Varied easing effects can be found at
easing effect example
.See Also
https://echarts.apache.org/en/option.html#animationEasing
property animationEasingUpdate
animationEasingUpdate?: string | undefined;
Easing method used for animation.
See Also
https://echarts.apache.org/en/option.html#animationEasingUpdate
property animationThreshold
animationThreshold?: number | undefined;
Whether to set graphic number threshold to animation. Animation will be disabled when graphic number is larger than threshold.
See Also
https://echarts.apache.org/en/option.html#animationThreshold
property aria
aria?: object | undefined;
dataset
component is published since ECharts 4.dataset
brings convenience in data management separated with styles and enables data reuse by different series. More importantly, is enables data encoding from data to visual, which brings convenience in some scenarios. More details aboutdataset
can be checked in the tutorial.See Also
https://echarts.apache.org/en/option.html#aria
property axisPointer
axisPointer?: EChartOption.AxisPointer | undefined;
axisPointer
is a tool for displaying reference line and axis value under mouse pointer.See Also
https://echarts.apache.org/en/option.html#axisPointer
property backgroundColor
backgroundColor?: EChartOption.Color | undefined;
Background color. Defaults to have no background.
See Also
https://echarts.apache.org/en/option.html#backgroundColor
property blendMode
blendMode?: string | undefined;
Equal to CanvasRenderingContext2D.globalCompositeOperation
See Also
https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/globalCompositeOperation
property brush
brush?: object | undefined;
brush
is an area-selecting component, with which user can select part of data from a chart to display in detail, or doing calculations with them.See Also
https://echarts.apache.org/en/option.html#brush
property calendar
calendar?: EChartOption.Calendar | EChartOption.Calendar[] | undefined;
Calendar coordinates. In ECharts, we are very creative to achieve the calendar chart, by using the calendar coordinates to achieve the calendar chart, as shown in the following example, we can use calendar coordinates in
heatmap
,scatter
,effectScatter
, andgraph
.See Also
https://echarts.apache.org/en/option.html#calendar
property color
color?: string[] | undefined;
The color list of palette. If no color is set in series, the colors would be adopted sequentially and circularly from this list as the colors of series. [ '#c23531','#2f4554','#61a0a8','#d48265','#91c7ae', '#749f83', '#ca8622','#bda29a','#6e7074','#546570', '#c4ccd3' ]
See Also
https://echarts.apache.org/en/option.html#color
property dataset
dataset?: EChartOption.Dataset | EChartOption.Dataset[] | undefined;
See Also
https://echarts.apache.org/en/option.html#dataset
property dataZoom
dataZoom?: EChartOption.DataZoom[] | undefined;
dataZoom
component is used for zooming a specific area, which enables user to investigate data in detail, or get an overview of the data, or get rid of outlier points. These types ofdataZoom
component are supported: +dataZoomInside
: Data zoom functionalities is embeded inside coordinate systems, enable user to zoom or roam coordinate system by mouse dragging, mouse move or finger touch (in touch screen). +dataZoomSlider
: A special slider bar is provided, on which coordinate systems can be zoomed or roamed by mouse dragging or finger touch (in touch screen). +dataZoomSelect
: A marquee tool is provided for zooming or roaming coordinate system. That istoolbox.feature.dataZoom
, which can only be configured in toolbox.See Also
https://echarts.apache.org/en/option.html#dataZoom
property geo
geo?: object | undefined;
Geographic coorinate system component. Geographic coorinate system component is used to draw maps, which also supports
scatter series
, andline series
.See Also
https://echarts.apache.org/en/option.html#geo
property graphic
graphic?: object | object[] | undefined;
graphic
component enable creating graphic elements in echarts. Those graphic type are supported.image
,text
,circle
,sector
,ring
,polygon
,polyline
,rect
,line
,bezierCurve
,arc
,group
,See Also
https://echarts.apache.org/en/option.html#graphic
property grid
grid?: EChartOption.Grid | EChartOption.Grid[] | undefined;
Drawing grid in rectangular coordinate. In a single grid, at most two X and Y axes each is allowed.
Line chart
,bar chart
, andscatter chart (bubble chart)
can be drawn in grid. In ECharts 2.x, there could only be one single grid component at most in a single echarts instance. But in ECharts 3, there is no limitation.See Also
https://echarts.apache.org/en/option.html#grid
property hoverLayerThreshold
hoverLayerThreshold?: number | undefined;
Threshold of if use single hover layer to optimize. It is recommended that
hoverLayerThreshold
is equivalent to or less thanprogressiveThreshold
, otherwise hover will cause restart of progressive, which is unexpected. see example <echarts/test/heatmap-large.html>.3000
property legend
legend?: EChartOption.Legend | undefined;
Legend component. Legend component shows symbol, color and name of different series. You can click legends to toggle displaying series in the chart. In ECharts 3, a single echarts instance may contain multiple legend components, which makes it easier for the layout of multiple legend components. If there have to be too many legend items,
vertically scrollable
legend orhorizontally scrollable
legend are options to paginate them. Checklegend.type
please.See Also
https://echarts.apache.org/en/option.html#legend
property parallel
parallel?: object | undefined;
Parallel Coordinates
is a common way of visualizing high-dimensional geometry and analyzing multivariate data. For example,series-parallel.data
is the following data:Example 1
[ [1, 55, 9, 56, 0.46, 18, 6, 'good'], [2, 25, 11, 21, 0.65, 34, 9, 'excellent'], [3, 56, 7, 63, 0.3, 14, 5, 'good'], [4, 33, 7, 29, 0.33, 16, 6, 'excellent'], { // Data item can also be an Object, // so that perticular settings of its line can be set here. value: [5, 42, 24, 44, 0.76, 40, 16, 'excellent'] lineStyle: {...}, } ... ]
See Also
https://echarts.apache.org/en/option.html#parallel
property parallelAxis
parallelAxis?: object | undefined;
This component is the coordinate axis for parallel coordinate.
See Also
https://echarts.apache.org/en/option.html#parallelAxis
property polar
polar?: object | undefined;
Polar coordinate can be used in scatter and line chart. Every polar coordinate has an
angleAxis
and aradiusAxis
.See Also
https://echarts.apache.org/en/option.html#polar
property progressive
progressive?: number | undefined;
Configuration for progressive/incremental rendering
400
property progressiveThreshold
progressiveThreshold?: number | undefined;
Configuration for progressive/incremental rendering
3000
property radar
radar?: object | undefined;
Coordinate for
radar charts
. This component is equal to the polar component in ECharts 2. Because the polar component in the echarts 3 is reconstructed to be the standard polar coordinate component, this component is renamed to be radar to avoid confusion. Radar chart coordinate is different from polar coordinate, in that every axis indicator of the radar chart coordinate is an individual dimension. The style of indicator coordinate axis could be configured through the following configuration items, includingname
,axisLine
,axisTick
,axisLabel
,splitLine
,splitArea
.See Also
https://echarts.apache.org/en/option.html#radar
property radiusAxis
radiusAxis?: object | undefined;
Radial axis of polar coordinate.
See Also
https://echarts.apache.org/en/option.html#radiusAxis
property series
series?: TSeries[] | undefined;
See Also
https://echarts.apache.org/en/option.html#series
property singleAxis
singleAxis?: EChartOption.SingleAxis | EChartOption.SingleAxis[] | undefined;
An axis with a single dimension. It can be used to display data in one dimension.
See Also
https://echarts.apache.org/en/option.html#singleAxis
property textStyle
textStyle?: | (EChartOption.BaseTextStyle & EChartOption.BaseTextStyleWithRich) | undefined;
Global font style.
See Also
https://echarts.apache.org/en/option.html#textStyle
property timeline
timeline?: object | undefined;
timeline
component, which provides functions like switching and playing between multiple EChartsoptions
.See Also
https://echarts.apache.org/en/option.html#timeline
property title
title?: EChartTitleOption | EChartTitleOption[] | undefined;
Title component, including main title and subtitle. In ECharts 2.x, a single instance of ECharts could contains one title component at most. However, in ECharts 3, there could be one or more than one title components. It is more useful when multiple diagrams in one instance all need titles.
See Also
https://echarts.apache.org/en/option.html#title
property toolbox
toolbox?: object | undefined;
A group of utility tools, which includes
export
,data view
,dynamic type switching
,data area zooming
, andreset
.See Also
https://echarts.apache.org/en/option.html#toolbox
property tooltip
tooltip?: EChartOption.Tooltip | undefined;
Tooltip component. It can be configured on different places: + Configured on global:
tooltip
+ Configured in a coordinate system:grid.tooltip
,polar.tooltip
,single.tooltip
+ Configured in a series:series.tooltip
+ Configured in each item ofseries.data
:series.data.tooltip
See Also
https://echarts.apache.org/en/option.html#tooltip
property useUTC
useUTC?: boolean | undefined;
Whether to use UTC in display. -
true
: Whenaxis.type
is'time'
, ticks is determined according to UTC, andaxisLabel
andtooltip
use UTC by default. -false
: Whenaxis.type
is'time'
, ticks is determined according to local time, andaxisLabel
andtooltip
use local time by default.The default value of useUTC is false, for sake of considering: - In many cases, labels should be displayed in local time (whether the time is stored in server in local time or UTC). - If user uses time string (like '2012-01-02') in data, it usually means local time if time zone is not specified. Time should be displayed in its original time zone by default.
Notice: the setting only effects 'display time', but not 'parse time'. About how time value (like
1491339540396
,'2013-01-04'
, ...) is parsed in echarts, seethe time part in date
.See Also
https://echarts.apache.org/en/option.html#useUTC
property visualMap
visualMap?: EChartOption.VisualMap[] | undefined;
visualMap
is a type of component for visual encoding, which maps the data to visual channels, including: + symbol: Type of symbol. + symbolSize: Symbol size. + color: Symbol color. + colorAlpha: Symbol alpha channel. + opacity: Opacity of symbol and others (like labels). + colorLightness: Lightness in HSL. + colorSaturation: Saturation in HSL. + colorHue: Hue in HSL. MyltiplevisualMap
component could be defined in a chart instance, which enable that different dimensions of a series data are mapped to different visual channels.visualMap
could be defined asPiecewise (visualMapPiecewise)
orContinuous (visualMapContinuous)
, which is distinguished by the property type.Example 1
option = { visualMap: [ { // the first visualMap component type: 'continuous', // defined to be continuous viusalMap ... }, { // the sencond visualMap component type: 'piecewise', // defined to be piecewise visualMap ... } ], ... };
See Also
https://echarts.apache.org/en/option.html#visualMap
property xAxis
xAxis?: EChartOption.XAxis | EChartOption.XAxis[] | undefined;
The x axis in cartesian(rectangular) coordinate. Usually a single grid component can place at most 2 x axis, one on the bottom and another on the top. offset can be used to avoid overlap when you need to put more than two x axis.
See Also
https://echarts.apache.org/en/option.html#xAxis
property yAxis
yAxis?: EChartOption.YAxis | EChartOption.YAxis[] | undefined;
The y axis in cartesian(rectangular) coordinate. Usually a single grid component can place at most 2 y axis, one on the left and another on the right. offset can be used to avoid overlap when you need to put more than two y axis.
See Also
https://echarts.apache.org/en/option.html#yAxis
interface ECharts
interface ECharts {}
property group
group: string;
Group name to be used in chart connection
method appendData
appendData: (opts: { seriesIndex?: string | undefined; data?: any[] | TypedArray | undefined;}) => void;
The method is used in rendering millions of data (e.g. rendering geo data). In these scenario, the entire size of data is probably up to 10 or 100 MB, even using binary format. So chunked load data and rendering is required. When using
appendData
, the graphic elements that have been rendered will not be cleared, but keep rendering new graphic elements.Parameter opts
Data options.
method clear
clear: () => void;
Clears current instance; removes all components and charts in current instance.
method containPixel
containPixel: (finder: EChartsConvertFinder, value: any[]) => boolean;
Determine whether the given point is in the given coordinate systems or series.
Parameter finder
Indicate in which coordinate system conversion is performed. Generally, index or id or name can be used to specify coordinate system.
Parameter value
The value to be judged, in pixel coordinate system.
method convertFromPixel
convertFromPixel: ( finder: EChartsConvertFinder, value: any[] | string) => any[] | string;
Convert a point from pixel coordinate to logical coordinate (e.g., in geo, cartesian, graph, ...).
Parameter finder
Indicate in which coordinate system conversion is performed. Generally, index or id or name can be used to specify coordinate system.
Parameter value
The value to be converted.
method convertToPixel
convertToPixel: ( finder: EChartsConvertFinder, value: string | any[]) => string | any[];
Convert a point from logical coordinate (e.g., in geo, cartesian, graph, ...) to pixel coordinate.
Parameter finder
Indicate in which coordinate system conversion is performed. Generally, index or id or name can be used to specify coordinate system.
Parameter value
The value to be converted.
method dispatchAction
dispatchAction: (payload: object) => void;
Triggers chart action, like chart switch
legendToggleSelect
, zoom data areadataZoom
, show tooltipshowTip
and so on. See [action](https://echarts.apache.org/api.html#action) and [events](https://echarts.apache.org/api.html#events) for more information.Parameter payload
Trigger multiple actions through
batch
attribute.
method dispose
dispose: () => void;
Disposes instance. Once disposed, the instance can not be used again.
method getConnectedDataURL
getConnectedDataURL: (opts: { type: string; pixelRatio: number; backgroundColor: string; excludeComponents?: string[] | undefined;}) => string;
Exports connected chart image; returns a base64 url; can be set to
src
ofImage
. Position of charts in exported image are related to that of the container.Parameter opts
Options.
method getDataURL
getDataURL: (opts: { type?: string | undefined; pixelRatio?: number | undefined; backgroundColor?: string | undefined; excludeComponents?: string[] | undefined;}) => string;
Exports chart image; returns a base64 URL; can be set to
src
ofImage
.Parameter opts
Options.
method getDom
getDom: () => HTMLCanvasElement | HTMLDivElement;
Gets DOM element of ECharts instance container.
{HTMLCanvasElement|HTMLDivElement} DOM container.
method getHeight
getHeight: () => number;
Gets height of ECharts instance container.
{number} Height.
method getOption
getOption: () => EChartOption;
Gets
option
object maintained in current instance, which contains configuration item and data merged from previoussetOption
operations by users, along with user interaction states. For example, switching of legend, zooming area of data zoom, and so on. Therefore, a new instance that is exactly the same can be recovered from this option.
method getWidth
getWidth: () => number;
Gets width of ECharts instance container.
{number} Width.
method hideLoading
hideLoading: () => void;
Hides animation loading effect.
method isDisposed
isDisposed: () => boolean;
Returns whether current instance has been disposed.
{boolean} Whether has been disposed.
method off
off: (eventName: string, handler?: Function) => void;
Unbind event-handler function.
Parameter eventName
Event names are all in lower-cases, for example,
'click'
,'mousemove'
,'legendselected'
Parameter handler
The function to be unbound could be passed. Otherwise, all event functions of this type will be unbound.
method on
on: { (eventName: string, handler: Function, context?: object): void; ( eventName: string, query: string | Object, handler: Function, context?: object ): void;};
Binds event-handling function. There are two kinds of events in ECharts, one of which is mouse events, which will be triggered when the mouse clicks certain element in the chart, the other kind will be triggered after
dispatchAction
is called. Every action has a corresponding event. If event is triggered externally bydispatchAction
, and there is batch attribute in action to trigger batch action, then the corresponding response event parameters be in batch.Parameter eventName
Event names are all in lower-cases, for example,
'click'
,'mousemove'
,'legendselected'
Parameter handler
Event-handling function, whose format is as following: ```js (event: object) ```
Parameter context
context of callback function, what
this
refers to.Binds event-handling function. There are two kinds of events in ECharts, one of which is mouse events, which will be triggered when the mouse clicks certain element in the chart, the other kind will be triggered after
dispatchAction
is called. Every action has a corresponding event. If event is triggered externally bydispatchAction
, and there is batch attribute in action to trigger batch action, then the corresponding response event parameters be in batch.Parameter eventName
Event names are all in lower-cases, for example,
'click'
,'mousemove'
,'legendselected'
Parameter query
Condition for filtering, optional.
query
enables only call handlers on graphic elements of specified components. Can bestring
orObject
. Ifstring
, the formatter can be 'mainType' or 'mainType.subType'. For example: ```ts chart.on('click', 'series', function () {...}); chart.on('click', 'series.line', function () {...}); chart.on('click', 'dataZoom', function () {...}); chart.on('click', 'xAxis.category', function () {...}); ``` IfObject
, one or more properties below can be included, and any of them is optional. ```ts { Index: number // component index Name: string // component name Id: string // component id dataIndex: number // data item index name: string // data item name dataType: string // data item type, e.g., // 'node' and 'edge' in graph. element: string // element name in custom series } ``` For example: ```ts chart.setOption({ // ... series: [{ name: 'uuu' // ... }] }); chart.on('mouseover', {seriesName: 'uuu'}, function () { // When the graphic elements in the series with name 'uuu' mouse // overed, this method is called. }); ``` For example: ```ts chart.setOption({ // ... series: [{ type: 'graph', nodes: [{name: 'a', value: 10}, {name: 'b', value: 20}], edges: [{source: 0, target: 1}] }] }); chart.on('click', {dataType: 'node'}, function () { // When the nodes of the graph clicked, this method is called. }); chart.on('click', {dataType: 'edge'}, function () { // When the edges of the graph clicked, this method is called. }); ``` For example ```ts chart.setOption({ // ... series: { // ... type: 'custom', renderItem: function (params, api) { return { type: 'group', children: [{ type: 'circle', name: 'my_el', // ... }, { // ... }] } }, data: [[12, 33]] } }) chart.on('click', {targetName: 'my_el'}, function () { // When the element with name 'my_el' clicked, this method is called. }); ```Parameter handler
Event-handling function, whose format is as following: ```js (event: object) ```
Parameter context
context of callback function, what
this
refers to.
method resize
resize: (opts?: EChartsResizeOption) => void;
Resizes chart, which should be called manually when container size changes. When
opts
is not provided, DOM size is used.Parameter opts
Specify parameters explicitly.
method setOption
setOption: { ( option: EChartOption | EChartsResponsiveOption, notMerge?: boolean, lazyUpdate?: boolean ): void; ( option: EChartOption<EChartOption.Series>, opts?: EChartsOptionConfig ): void;};
Configuration item, data, universal interface, all parameters and data can all be modified through
setOption
. ECharts will merge new parameters and data, and then refresh chart.Parameter option
Configuration item and data. Please refer to [configuration item manual](https://echarts.apache.org/option.html) for more information.
Parameter notMerge
Whether not to merge with previous
option
Parameter lazyUpdate
Whether not to update chart immediately
Configuration item, data, universal interface, all parameters and data can all be modified through
setOption
. ECharts will merge new parameters and data, and then refresh chart.Parameter option
Configuration item and data. Please refer to [configuration item manual](https://echarts.apache.org/option.html) for more information.
Parameter opts
Options about how to setOption
method showLoading
showLoading: (type?: string, opts?: EChartsLoadingOption) => void;
Shows loading animation. You can call this interface manually before data is loaded, and call
hideLoading
to hide loading animation after data is loaded.Parameter type
Parameter opts
interface EChartsConvertFinder
interface EChartsConvertFinder {}
property geoId
geoId?: string | undefined;
property geoIndex
geoIndex?: number | undefined;
property geoName
geoName?: string | undefined;
property gridId
gridId?: string | undefined;
property gridIndex
gridIndex?: number | undefined;
property gridName
gridName?: string | undefined;
property seriesId
seriesId?: string | undefined;
property seriesIndex
seriesIndex?: number | undefined;
property seriesName
seriesName?: string | undefined;
property xAxisId
xAxisId?: string | undefined;
property xAxisIndex
xAxisIndex?: number | undefined;
property xAxisName
xAxisName?: string | undefined;
property yAxisId
yAxisId?: string | undefined;
property yAxisIndex
yAxisIndex?: number | undefined;
property yAxisName
yAxisName?: string | undefined;
interface EChartsLoadingOption
interface EChartsLoadingOption {}
Options for
echartsInstance.showLoading
method https://echarts.apache.org/en/api.html#echartsInstance.showLoading
property color
color?: string | undefined;
Loading circle color. '#c23531'
property fontSize
fontSize?: number | undefined;
Font size. 12 4.8.0
property lineWidth
lineWidth?: number | undefined;
Line width of the "spinner". 5 4.8.0
property maskColor
maskColor?: string | undefined;
Mask background color. 'rgba(255, 255, 255, 0.8)'
property showSpinner
showSpinner?: boolean | undefined;
Show an animated "spinner" or not. true 4.8.0
property spinnerRadius
spinnerRadius?: number | undefined;
Radius of the "spinner". 10 4.8.0
property text
text?: string | undefined;
Loading text. 'loading'
property textColor
textColor?: string | undefined;
Loading text color. '#000'
property zlevel
zlevel?: number | undefined;
Zlevel of loading. If not 0, it creates a new canvas for loading. 0
interface EChartsOptionConfig
interface EChartsOptionConfig {}
property lazyUpdate
lazyUpdate?: boolean | undefined;
property notMerge
notMerge?: boolean | undefined;
property silent
silent?: boolean | undefined;
interface EChartsResizeOption
interface EChartsResizeOption {}
interface EChartsResponsiveOption
interface EChartsResponsiveOption {}
property baseOption
baseOption?: EChartOption | undefined;
property media
media?: EChartsMediaOption[] | undefined;
interface EChartTitleOption
interface EChartTitleOption {}
property backgroundColor
backgroundColor?: string | undefined;
property borderColor
borderColor?: string | undefined;
property borderRadius
borderRadius?: number | number[] | undefined;
property borderWidth
borderWidth?: number | undefined;
property bottom
bottom?: string | number | undefined;
property itemGap
itemGap?: number | undefined;
property left
left?: string | number | undefined;
property link
link?: string | undefined;
property padding
padding?: number | number[] | undefined;
Title space around content. The unit is
px
. Default values for each position are 5. And they can be set to different values with left, right, top, and bottom.
property right
right?: string | number | undefined;
property shadowBlur
shadowBlur?: number | undefined;
property shadowColor
shadowColor?: number | undefined;
property shadowOffsetX
shadowOffsetX?: number | undefined;
property shadowOffsetY
shadowOffsetY?: number | undefined;
property show
show?: boolean | undefined;
property sublink
sublink?: string | undefined;
property subtarget
subtarget?: string | undefined;
property subtext
subtext?: string | undefined;
property subtextStyle
subtextStyle?: EChartOption.TextStyleWithRich | undefined;
property target
target?: string | undefined;
property text
text?: string | undefined;
property textAlign
textAlign?: string | undefined;
property textStyle
textStyle?: EChartOption.TextStyleWithRich | undefined;
property textVerticalAlign
textVerticalAlign?: string | undefined;
property top
top?: string | number | undefined;
property triggerEvent
triggerEvent?: boolean | undefined;
property z
z?: number | undefined;
property zlevel
zlevel?: number | undefined;
interface ERectangle
interface ERectangle {}
interface Graphic
interface Graphic {}
property LinearGradient
LinearGradient: zrender.LinearGradient;
x, y, x2, y2 are all percent from 0 to 1
method clipPointsByRect
clipPointsByRect: (points: number[][], rect: ERectangle) => number[][];
Clip the given points by the given rectangular.
Parameter points
The points to be clipped, like [[23, 44], [12, 15], ...].
Parameter rect
The rectangular that is used to clip points.
method clipRectByRect
clipRectByRect: (targetRect: ERectangle, rect: ERectangle) => ERectangle;
Clip the first input rectangular by the second input rectangular.
Parameter targetRect
The rectangular to be clipped.
Parameter rect
The rectangular that is used to clip targetRect.
method extendShape
extendShape: (opt: zrender.graphic.Path) => zrender.graphic.Path;
Create a new shape class.
Parameter opt
{zrender.graphic.Path}
method getShapeClass
getShapeClass: (name: string) => zrender.graphic.Path;
Get the registered shape class.
Parameter name
{zrender.graphic.Path}
method registerShape
registerShape: (name: string, ShapeClass: zrender.graphic.Path) => void;
Register a user defined shape.
Parameter name
Parameter ShapeClass
interface MapObj
interface MapObj {}
property geoJson
geoJson: object;
geoJson data for map
property specialAreas
specialAreas: object;
special areas fro map
type EChartsMediaOption
type EChartsMediaOption = { query: { width?: number | undefined; height?: number | undefined; aspectRatio?: number | undefined; minWidth?: number | undefined; minHeight?: number | undefined; minAspectRatio?: number | undefined; maxWidth?: number | undefined; maxHeight?: number | undefined; maxAspectRatio?: number | undefined; }; option: EChartOption;};
type EChartsSeriesType
type EChartsSeriesType = | 'line' | 'bar' | 'pie' | 'scatter' | 'effectScatter' | 'radar' | 'tree' | 'treemap' | 'sunburst' | 'boxplot' | 'candlestick' | 'heatmap' | 'map' | 'parallel' | 'lines' | 'graph' | 'sankey' | 'funnel' | 'gauge' | 'pictorialBar' | 'themeRiver' | 'custom';
type TypedArray
type TypedArray = | Int8Array | Uint8Array | Int16Array | Uint16Array | Int32Array | Uint32Array | Uint8ClampedArray | Float32Array | Float64Array;
namespace echarts.EChartOption
namespace echarts.EChartOption {}
interface SeriesBar
interface SeriesBar {}
**bar chart**
Bar chart shows different data through the height of a bar, which is used in [rectangular coordinate](https://echarts.apache.org/en/option.html#grid) with at least 1 category axis.
See Also
https://echarts.apache.org/en/option.html#series-bar
property animation
animation?: boolean | undefined;
Whether to enable animation.
"true"
See Also
https://echarts.apache.org/en/option.html#series-bar.animation
property animationDelay
animationDelay?: Function | number | undefined;
Delay before updating the first animation, which supports callback function for different data to have different animation effect.
For example:
[see doc](https://echarts.apache.org/en/option.html#series-bar.bar)
See [this example](https://echarts.apache.org/examples/en/editor.html?c=bar-animation-delay) for more information.
See Also
https://echarts.apache.org/en/option.html#series-bar.animationDelay
property animationDelayUpdate
animationDelayUpdate?: Function | number | undefined;
Delay before updating animation, which supports callback function for different data to have different animation effect.
For example:
[see doc](https://echarts.apache.org/en/option.html#series-bar.bar)
See [this example](https://echarts.apache.org/examples/en/editor.html?c=bar-animation-delay) for more information.
See Also
https://echarts.apache.org/en/option.html#series-bar.animationDelayUpdate
property animationDuration
animationDuration?: Function | number | undefined;
Duration of the first animation, which supports callback function for different data to have different animation effect:
[see doc](https://echarts.apache.org/en/option.html#series-bar.bar)
1000
See Also
https://echarts.apache.org/en/option.html#series-bar.animationDuration
property animationDurationUpdate
animationDurationUpdate?: Function | number | undefined;
Time for animation to complete, which supports callback function for different data to have different animation effect:
[see doc](https://echarts.apache.org/en/option.html#series-bar.bar)
300
See Also
https://echarts.apache.org/en/option.html#series-bar.animationDurationUpdate
property animationEasing
animationEasing?: string | undefined;
Easing method used for the first animation. Varied easing effects can be found at [easing effect example](https://echarts.apache.org/examples/en/editor.html?c=line-easing) .
"cubicOut"
See Also
https://echarts.apache.org/en/option.html#series-bar.animationEasing
property animationEasingUpdate
animationEasingUpdate?: string | undefined;
Easing method used for animation.
"cubicOut"
See Also
https://echarts.apache.org/en/option.html#series-bar.animationEasingUpdate
property animationThreshold
animationThreshold?: number | undefined;
Whether to set graphic number threshold to animation. Animation will be disabled when graphic number is larger than threshold.
2000
See Also
https://echarts.apache.org/en/option.html#series-bar.animationThreshold
property barCategoryGap
barCategoryGap?: string | undefined;
The bar gap of a single series, defaults to be
20%
of the category gap, can be set as a fixed value.In a single coodinate system, this attribute is shared by multiple
'bar'
series. This attribute should be set on the last'bar'
series in the coodinate system, then it will be adopted by all'bar'
series in the coordinate system.'20%'
See Also
https://echarts.apache.org/en/option.html#series-bar.barCategoryGap
property barGap
barGap?: string | undefined;
The gap between bars between different series, is a percent value like
'30%'
, which means30%
of the bar width.Set barGap as
'-100%'
can overlap bars that belong to different series, which is useful when making a series of bar be background.In a single coodinate system, this attribute is shared by multiple
'bar'
series. This attribute should be set on the last'bar'
series in the coodinate system, then it will be adopted by all'bar'
series in the coordinate system.For example:
[see doc](https://echarts.apache.org/en/option.html#series-bar.bar)
30%
See Also
https://echarts.apache.org/en/option.html#series-bar.barGap
property barMaxWidth
barMaxWidth?: number | string | undefined;
The maximum width of the bar. Adaptive when not specified.
Has higer priority than barWidth.
Can be an absolute value like 40 or a percent value like '60%'. The percent is based on the calculated category width.
In a single coodinate system, this attribute is shared by multiple
'bar'
series. This attribute should be set on the last'bar'
series in the coodinate system, then it will be adopted by all'bar'
series in the coordinate system.See Also
https://echarts.apache.org/en/option.html#series-bar.barMaxWidth
property barMinHeight
barMinHeight?: number | undefined;
The minimum width of bar. It could be used to avoid the following situation: the interaction would be affected when the value of some data item is too small.
See Also
https://echarts.apache.org/en/option.html#series-bar.barMinHeight
property barMinWidth
barMinWidth?: number | string | undefined;
The minimum width of the bar. In cartesian the default value is 1, otherwise the default value if null.
Has higer priority than barWidth.
Can be an absolute value like 40 or a percent value like ''60%''. The percent is based on the calculated category width.
In a single coodinate system, this attribute is shared by multiple ''bar'' series. This attribute should be set on the last ''bar'' series in the coodinate system, then it will be adopted by all 'bar' series in the coordinate system.
*
See Also
https://echarts.apache.org/en/option.html#series-bar.barMinWidth
property barWidth
barWidth?: number | string | undefined;
The width of the bar. Adaptive when not specified.
Can be an absolute value like 40 or a percent value like '60%'. The percent is based on the calculated category width.
In a single coodinate system, this attribute is shared by multiple
'bar'
series. This attribute should be set on the last'bar'
series in the coodinate system, then it will be adopted by all'bar'
series in the coordinate system.See Also
https://echarts.apache.org/en/option.html#series-bar.barWidth
property clip
clip?: boolean | undefined;
If clip the overflow on the coordinate system. Clip results varies between series:
Scatter/EffectScatter:Ignore the symbols exceeds the coordinate system. Not clip the elements. Bar:Clip all the overflowed. With bar width kept. Line:Clip the overflowed line. Lines: Clip all the overflowed. Candlestick: Ignore the elements exceeds the coordinate system. Custom: Clip all the olverflowed.
All these series have default value true except custom series. Set it to false if you don't want to clip.
See Also
https://echarts.apache.org/en/option.html#series-bar.clip
property coordinateSystem
coordinateSystem?: string | undefined;
The coordinate used in the series, whose options are:
+
'cartesian2d'
Use a two-dimensional rectangular coordinate (also known as Cartesian coordinate), with [xAxisIndex](https://echarts.apache.org/en/option.html#series-bar.xAxisIndex) and [yAxisIndex](https://echarts.apache.org/en/option.html#series-bar.yAxisIndex) to assign the corresponding axis component.
"cartesian2d"
See Also
https://echarts.apache.org/en/option.html#series-bar.coordinateSystem
property cursor
cursor?: string | undefined;
The mouse style when mouse hovers on an element, the same as
cursor
property inCSS
."pointer"
See Also
https://echarts.apache.org/en/option.html#series-bar.cursor
property data
data?: | Array<void | string | number | SeriesBar.DataObject> | Array<Array<void | string | number | SeriesBar.DataObject>> | undefined;
Data array of series, which can be in the following forms:
Notice, if no
data
specified in series, and there is [dataset](https://echarts.apache.org/en/option.html#dataset) in option, series will use the first [dataset](https://echarts.apache.org/en/option.html#dataset) as its datasource. Ifdata
has been specified, [dataset](https://echarts.apache.org/en/option.html#dataset) will not used.series.datasetIndex
can be used to specify other [dataset](https://echarts.apache.org/en/option.html#dataset) .Basically, data is represented by a two-dimension array, like the example below, where each colum is named as a "dimension".
[see doc](https://echarts.apache.org/en/option.html#series-bar.bar)
+ In [cartesian (grid)](https://echarts.apache.org/en/option.html#grid) , "dimX" and "dimY" correspond to [xAxis](https://echarts.apache.org/en/option.html#xAxis) and [yAxis](https://echarts.apache.org/en/option.html#yAxis) repectively. + In [polar](https://echarts.apache.org/en/option.html#polar) "dimX" and "dimY" correspond to [radiusAxis](https://echarts.apache.org/en/option.html#radiusAxis) 和 [angleAxis](https://echarts.apache.org/en/option.html#anbleAxis) repectively. + Other dimensions are optional, which can be used in other place. For example: + [visualMap](https://echarts.apache.org/en/option.html#visualMap) can map one or more dimensions to viusal (color, symbol size ...). + [series.symbolSize](https://echarts.apache.org/en/option.html#series.symbolSize) can be set as a callback function, where symbol size can be calculated by values of a certain dimension. + Values in other dimensions can be shown by [tooltip.formatter](https://echarts.apache.org/en/option.html#tooltip.formatter) or [series.label.formatter](https://echarts.apache.org/en/option.html#series.label.formatter) .
Especially, when there is one and only one category axis (axis.type is
'category'
), data can be simply be represented by a one-dimension array, like:[see doc](https://echarts.apache.org/en/option.html#series-bar.bar)
**Relationship between "value" and [axis.type](https://echarts.apache.org/en/option.html#xAxis.type) **
+ When a dimension corresponds to a value axis (axis.type is
'value'
or'log'
):The value can be a
number
(like12
) (can also be a number in astring
format, like'12'
).+ When a dimension corresponds to a category axis (axis.type is
'category'
):The value should be the ordinal of the axis.data (based on
0
), the string value of the axis.data. For example:[see doc](https://echarts.apache.org/en/option.html#series-bar.bar)
There is an example of double category axes: [Github Punchcard](https://echarts.apache.org/examples/en/editor.html?c=scatter-punchCard) .
+ When a dimension corresponds to a time axis (type is
'time'
), the value can be:+ a timestamp, like
1484141700832
, which represents a UTC time. + a date string, in one of the formats below: + a subset of [ISO 8601](http://www.ecma-international.org/ecma-262/5.1/#se c-15.9.1.15) , only including (all of these are treated as local time unless timezone is specified, which is consistent with [moment](https://momentjs.com/) ): + only part of year/month/date/time are specified:'2012-03'
,'2012-03-01'
,'2012-03-01 05'
,'2012-03-01 05:06'
. + separated by"T"
or a space:'2012-03-01T12:22:33.123'
,'2012-03-01 12:22:33.123'
. + timezone specified:'2012-03-01T12:22:33Z'
,'2012-03-01T12:22:33+8000'
,'2012-03-01T12:22:33-05:00'
. + other date string format (all of these are treated as local time):'2012'
,'2012-3-1'
,'2012/3/1'
,'2012/03/01'
,'2009/6/12 2:00'
,'2009/6/12 2:05:08'
,'2009/6/12 2:05:08.123'
. + a JavaScript Date instance created by user: + Caution, when using a data string to create a Date instance, [browser differences and inconsistencies](http://dygraphs.com/date-formats.html) should be considered. + For example: In chrome,new Date('2012-01-01')
is treated as a Jan 1st 2012 in UTC, whilenew Date('2012-1-1')
and `new Date('2012/01/01')` are treated as Jan 1st 2012 in local timezone. In safarinew Date('2012-1-1')
is not supported. + So if you intent to performnew Date(dateString)
, it is strongly recommended to use a time parse library (e.g., [moment](https://momentjs.com/) ), or useecharts.number.parseDate
, or check [this](http://dygraphs.com/date-formats.html) .**Customize a data item:**
When needing to customize a data item, it can be set as an object, where property
value
reprensent real value. For example:[see doc](https://echarts.apache.org/en/option.html#series-bar.bar)
**Empty value:**
'-'
ornull
orundefined
orNaN
can be used to describe that a data item is not exists (ps:_not exist_ does not means its value is0
).For example, line chart can break when encounter an empty value, and scatter chart do not display graphic elements for empty values.
See Also
https://echarts.apache.org/en/option.html#series-bar.data
property datasetIndex
datasetIndex?: number | undefined;
If [series.data](https://echarts.apache.org/en/option.html#series.data) is not specified, and [dataset](https://echarts.apache.org/en/option.html#dataset) exists, the series will use
dataset
.datasetIndex
specifies which dataset will be used.See Also
https://echarts.apache.org/en/option.html#series-bar.datasetIndex
property dimensions
dimensions?: any[] | undefined;
dimensions
can be used to define dimension info forseries.data
ordataset.source
.Notice: if [dataset](https://echarts.apache.org/en/option.html#dataset) is used, we can provide dimension names in the first column/row of [dataset.source](https://echarts.apache.org/en/option.html#dataset.source) , and not need to specify
dimensions
here. But ifdimensions
is specified here, echarts will not retrieve dimension names from the first row/column ofdataset.source
any more.For example:
[see doc](https://echarts.apache.org/en/option.html#series-bar.bar) [see doc](https://echarts.apache.org/en/option.html#series-bar.bar)
Each data item of
dimensions
can be:+
string
, for example,'someName'
, which equals to `{name: 'someName'}`. +Object
, where the attributes can be: + name:string
. + type:string
, supports: +number
+float
, that is, [Float64Array](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Float64Array)+
int
, that is, [Int32Array](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Int32Array)+
ordinal
, discrete value, which represents string generally. +time
, time value, see [data](https://echarts.apache.org/en/option.html#series.data) to check the format of time value. + displayName:string
, generally used in tooltip for dimension display. If not specified, usename
by default.When
dimensions
is specified, the defaulttooltip
will be displayed vertically, which is better to show diemsion names. Otherwise,tooltip
will displayed only value horizontally.See Also
https://echarts.apache.org/en/option.html#series-bar.dimensions
property emphasis
emphasis?: | { /** * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label */ label?: | { /** * Whether to show label. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.show */ show?: boolean | undefined;
/** * Label position. * * **Followings are the options:** * * + \[x, y\] * * Use relative percentage, or absolute pixel values to * represent position of label relative to top-left corner * of bounding box. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.emphasis.label) * * + 'top' * * + 'left' * + 'right' * + 'bottom' * + 'inside' * + 'insideLeft' * + 'insideRight' * + 'insideTop' * + 'insideBottom' * + 'insideTopLeft' * + 'insideBottomLeft' * + 'insideTopRight' * + 'insideBottomRight' * * See: * [label position](https://echarts.apache.org/examples/en/view.html?c=doc-example/label-position) * . * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.position */ position?: any[] | string | undefined;
/** * Distance to the host graphic element. * Works when position is string value (like `'top'`、`'insideRight'`). * * See: * [label position](https://echarts.apache.org/examples/en/editor.html?c=doc-example/label-position) * . * * @default * 5 * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.distance */ distance?: number | undefined;
/** * Rotate label, from -90 degree to 90, positive value represents * rotate anti-clockwise. * * See: * [label rotation](https://echarts.apache.org/examples/en/editor.html?c=bar-label-rotation) * . * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rotate */ rotate?: number | undefined;
/** * Whether to move text slightly. * For example: `[30, 40]` means move `30` horizontally * and move `40` vertically. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.offset */ offset?: any[] | undefined;
/** * Data label formatter, which supports string template * and callback function. * In either form, `\n` is supported to represent a new * line. * * **String template** * * Model variation includes: * * + `{a}`: series name. * + `{b}`: the name of a data item. * + `{c}`: the value of a data item. * + `{@xxx}: the value of a dimension named`'xxx'`, for * example,`{@product}`refers the value of`'product'\` dimension。 * + `{@[n]}: the value of a dimension at the index of`n`, * for example,`{@\[3\]}\` refers the value at dimensions\[3\]. * * **example:** * * ``` * formatter: '{b}: {@score}' * * ``` * * **Callback function** * * Callback function is in form of: * * ``` * (params: Object|Array) => string * * ``` * * where `params` is the single dataset needed by formatter, * which is formed as: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.emphasis.label) * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.formatter */ formatter?: Function | string | undefined;
/** * text color. * * If set as `'auto'`, the color will assigned as visual * color, such as series color. * * @default * ""#fff"" * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.color */ color?: string | undefined;
/** * font style * * Options are: * * + `'normal'` * + `'italic'` * + `'oblique'` * * @default * "normal" * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.fontStyle */ fontStyle?: string | undefined;
/** * font thick weight * * Options are: * * + `'normal'` * + `'bold'` * + `'bolder'` * + `'lighter'` * + 100 | 200 | 300 | 400... * * @default * "normal" * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.fontWeight */ fontWeight?: string | number | undefined;
/** * font family * * Can also be 'serif' , 'monospace', ... * * @default * "sans-serif" * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.fontFamily */ fontFamily?: string | undefined;
/** * font size * * @default * 12 * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.fontSize */ fontSize?: number | undefined;
/** * Horizontal alignment of text, automatic by default. * * Options are: * * + `'left'` * + `'center'` * + `'right'` * * If `align` is not set in `rich`, `align` in parent level * will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.emphasis.label) * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.align */ align?: string | undefined;
/** * Vertical alignment of text, automatic by default. * * Options are: * * + `'top'` * + `'middle'` * + `'bottom'` * * If `verticalAlign` is not set in `rich`, `verticalAlign` * in parent level will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.emphasis.label) * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.verticalAlign */ verticalAlign?: string | undefined;
/** * Line height of the text fregment. * * If `lineHeight` is not set in `rich`, `lineHeight` in * parent level will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.emphasis.label) * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.lineHeight */ lineHeight?: number | undefined;
/** * Background color of the text fregment. * * Can be color string, like `'#123234'`, `'red'`, `rgba(0,23,11,0.3)'`. * * Or image can be used, for example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.emphasis.label) * * `width` or `height` can be specified when using background * image, or auto adapted by default. * * If set as `'auto'`, the color will assigned as visual * color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.backgroundColor */ backgroundColor?: object | string | undefined;
/** * Border color of the text fregment. * * If set as `'auto'`, the color will assigned as visual * color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.borderColor */ borderColor?: string | undefined;
/** * Border width of the text fregment. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.borderWidth */ borderWidth?: number | undefined;
/** * Border radius of the text fregment. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.borderRadius */ borderRadius?: number | undefined;
/** * Padding of the text fregment, for example: * * + `padding: [3, 4, 5, 6]`: represents padding of `[top, * right, bottom, left]`. * + `padding: 4`: represents `padding: [4, 4, 4, 4]`. * + `padding: [3, 4]`: represents `padding: [3, 4, 3, 4]`. * * Notice, `width` and `height` specifies the width and * height of the content, without `padding`. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.padding */ padding?: any[] | number | undefined;
/** * Shadow color of the text block. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.shadowColor */ shadowColor?: string | undefined;
/** * Show blur of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.shadowBlur */ shadowBlur?: number | undefined;
/** * Shadow X offset of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.shadowOffsetX */ shadowOffsetX?: number | undefined;
/** * Shadow Y offset of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.shadowOffsetY */ shadowOffsetY?: number | undefined;
/** * Width of the text block. * It is the width of the text by default. * In most cases, there is no need to specify it. * You may want to use it in some cases like make simple * table or using background image (see `backgroundColor`). * * Notice, `width` and `height` specifies the width and * height of the content, without `padding`. * * `width` can also be percent string, like `'100%'`, which * represents the percent of `contentWidth` (that is, the * width without `padding`) of its container box. * It is based on `contentWidth` because that each text * fregment is layout based on the `content box`, where * it makes no sense that calculating width based on `outerWith` * in prectice. * * Notice, `width` and `height` only work when `rich` specified. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.width */ width?: number | string | undefined;
/** * Height of the text block. * It is the width of the text by default. * You may want to use it in some cases like using background * image (see `backgroundColor`). * * Notice, `width` and `height` specifies the width and * height of the content, without `padding`. * * Notice, `width` and `height` only work when `rich` specified. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.height */ height?: number | string | undefined;
/** * Storke color of the text. * * If set as `'auto'`, the color will assigned as visual * color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.textBorderColor */ textBorderColor?: string | undefined;
/** * Storke line width of the text. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.textBorderWidth */ textBorderWidth?: number | undefined;
/** * Shadow color of the text itself. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.textShadowColor */ textShadowColor?: string | undefined;
/** * Shadow blue of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.textShadowBlur */ textShadowBlur?: number | undefined;
/** * Shadow X offset of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.textShadowOffsetX */ textShadowOffsetX?: number | undefined;
/** * Shadow Y offset of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.textShadowOffsetY */ textShadowOffsetY?: number | undefined;
/** * "Rich text styles" can be defined in this `rich` property. * For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.emphasis.label) * * For more details, see * [Rich Text](https://echarts.apache.org/en/option.htmltutorial.html#Rich%20Text) * please. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich */ rich?: | { /** * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E */ [userStyle: string]: { /** * text color. * * If set as `'auto'`, the color will assigned as * visual color, such as series color. * * @default * ""#fff"" * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.color */ color?: string | undefined;
/** * font style * * Options are: * * + `'normal'` * + `'italic'` * + `'oblique'` * * @default * "normal" * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.fontStyle */ fontStyle?: string | undefined;
/** * font thick weight * * Options are: * * + `'normal'` * + `'bold'` * + `'bolder'` * + `'lighter'` * + 100 | 200 | 300 | 400... * * @default * "normal" * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.fontWeight */ fontWeight?: string | number | undefined;
/** * font family * * Can also be 'serif' , 'monospace', ... * * @default * "sans-serif" * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.fontFamily */ fontFamily?: string | undefined;
/** * font size * * @default * 12 * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.fontSize */ fontSize?: number | undefined;
/** * Horizontal alignment of text, automatic by default. * * Options are: * * + `'left'` * + `'center'` * + `'right'` * * If `align` is not set in `rich`, `align` in parent * level will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E) * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.align */ align?: string | undefined;
/** * Vertical alignment of text, automatic by default. * * Options are: * * + `'top'` * + `'middle'` * + `'bottom'` * * If `verticalAlign` is not set in `rich`, `verticalAlign` * in parent level will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E) * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.verticalAlign */ verticalAlign?: string | undefined;
/** * Line height of the text fregment. * * If `lineHeight` is not set in `rich`, `lineHeight` * in parent level will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E) * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.lineHeight */ lineHeight?: number | undefined;
/** * Background color of the text fregment. * * Can be color string, like `'#123234'`, `'red'`, * `rgba(0,23,11,0.3)'`. * * Or image can be used, for example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E) * * `width` or `height` can be specified when using * background image, or auto adapted by default. * * If set as `'auto'`, the color will assigned as * visual color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.backgroundColor */ backgroundColor?: object | string | undefined;
/** * Border color of the text fregment. * * If set as `'auto'`, the color will assigned as * visual color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.borderColor */ borderColor?: string | undefined;
/** * Border width of the text fregment. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.borderWidth */ borderWidth?: number | undefined;
/** * Border radius of the text fregment. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.borderRadius */ borderRadius?: number | undefined;
/** * Padding of the text fregment, for example: * * + `padding: [3, 4, 5, 6]`: represents padding * of `[top, right, bottom, left]`. * + `padding: 4`: represents `padding: [4, 4, 4, * 4]`. * + `padding: [3, 4]`: represents `padding: [3, * 4, 3, 4]`. * * Notice, `width` and `height` specifies the width * and height of the content, without `padding`. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.padding */ padding?: any[] | number | undefined;
/** * Shadow color of the text block. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.shadowColor */ shadowColor?: string | undefined;
/** * Show blur of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.shadowBlur */ shadowBlur?: number | undefined;
/** * Shadow X offset of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.shadowOffsetX */ shadowOffsetX?: number | undefined;
/** * Shadow Y offset of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.shadowOffsetY */ shadowOffsetY?: number | undefined;
/** * Width of the text block. * It is the width of the text by default. * In most cases, there is no need to specify it. * You may want to use it in some cases like make * simple table or using background image (see `backgroundColor`). * * Notice, `width` and `height` specifies the width * and height of the content, without `padding`. * * `width` can also be percent string, like `'100%'`, * which represents the percent of `contentWidth` * (that is, the width without `padding`) of its * container box. * It is based on `contentWidth` because that each * text fregment is layout based on the `content * box`, where it makes no sense that calculating * width based on `outerWith` in prectice. * * Notice, `width` and `height` only work when `rich` * specified. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.width */ width?: number | string | undefined;
/** * Height of the text block. * It is the width of the text by default. * You may want to use it in some cases like using * background image (see `backgroundColor`). * * Notice, `width` and `height` specifies the width * and height of the content, without `padding`. * * Notice, `width` and `height` only work when `rich` * specified. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.height */ height?: number | string | undefined;
/** * Storke color of the text. * * If set as `'auto'`, the color will assigned as * visual color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.textBorderColor */ textBorderColor?: string | undefined;
/** * Storke line width of the text. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.textBorderWidth */ textBorderWidth?: number | undefined;
/** * Shadow color of the text itself. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.textShadowColor */ textShadowColor?: string | undefined;
/** * Shadow blue of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.textShadowBlur */ textShadowBlur?: number | undefined;
/** * Shadow X offset of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.textShadowOffsetX */ textShadowOffsetX?: number | undefined;
/** * Shadow Y offset of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.label.rich.%3Cuser%20defined%20style%20name%3E.textShadowOffsetY */ textShadowOffsetY?: number | undefined; }; } | undefined; } | undefined;
/** * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.itemStyle */ itemStyle?: | { /** * Bar color.. * * @default * "auto" * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.itemStyle.color */ color?: string | undefined;
/** * The bodrder color of bar. * * @default * '#000' * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.itemStyle.barBorderColor */ barBorderColor?: string | undefined;
/** * The bodrder width of bar. defaults to have no border. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.itemStyle.barBorderWidth */ barBorderWidth?: number | undefined;
/** * Size of shadow blur. * This attribute should be used along with `shadowColor`,`shadowOffsetX`, * `shadowOffsetY` to set shadow to component. * * For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.emphasis.itemStyle) * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.itemStyle.shadowBlur */ shadowBlur?: number | undefined;
/** * Shadow color. Support same format as `color`. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.itemStyle.shadowColor */ shadowColor?: string | undefined;
/** * Offset distance on the horizontal direction of shadow. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.itemStyle.shadowOffsetX */ shadowOffsetX?: number | undefined;
/** * Offset distance on the vertical direction of shadow. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.itemStyle.shadowOffsetY */ shadowOffsetY?: number | undefined;
/** * Opacity of the component. * Supports value from 0 to 1, and the component will not * be drawn when set to 0. * * @see https://echarts.apache.org/en/option.html#series-bar.emphasis.itemStyle.opacity */ opacity?: number | undefined; } | undefined; } | undefined;
See Also
https://echarts.apache.org/en/option.html#series-bar.emphasis
property encode
encode?: object | undefined;
Define what is encoded to for each dimension of
data
. For example:[see doc](https://echarts.apache.org/en/option.html#series-bar.bar)
Attributes of encode are different according to the type of coordinate systtems. For [cartesian2d](https://echarts.apache.org/en/option.html#grid) ,
x
andy
can be defined. For [polar](https://echarts.apache.org/en/option.html#polar) ,radius
andangle
can be defined. For [geo](https://echarts.apache.org/en/option.html#geo) ,lng
andlat
can be defined. Attributetooltip
anditemName
(data item name in tooltip) are always able to be defined.When [dimensions](https://echarts.apache.org/en/option.html#series.dimensions) is used to defined name for a certain dimension,
encode
can refer the name directly. For example:[see doc](https://echarts.apache.org/en/option.html#series-bar.bar)
Specially, in [custom series(~series-custom), some property in
encode
, corresponding to axis, can be set as null to make the series not controlled by the axis, that is, the series data will not be count in the extent of the axis, and the [dataZoom](https://echarts.apache.org/en/option.html#dataZoom) on the axis will not filter the series.[see doc](https://echarts.apache.org/en/option.html#series-bar.bar)
See Also
https://echarts.apache.org/en/option.html#series-bar.encode
property id
id?: string | undefined;
Component ID, not specified by default. If specified, it can be used to refer the component in option or API.
See Also
https://echarts.apache.org/en/option.html#series-bar.id
property itemStyle
itemStyle?: | { /** * Some properties like "normal" or "emphasis" are not documented. * Please, write description for them */ [unknownProperty: string]: any;
/** * Bar color. defaults to acquire colors from global palette * [option.color](https://echarts.apache.org/en/option.html#color) * . * * @default * "auto" * @see https://echarts.apache.org/en/option.html#series-bar.itemStyle.color */ color?: EChartOption.Color | undefined;
/** * The bodrder color of bar. * * @default * '#000' * @see https://echarts.apache.org/en/option.html#series-bar.itemStyle.barBorderColor */ barBorderColor?: string | undefined;
/** * The bodrder width of bar. defaults to have no border. * * @see https://echarts.apache.org/en/option.html#series-bar.itemStyle.barBorderWidth */ barBorderWidth?: number | undefined;
/** * The radius of rounded corner. * Its unit is px. * And it supports use array to respectively specify the 4 corner * radiuses. * * For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.itemStyle) * * @see https://echarts.apache.org/en/option.html#series-bar.itemStyle.barBorderRadius */ barBorderRadius?: any[] | number | undefined;
/** * Size of shadow blur. * This attribute should be used along with `shadowColor`,`shadowOffsetX`, * `shadowOffsetY` to set shadow to component. * * For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.itemStyle) * * @see https://echarts.apache.org/en/option.html#series-bar.itemStyle.shadowBlur */ shadowBlur?: number | undefined;
/** * Shadow color. Support same format as `color`. * * @see https://echarts.apache.org/en/option.html#series-bar.itemStyle.shadowColor */ shadowColor?: EChartOption.Color | undefined;
/** * Offset distance on the horizontal direction of shadow. * * @see https://echarts.apache.org/en/option.html#series-bar.itemStyle.shadowOffsetX */ shadowOffsetX?: number | undefined;
/** * Offset distance on the vertical direction of shadow. * * @see https://echarts.apache.org/en/option.html#series-bar.itemStyle.shadowOffsetY */ shadowOffsetY?: number | undefined;
/** * Opacity of the component. * Supports value from 0 to 1, and the component will not be * drawn when set to 0. * * @see https://echarts.apache.org/en/option.html#series-bar.itemStyle.opacity */ opacity?: number | undefined; } | undefined;
Graphic style of ,
emphasis
is the style when it is highlighted, like being hovered by mouse, or highlighted via legend connect.See Also
https://echarts.apache.org/en/option.html#series-bar.itemStyle
property label
label?: | { /** * Some properties like "normal" or "emphasis" are not documented. * Please, write description for them */ [unknownProperty: string]: any;
/** * Whether to show label. * * @see https://echarts.apache.org/en/option.html#series-bar.label.show */ show?: boolean | undefined;
/** * Label position. * * **Followings are the options:** * * + \[x, y\] * * Use relative percentage, or absolute pixel values to represent * position of label relative to top-left corner of bounding * box. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.label) * * + 'top' * * + 'left' * + 'right' * + 'bottom' * + 'inside' * + 'insideLeft' * + 'insideRight' * + 'insideTop' * + 'insideBottom' * + 'insideTopLeft' * + 'insideBottomLeft' * + 'insideTopRight' * + 'insideBottomRight' * * See: * [label position](https://echarts.apache.org/examples/en/view.html?c=doc-example/label-position) * . * * @default * "inside" * @see https://echarts.apache.org/en/option.html#series-bar.label.position */ position?: any[] | string | undefined;
/** * Distance to the host graphic element. * Works when position is string value (like `'top'`、`'insideRight'`). * * See: * [label position](https://echarts.apache.org/examples/en/editor.html?c=doc-example/label-position) * . * * @default * 5 * @see https://echarts.apache.org/en/option.html#series-bar.label.distance */ distance?: number | undefined;
/** * Rotate label, from -90 degree to 90, positive value represents * rotate anti-clockwise. * * See: * [label rotation](https://echarts.apache.org/examples/en/editor.html?c=bar-label-rotation) * . * * @see https://echarts.apache.org/en/option.html#series-bar.label.rotate */ rotate?: number | undefined;
/** * Whether to move text slightly. * For example: `[30, 40]` means move `30` horizontally and * move `40` vertically. * * @see https://echarts.apache.org/en/option.html#series-bar.label.offset */ offset?: any[] | undefined;
/** * Data label formatter, which supports string template and * callback function. * In either form, `\n` is supported to represent a new line. * * **String template** * * Model variation includes: * * + `{a}`: series name. * + `{b}`: the name of a data item. * + `{c}`: the value of a data item. * + `{@xxx}: the value of a dimension named`'xxx'`, for example,`{@product}`refers * the value of`'product'\` dimension。 * + `{@[n]}: the value of a dimension at the index of`n`, for * example,`{@\[3\]}\` refers the value at dimensions\[3\]. * * **example:** * * ``` * formatter: '{b}: {@score}' * * ``` * * **Callback function** * * Callback function is in form of: * * ``` * (params: Object|Array) => string * * ``` * * where `params` is the single dataset needed by formatter, * which is formed as: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.label) * * @see https://echarts.apache.org/en/option.html#series-bar.label.formatter */ formatter?: Function | string | undefined;
/** * text color. * * If set as `'auto'`, the color will assigned as visual color, * such as series color. * * @default * ""#fff"" * @see https://echarts.apache.org/en/option.html#series-bar.label.color */ color?: string | undefined;
/** * font style * * Options are: * * + `'normal'` * + `'italic'` * + `'oblique'` * * @default * "normal" * @see https://echarts.apache.org/en/option.html#series-bar.label.fontStyle */ fontStyle?: string | undefined;
/** * font thick weight * * Options are: * * + `'normal'` * + `'bold'` * + `'bolder'` * + `'lighter'` * + 100 | 200 | 300 | 400... * * @default * "normal" * @see https://echarts.apache.org/en/option.html#series-bar.label.fontWeight */ fontWeight?: string | number | undefined;
/** * font family * * Can also be 'serif' , 'monospace', ... * * @default * "sans-serif" * @see https://echarts.apache.org/en/option.html#series-bar.label.fontFamily */ fontFamily?: string | undefined;
/** * font size * * @default * 12 * @see https://echarts.apache.org/en/option.html#series-bar.label.fontSize */ fontSize?: number | undefined;
/** * Horizontal alignment of text, automatic by default. * * Options are: * * + `'left'` * + `'center'` * + `'right'` * * If `align` is not set in `rich`, `align` in parent level * will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.label) * * @see https://echarts.apache.org/en/option.html#series-bar.label.align */ align?: string | undefined;
/** * Vertical alignment of text, automatic by default. * * Options are: * * + `'top'` * + `'middle'` * + `'bottom'` * * If `verticalAlign` is not set in `rich`, `verticalAlign` * in parent level will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.label) * * @see https://echarts.apache.org/en/option.html#series-bar.label.verticalAlign */ verticalAlign?: string | undefined;
/** * Line height of the text fregment. * * If `lineHeight` is not set in `rich`, `lineHeight` in parent * level will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.label) * * @see https://echarts.apache.org/en/option.html#series-bar.label.lineHeight */ lineHeight?: number | undefined;
/** * Background color of the text fregment. * * Can be color string, like `'#123234'`, `'red'`, `rgba(0,23,11,0.3)'`. * * Or image can be used, for example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.label) * * `width` or `height` can be specified when using background * image, or auto adapted by default. * * If set as `'auto'`, the color will assigned as visual color, * such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.label.backgroundColor */ backgroundColor?: object | string | undefined;
/** * Border color of the text fregment. * * If set as `'auto'`, the color will assigned as visual color, * such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.label.borderColor */ borderColor?: string | undefined;
/** * Border width of the text fregment. * * @see https://echarts.apache.org/en/option.html#series-bar.label.borderWidth */ borderWidth?: number | undefined;
/** * Border radius of the text fregment. * * @see https://echarts.apache.org/en/option.html#series-bar.label.borderRadius */ borderRadius?: number | undefined;
/** * Padding of the text fregment, for example: * * + `padding: [3, 4, 5, 6]`: represents padding of `[top, right, * bottom, left]`. * + `padding: 4`: represents `padding: [4, 4, 4, 4]`. * + `padding: [3, 4]`: represents `padding: [3, 4, 3, 4]`. * * Notice, `width` and `height` specifies the width and height * of the content, without `padding`. * * @see https://echarts.apache.org/en/option.html#series-bar.label.padding */ padding?: any[] | number | undefined;
/** * Shadow color of the text block. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.label.shadowColor */ shadowColor?: string | undefined;
/** * Show blur of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.label.shadowBlur */ shadowBlur?: number | undefined;
/** * Shadow X offset of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.label.shadowOffsetX */ shadowOffsetX?: number | undefined;
/** * Shadow Y offset of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.label.shadowOffsetY */ shadowOffsetY?: number | undefined;
/** * Width of the text block. * It is the width of the text by default. * In most cases, there is no need to specify it. * You may want to use it in some cases like make simple table * or using background image (see `backgroundColor`). * * Notice, `width` and `height` specifies the width and height * of the content, without `padding`. * * `width` can also be percent string, like `'100%'`, which * represents the percent of `contentWidth` (that is, the width * without `padding`) of its container box. * It is based on `contentWidth` because that each text fregment * is layout based on the `content box`, where it makes no sense * that calculating width based on `outerWith` in prectice. * * Notice, `width` and `height` only work when `rich` specified. * * @see https://echarts.apache.org/en/option.html#series-bar.label.width */ width?: number | string | undefined;
/** * Height of the text block. * It is the width of the text by default. * You may want to use it in some cases like using background * image (see `backgroundColor`). * * Notice, `width` and `height` specifies the width and height * of the content, without `padding`. * * Notice, `width` and `height` only work when `rich` specified. * * @see https://echarts.apache.org/en/option.html#series-bar.label.height */ height?: number | string | undefined;
/** * Storke color of the text. * * If set as `'auto'`, the color will assigned as visual color, * such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.label.textBorderColor */ textBorderColor?: string | undefined;
/** * Storke line width of the text. * * @see https://echarts.apache.org/en/option.html#series-bar.label.textBorderWidth */ textBorderWidth?: number | undefined;
/** * Shadow color of the text itself. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.label.textShadowColor */ textShadowColor?: string | undefined;
/** * Shadow blue of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.label.textShadowBlur */ textShadowBlur?: number | undefined;
/** * Shadow X offset of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.label.textShadowOffsetX */ textShadowOffsetX?: number | undefined;
/** * Shadow Y offset of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.label.textShadowOffsetY */ textShadowOffsetY?: number | undefined;
/** * "Rich text styles" can be defined in this `rich` property. * For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.label) * * For more details, see * [Rich Text](https://echarts.apache.org/en/option.htmltutorial.html#Rich%20Text) * please. * * @see https://echarts.apache.org/en/option.html#series-bar.label.rich */ rich?: | { /** * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E */ [userStyle: string]: { /** * text color. * * If set as `'auto'`, the color will assigned as visual * color, such as series color. * * @default * ""#fff"" * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.color */ color?: string | undefined;
/** * font style * * Options are: * * + `'normal'` * + `'italic'` * + `'oblique'` * * @default * "normal" * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.fontStyle */ fontStyle?: string | undefined;
/** * font thick weight * * Options are: * * + `'normal'` * + `'bold'` * + `'bolder'` * + `'lighter'` * + 100 | 200 | 300 | 400... * * @default * "normal" * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.fontWeight */ fontWeight?: string | number | undefined;
/** * font family * * Can also be 'serif' , 'monospace', ... * * @default * "sans-serif" * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.fontFamily */ fontFamily?: string | undefined;
/** * font size * * @default * 12 * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.fontSize */ fontSize?: number | undefined;
/** * Horizontal alignment of text, automatic by default. * * Options are: * * + `'left'` * + `'center'` * + `'right'` * * If `align` is not set in `rich`, `align` in parent * level will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.label.rich.%3Cuser%20defined%20style%20name%3E) * * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.align */ align?: string | undefined;
/** * Vertical alignment of text, automatic by default. * * Options are: * * + `'top'` * + `'middle'` * + `'bottom'` * * If `verticalAlign` is not set in `rich`, `verticalAlign` * in parent level will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.label.rich.%3Cuser%20defined%20style%20name%3E) * * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.verticalAlign */ verticalAlign?: string | undefined;
/** * Line height of the text fregment. * * If `lineHeight` is not set in `rich`, `lineHeight` * in parent level will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.label.rich.%3Cuser%20defined%20style%20name%3E) * * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.lineHeight */ lineHeight?: number | undefined;
/** * Background color of the text fregment. * * Can be color string, like `'#123234'`, `'red'`, `rgba(0,23,11,0.3)'`. * * Or image can be used, for example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.label.rich.%3Cuser%20defined%20style%20name%3E) * * `width` or `height` can be specified when using background * image, or auto adapted by default. * * If set as `'auto'`, the color will assigned as visual * color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.backgroundColor */ backgroundColor?: object | string | undefined;
/** * Border color of the text fregment. * * If set as `'auto'`, the color will assigned as visual * color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.borderColor */ borderColor?: string | undefined;
/** * Border width of the text fregment. * * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.borderWidth */ borderWidth?: number | undefined;
/** * Border radius of the text fregment. * * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.borderRadius */ borderRadius?: number | undefined;
/** * Padding of the text fregment, for example: * * + `padding: [3, 4, 5, 6]`: represents padding of * `[top, right, bottom, left]`. * + `padding: 4`: represents `padding: [4, 4, 4, 4]`. * + `padding: [3, 4]`: represents `padding: [3, 4, * 3, 4]`. * * Notice, `width` and `height` specifies the width * and height of the content, without `padding`. * * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.padding */ padding?: any[] | number | undefined;
/** * Shadow color of the text block. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.shadowColor */ shadowColor?: string | undefined;
/** * Show blur of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.shadowBlur */ shadowBlur?: number | undefined;
/** * Shadow X offset of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.shadowOffsetX */ shadowOffsetX?: number | undefined;
/** * Shadow Y offset of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.shadowOffsetY */ shadowOffsetY?: number | undefined;
/** * Width of the text block. * It is the width of the text by default. * In most cases, there is no need to specify it. * You may want to use it in some cases like make simple * table or using background image (see `backgroundColor`). * * Notice, `width` and `height` specifies the width * and height of the content, without `padding`. * * `width` can also be percent string, like `'100%'`, * which represents the percent of `contentWidth` (that * is, the width without `padding`) of its container * box. * It is based on `contentWidth` because that each text * fregment is layout based on the `content box`, where * it makes no sense that calculating width based on * `outerWith` in prectice. * * Notice, `width` and `height` only work when `rich` * specified. * * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.width */ width?: number | string | undefined;
/** * Height of the text block. * It is the width of the text by default. * You may want to use it in some cases like using background * image (see `backgroundColor`). * * Notice, `width` and `height` specifies the width * and height of the content, without `padding`. * * Notice, `width` and `height` only work when `rich` * specified. * * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.height */ height?: number | string | undefined;
/** * Storke color of the text. * * If set as `'auto'`, the color will assigned as visual * color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.textBorderColor */ textBorderColor?: string | undefined;
/** * Storke line width of the text. * * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.textBorderWidth */ textBorderWidth?: number | undefined;
/** * Shadow color of the text itself. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.textShadowColor */ textShadowColor?: string | undefined;
/** * Shadow blue of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.textShadowBlur */ textShadowBlur?: number | undefined;
/** * Shadow X offset of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.textShadowOffsetX */ textShadowOffsetX?: number | undefined;
/** * Shadow Y offset of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.label.rich.%3Cuser%20defined%20style%20name%3E.textShadowOffsetY */ textShadowOffsetY?: number | undefined; }; } | undefined; } | undefined;
Text label of , to explain some data information about graphic item like value, name and so on.
label
is placed underitemStyle
in ECharts 2.x. In ECharts 3, to make the configuration structure flatter,label
is taken to be at the same level withitemStyle
, and hasemphasis
asitemStyle
does.See Also
https://echarts.apache.org/en/option.html#series-bar.label
property large
large?: boolean | undefined;
Whether to enable the optimization of large-scale data. It could be set when large data causes performance problem.
After being enabled,
largeThreshold
can be used to indicate the minimum number for turning on the optimization.But when the optimization enabled, the style of single data item can't be customized any more.
See Also
https://echarts.apache.org/en/option.html#series-bar.large
property largeThreshold
largeThreshold?: number | undefined;
The threshold enabling the drawing optimization.
400
See Also
https://echarts.apache.org/en/option.html#series-bar.largeThreshold
property legendHoverLink
legendHoverLink?: boolean | undefined;
Whether to enable highlighting chart when [legend](https://echarts.apache.org/en/option.html#legend) is being hovered.
"true"
See Also
https://echarts.apache.org/en/option.html#series-bar.legendHoverLink
property markArea
markArea?: | { /** * Whether to ignore mouse events. * Default value is false, for triggering and responding to * mouse events. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.silent */ silent?: boolean | undefined;
/** * Label in mark area. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label */ label?: | { /** * Whether to show label. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.show */ show?: boolean | undefined;
/** * Label position. * * **Followings are the options:** * * + \[x, y\] * * Use relative percentage, or absolute pixel values to * represent position of label relative to top-left corner * of bounding box. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.label) * * + 'top' * * + 'left' * + 'right' * + 'bottom' * + 'inside' * + 'insideLeft' * + 'insideRight' * + 'insideTop' * + 'insideBottom' * + 'insideTopLeft' * + 'insideBottomLeft' * + 'insideTopRight' * + 'insideBottomRight' * * See: * [label position](https://echarts.apache.org/examples/en/view.html?c=doc-example/label-position) * . * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.position */ position?: any[] | string | undefined;
/** * Distance to the host graphic element. * Works when position is string value (like `'top'`、`'insideRight'`). * * See: * [label position](https://echarts.apache.org/examples/en/editor.html?c=doc-example/label-position) * . * * @default * 5 * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.distance */ distance?: number | undefined;
/** * Rotate label, from -90 degree to 90, positive value represents * rotate anti-clockwise. * * See: * [label rotation](https://echarts.apache.org/examples/en/editor.html?c=bar-label-rotation) * . * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rotate */ rotate?: number | undefined;
/** * Whether to move text slightly. * For example: `[30, 40]` means move `30` horizontally * and move `40` vertically. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.offset */ offset?: any[] | undefined;
/** * text color. * * If set as `'auto'`, the color will assigned as visual * color, such as series color. * * @default * ""#fff"" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.color */ color?: string | undefined;
/** * font style * * Options are: * * + `'normal'` * + `'italic'` * + `'oblique'` * * @default * "normal" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.fontStyle */ fontStyle?: string | undefined;
/** * font thick weight * * Options are: * * + `'normal'` * + `'bold'` * + `'bolder'` * + `'lighter'` * + 100 | 200 | 300 | 400... * * @default * "normal" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.fontWeight */ fontWeight?: string | number | undefined;
/** * font family * * Can also be 'serif' , 'monospace', ... * * @default * "sans-serif" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.fontFamily */ fontFamily?: string | undefined;
/** * font size * * @default * 12 * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.fontSize */ fontSize?: number | undefined;
/** * Horizontal alignment of text, automatic by default. * * Options are: * * + `'left'` * + `'center'` * + `'right'` * * If `align` is not set in `rich`, `align` in parent level * will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.label) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.align */ align?: string | undefined;
/** * Vertical alignment of text, automatic by default. * * Options are: * * + `'top'` * + `'middle'` * + `'bottom'` * * If `verticalAlign` is not set in `rich`, `verticalAlign` * in parent level will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.label) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.verticalAlign */ verticalAlign?: string | undefined;
/** * Line height of the text fregment. * * If `lineHeight` is not set in `rich`, `lineHeight` in * parent level will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.label) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.lineHeight */ lineHeight?: number | undefined;
/** * Background color of the text fregment. * * Can be color string, like `'#123234'`, `'red'`, `rgba(0,23,11,0.3)'`. * * Or image can be used, for example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.label) * * `width` or `height` can be specified when using background * image, or auto adapted by default. * * If set as `'auto'`, the color will assigned as visual * color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.backgroundColor */ backgroundColor?: object | string | undefined;
/** * Border color of the text fregment. * * If set as `'auto'`, the color will assigned as visual * color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.borderColor */ borderColor?: string | undefined;
/** * Border width of the text fregment. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.borderWidth */ borderWidth?: number | undefined;
/** * Border radius of the text fregment. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.borderRadius */ borderRadius?: number | undefined;
/** * Padding of the text fregment, for example: * * + `padding: [3, 4, 5, 6]`: represents padding of `[top, * right, bottom, left]`. * + `padding: 4`: represents `padding: [4, 4, 4, 4]`. * + `padding: [3, 4]`: represents `padding: [3, 4, 3, 4]`. * * Notice, `width` and `height` specifies the width and * height of the content, without `padding`. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.padding */ padding?: any[] | number | undefined;
/** * Shadow color of the text block. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.shadowColor */ shadowColor?: string | undefined;
/** * Show blur of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.shadowBlur */ shadowBlur?: number | undefined;
/** * Shadow X offset of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.shadowOffsetX */ shadowOffsetX?: number | undefined;
/** * Shadow Y offset of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.shadowOffsetY */ shadowOffsetY?: number | undefined;
/** * Width of the text block. * It is the width of the text by default. * In most cases, there is no need to specify it. * You may want to use it in some cases like make simple * table or using background image (see `backgroundColor`). * * Notice, `width` and `height` specifies the width and * height of the content, without `padding`. * * `width` can also be percent string, like `'100%'`, which * represents the percent of `contentWidth` (that is, the * width without `padding`) of its container box. * It is based on `contentWidth` because that each text * fregment is layout based on the `content box`, where * it makes no sense that calculating width based on `outerWith` * in prectice. * * Notice, `width` and `height` only work when `rich` specified. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.width */ width?: number | string | undefined;
/** * Height of the text block. * It is the width of the text by default. * You may want to use it in some cases like using background * image (see `backgroundColor`). * * Notice, `width` and `height` specifies the width and * height of the content, without `padding`. * * Notice, `width` and `height` only work when `rich` specified. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.height */ height?: number | string | undefined;
/** * Storke color of the text. * * If set as `'auto'`, the color will assigned as visual * color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.textBorderColor */ textBorderColor?: string | undefined;
/** * Storke line width of the text. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.textBorderWidth */ textBorderWidth?: number | undefined;
/** * Shadow color of the text itself. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.textShadowColor */ textShadowColor?: string | undefined;
/** * Shadow blue of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.textShadowBlur */ textShadowBlur?: number | undefined;
/** * Shadow X offset of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.textShadowOffsetX */ textShadowOffsetX?: number | undefined;
/** * Shadow Y offset of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.textShadowOffsetY */ textShadowOffsetY?: number | undefined;
/** * "Rich text styles" can be defined in this `rich` property. * For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.label) * * For more details, see * [Rich Text](https://echarts.apache.org/en/option.htmltutorial.html#Rich%20Text) * please. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich */ rich?: | { /** * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E */ [userStyle: string]: { /** * text color. * * If set as `'auto'`, the color will assigned as * visual color, such as series color. * * @default * ""#fff"" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.color */ color?: string | undefined;
/** * font style * * Options are: * * + `'normal'` * + `'italic'` * + `'oblique'` * * @default * "normal" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.fontStyle */ fontStyle?: string | undefined;
/** * font thick weight * * Options are: * * + `'normal'` * + `'bold'` * + `'bolder'` * + `'lighter'` * + 100 | 200 | 300 | 400... * * @default * "normal" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.fontWeight */ fontWeight?: string | number | undefined;
/** * font family * * Can also be 'serif' , 'monospace', ... * * @default * "sans-serif" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.fontFamily */ fontFamily?: string | undefined;
/** * font size * * @default * 12 * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.fontSize */ fontSize?: number | undefined;
/** * Horizontal alignment of text, automatic by default. * * Options are: * * + `'left'` * + `'center'` * + `'right'` * * If `align` is not set in `rich`, `align` in parent * level will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.align */ align?: string | undefined;
/** * Vertical alignment of text, automatic by default. * * Options are: * * + `'top'` * + `'middle'` * + `'bottom'` * * If `verticalAlign` is not set in `rich`, `verticalAlign` * in parent level will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.verticalAlign */ verticalAlign?: string | undefined;
/** * Line height of the text fregment. * * If `lineHeight` is not set in `rich`, `lineHeight` * in parent level will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.lineHeight */ lineHeight?: number | undefined;
/** * Background color of the text fregment. * * Can be color string, like `'#123234'`, `'red'`, * `rgba(0,23,11,0.3)'`. * * Or image can be used, for example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E) * * `width` or `height` can be specified when using * background image, or auto adapted by default. * * If set as `'auto'`, the color will assigned as * visual color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.backgroundColor */ backgroundColor?: object | string | undefined;
/** * Border color of the text fregment. * * If set as `'auto'`, the color will assigned as * visual color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.borderColor */ borderColor?: string | undefined;
/** * Border width of the text fregment. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.borderWidth */ borderWidth?: number | undefined;
/** * Border radius of the text fregment. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.borderRadius */ borderRadius?: number | undefined;
/** * Padding of the text fregment, for example: * * + `padding: [3, 4, 5, 6]`: represents padding * of `[top, right, bottom, left]`. * + `padding: 4`: represents `padding: [4, 4, 4, * 4]`. * + `padding: [3, 4]`: represents `padding: [3, * 4, 3, 4]`. * * Notice, `width` and `height` specifies the width * and height of the content, without `padding`. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.padding */ padding?: any[] | number | undefined;
/** * Shadow color of the text block. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.shadowColor */ shadowColor?: string | undefined;
/** * Show blur of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.shadowBlur */ shadowBlur?: number | undefined;
/** * Shadow X offset of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.shadowOffsetX */ shadowOffsetX?: number | undefined;
/** * Shadow Y offset of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.shadowOffsetY */ shadowOffsetY?: number | undefined;
/** * Width of the text block. * It is the width of the text by default. * In most cases, there is no need to specify it. * You may want to use it in some cases like make * simple table or using background image (see `backgroundColor`). * * Notice, `width` and `height` specifies the width * and height of the content, without `padding`. * * `width` can also be percent string, like `'100%'`, * which represents the percent of `contentWidth` * (that is, the width without `padding`) of its * container box. * It is based on `contentWidth` because that each * text fregment is layout based on the `content * box`, where it makes no sense that calculating * width based on `outerWith` in prectice. * * Notice, `width` and `height` only work when `rich` * specified. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.width */ width?: number | string | undefined;
/** * Height of the text block. * It is the width of the text by default. * You may want to use it in some cases like using * background image (see `backgroundColor`). * * Notice, `width` and `height` specifies the width * and height of the content, without `padding`. * * Notice, `width` and `height` only work when `rich` * specified. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.height */ height?: number | string | undefined;
/** * Storke color of the text. * * If set as `'auto'`, the color will assigned as * visual color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.textBorderColor */ textBorderColor?: string | undefined;
/** * Storke line width of the text. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.textBorderWidth */ textBorderWidth?: number | undefined;
/** * Shadow color of the text itself. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.textShadowColor */ textShadowColor?: string | undefined;
/** * Shadow blue of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.textShadowBlur */ textShadowBlur?: number | undefined;
/** * Shadow X offset of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.textShadowOffsetX */ textShadowOffsetX?: number | undefined;
/** * Shadow Y offset of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.rich.%3Cuser%20defined%20style%20name%3E.textShadowOffsetY */ textShadowOffsetY?: number | undefined; }; } | undefined;
/** * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis */ emphasis?: | { /** * Whether to show label. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.show */ show?: boolean | undefined;
/** * Label position. * * **Followings are the options:** * * + \[x, y\] * * Use relative percentage, or absolute pixel values * to represent position of label relative to top-left * corner of bounding box. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.label.emphasis) * * + 'top' * * + 'left' * + 'right' * + 'bottom' * + 'inside' * + 'insideLeft' * + 'insideRight' * + 'insideTop' * + 'insideBottom' * + 'insideTopLeft' * + 'insideBottomLeft' * + 'insideTopRight' * + 'insideBottomRight' * * See: * [label position](https://echarts.apache.org/examples/en/view.html?c=doc-example/label-position) * . * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.position */ position?: any[] | string | undefined;
/** * Distance to the host graphic element. * Works when position is string value (like `'top'`、`'insideRight'`). * * See: * [label position](https://echarts.apache.org/examples/en/editor.html?c=doc-example/label-position) * . * * @default * 5 * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.distance */ distance?: number | undefined;
/** * Rotate label, from -90 degree to 90, positive value * represents rotate anti-clockwise. * * See: * [label rotation](https://echarts.apache.org/examples/en/editor.html?c=bar-label-rotation) * . * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rotate */ rotate?: number | undefined;
/** * Whether to move text slightly. * For example: `[30, 40]` means move `30` horizontally * and move `40` vertically. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.offset */ offset?: any[] | undefined;
/** * text color. * * If set as `'auto'`, the color will assigned as visual * color, such as series color. * * @default * ""#fff"" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.color */ color?: string | undefined;
/** * font style * * Options are: * * + `'normal'` * + `'italic'` * + `'oblique'` * * @default * "normal" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.fontStyle */ fontStyle?: string | undefined;
/** * font thick weight * * Options are: * * + `'normal'` * + `'bold'` * + `'bolder'` * + `'lighter'` * + 100 | 200 | 300 | 400... * * @default * "normal" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.fontWeight */ fontWeight?: string | number | undefined;
/** * font family * * Can also be 'serif' , 'monospace', ... * * @default * "sans-serif" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.fontFamily */ fontFamily?: string | undefined;
/** * font size * * @default * 12 * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.fontSize */ fontSize?: number | undefined;
/** * Horizontal alignment of text, automatic by default. * * Options are: * * + `'left'` * + `'center'` * + `'right'` * * If `align` is not set in `rich`, `align` in parent * level will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.label.emphasis) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.align */ align?: string | undefined;
/** * Vertical alignment of text, automatic by default. * * Options are: * * + `'top'` * + `'middle'` * + `'bottom'` * * If `verticalAlign` is not set in `rich`, `verticalAlign` * in parent level will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.label.emphasis) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.verticalAlign */ verticalAlign?: string | undefined;
/** * Line height of the text fregment. * * If `lineHeight` is not set in `rich`, `lineHeight` * in parent level will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.label.emphasis) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.lineHeight */ lineHeight?: number | undefined;
/** * Background color of the text fregment. * * Can be color string, like `'#123234'`, `'red'`, `rgba(0,23,11,0.3)'`. * * Or image can be used, for example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.label.emphasis) * * `width` or `height` can be specified when using background * image, or auto adapted by default. * * If set as `'auto'`, the color will assigned as visual * color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.backgroundColor */ backgroundColor?: object | string | undefined;
/** * Border color of the text fregment. * * If set as `'auto'`, the color will assigned as visual * color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.borderColor */ borderColor?: string | undefined;
/** * Border width of the text fregment. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.borderWidth */ borderWidth?: number | undefined;
/** * Border radius of the text fregment. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.borderRadius */ borderRadius?: number | undefined;
/** * Padding of the text fregment, for example: * * + `padding: [3, 4, 5, 6]`: represents padding of * `[top, right, bottom, left]`. * + `padding: 4`: represents `padding: [4, 4, 4, 4]`. * + `padding: [3, 4]`: represents `padding: [3, 4, * 3, 4]`. * * Notice, `width` and `height` specifies the width * and height of the content, without `padding`. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.padding */ padding?: any[] | number | undefined;
/** * Shadow color of the text block. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.shadowColor */ shadowColor?: string | undefined;
/** * Show blur of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.shadowBlur */ shadowBlur?: number | undefined;
/** * Shadow X offset of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.shadowOffsetX */ shadowOffsetX?: number | undefined;
/** * Shadow Y offset of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.shadowOffsetY */ shadowOffsetY?: number | undefined;
/** * Width of the text block. * It is the width of the text by default. * In most cases, there is no need to specify it. * You may want to use it in some cases like make simple * table or using background image (see `backgroundColor`). * * Notice, `width` and `height` specifies the width * and height of the content, without `padding`. * * `width` can also be percent string, like `'100%'`, * which represents the percent of `contentWidth` (that * is, the width without `padding`) of its container * box. * It is based on `contentWidth` because that each text * fregment is layout based on the `content box`, where * it makes no sense that calculating width based on * `outerWith` in prectice. * * Notice, `width` and `height` only work when `rich` * specified. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.width */ width?: number | string | undefined;
/** * Height of the text block. * It is the width of the text by default. * You may want to use it in some cases like using background * image (see `backgroundColor`). * * Notice, `width` and `height` specifies the width * and height of the content, without `padding`. * * Notice, `width` and `height` only work when `rich` * specified. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.height */ height?: number | string | undefined;
/** * Storke color of the text. * * If set as `'auto'`, the color will assigned as visual * color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.textBorderColor */ textBorderColor?: string | undefined;
/** * Storke line width of the text. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.textBorderWidth */ textBorderWidth?: number | undefined;
/** * Shadow color of the text itself. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.textShadowColor */ textShadowColor?: string | undefined;
/** * Shadow blue of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.textShadowBlur */ textShadowBlur?: number | undefined;
/** * Shadow X offset of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.textShadowOffsetX */ textShadowOffsetX?: number | undefined;
/** * Shadow Y offset of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.textShadowOffsetY */ textShadowOffsetY?: number | undefined;
/** * "Rich text styles" can be defined in this `rich` * property. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.label.emphasis) * * For more details, see * [Rich Text](https://echarts.apache.org/en/option.htmltutorial.html#Rich%20Text) * please. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich */ rich?: | { /** * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E */ [userStyle: string]: { /** * text color. * * If set as `'auto'`, the color will assigned * as visual color, such as series color. * * @default * ""#fff"" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.color */ color?: string | undefined;
/** * font style * * Options are: * * + `'normal'` * + `'italic'` * + `'oblique'` * * @default * "normal" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.fontStyle */ fontStyle?: string | undefined;
/** * font thick weight * * Options are: * * + `'normal'` * + `'bold'` * + `'bolder'` * + `'lighter'` * + 100 | 200 | 300 | 400... * * @default * "normal" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.fontWeight */ fontWeight?: | string | number | undefined;
/** * font family * * Can also be 'serif' , 'monospace', ... * * @default * "sans-serif" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.fontFamily */ fontFamily?: string | undefined;
/** * font size * * @default * 12 * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.fontSize */ fontSize?: number | undefined;
/** * Horizontal alignment of text, automatic by * default. * * Options are: * * + `'left'` * + `'center'` * + `'right'` * * If `align` is not set in `rich`, `align` * in parent level will be used. * For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.align */ align?: string | undefined;
/** * Vertical alignment of text, automatic by * default. * * Options are: * * + `'top'` * + `'middle'` * + `'bottom'` * * If `verticalAlign` is not set in `rich`, * `verticalAlign` in parent level will be used. * For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.verticalAlign */ verticalAlign?: string | undefined;
/** * Line height of the text fregment. * * If `lineHeight` is not set in `rich`, `lineHeight` * in parent level will be used. * For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.lineHeight */ lineHeight?: number | undefined;
/** * Background color of the text fregment. * * Can be color string, like `'#123234'`, `'red'`, * `rgba(0,23,11,0.3)'`. * * Or image can be used, for example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E) * * `width` or `height` can be specified when * using background image, or auto adapted by * default. * * If set as `'auto'`, the color will assigned * as visual color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.backgroundColor */ backgroundColor?: | object | string | undefined;
/** * Border color of the text fregment. * * If set as `'auto'`, the color will assigned * as visual color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.borderColor */ borderColor?: string | undefined;
/** * Border width of the text fregment. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.borderWidth */ borderWidth?: number | undefined;
/** * Border radius of the text fregment. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.borderRadius */ borderRadius?: number | undefined;
/** * Padding of the text fregment, for example: * * + `padding: [3, 4, 5, 6]`: represents padding * of `[top, right, bottom, left]`. * + `padding: 4`: represents `padding: [4, * 4, 4, 4]`. * + `padding: [3, 4]`: represents `padding: * [3, 4, 3, 4]`. * * Notice, `width` and `height` specifies the * width and height of the content, without * `padding`. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.padding */ padding?: any[] | number | undefined;
/** * Shadow color of the text block. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.shadowColor */ shadowColor?: string | undefined;
/** * Show blur of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.shadowBlur */ shadowBlur?: number | undefined;
/** * Shadow X offset of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.shadowOffsetX */ shadowOffsetX?: number | undefined;
/** * Shadow Y offset of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.shadowOffsetY */ shadowOffsetY?: number | undefined;
/** * Width of the text block. * It is the width of the text by default. * In most cases, there is no need to specify * it. * You may want to use it in some cases like * make simple table or using background image * (see `backgroundColor`). * * Notice, `width` and `height` specifies the * width and height of the content, without * `padding`. * * `width` can also be percent string, like * `'100%'`, which represents the percent of * `contentWidth` (that is, the width without * `padding`) of its container box. * It is based on `contentWidth` because that * each text fregment is layout based on the * `content box`, where it makes no sense that * calculating width based on `outerWith` in * prectice. * * Notice, `width` and `height` only work when * `rich` specified. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.width */ width?: number | string | undefined;
/** * Height of the text block. * It is the width of the text by default. * You may want to use it in some cases like * using background image (see `backgroundColor`). * * Notice, `width` and `height` specifies the * width and height of the content, without * `padding`. * * Notice, `width` and `height` only work when * `rich` specified. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.height */ height?: number | string | undefined;
/** * Storke color of the text. * * If set as `'auto'`, the color will assigned * as visual color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.textBorderColor */ textBorderColor?: string | undefined;
/** * Storke line width of the text. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.textBorderWidth */ textBorderWidth?: number | undefined;
/** * Shadow color of the text itself. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.textShadowColor */ textShadowColor?: string | undefined;
/** * Shadow blue of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.textShadowBlur */ textShadowBlur?: number | undefined;
/** * Shadow X offset of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.textShadowOffsetX */ textShadowOffsetX?: | number | undefined;
/** * Shadow Y offset of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.label.emphasis.rich.%3Cuser%20defined%20style%20name%3E.textShadowOffsetY */ textShadowOffsetY?: | number | undefined; }; } | undefined; } | undefined; } | undefined;
/** * Style of the mark area. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.itemStyle */ itemStyle?: | { /** * color. * * > Color can be represented in RGB, for example `'rgb(128, * 128, 128)'`. * RGBA can be used when you need alpha channel, for example * `'rgba(128, 128, 128, 0.5)'`. * You may also use hexadecimal format, for example `'#ccc'`. * Gradient color and texture are also supported besides * single colors. * > * > [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.itemStyle) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.itemStyle.color */ color?: EChartOption.Color | undefined;
/** * border color, whose format is similar to that of `color`. * * @default * "#000" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.itemStyle.borderColor */ borderColor?: EChartOption.Color | undefined;
/** * border width. No border when it is set to be 0. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.itemStyle.borderWidth */ borderWidth?: number | undefined;
/** * Border type, which can be `'solid'`, `'dashed'`, or `'dotted'`. * `'solid'` by default. * * @default * "solid" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.itemStyle.borderType */ borderType?: string | undefined;
/** * Size of shadow blur. * This attribute should be used along with `shadowColor`,`shadowOffsetX`, * `shadowOffsetY` to set shadow to component. * * For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.itemStyle) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.itemStyle.shadowBlur */ shadowBlur?: number | undefined;
/** * Shadow color. Support same format as `color`. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.itemStyle.shadowColor */ shadowColor?: EChartOption.Color | undefined;
/** * Offset distance on the horizontal direction of shadow. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.itemStyle.shadowOffsetX */ shadowOffsetX?: number | undefined;
/** * Offset distance on the vertical direction of shadow. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.itemStyle.shadowOffsetY */ shadowOffsetY?: number | undefined;
/** * Opacity of the component. * Supports value from 0 to 1, and the component will not * be drawn when set to 0. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.itemStyle.opacity */ opacity?: number | undefined;
/** * @see https://echarts.apache.org/en/option.html#series-bar.markArea.itemStyle.emphasis */ emphasis?: | { /** * color. * * > Color can be represented in RGB, for example `'rgb(128, * 128, 128)'`. * RGBA can be used when you need alpha channel, for * example `'rgba(128, 128, 128, 0.5)'`. * You may also use hexadecimal format, for example * `'#ccc'`. * Gradient color and texture are also supported besides * single colors. * > * > [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.itemStyle.emphasis) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.itemStyle.emphasis.color */ color?: EChartOption.Color | undefined;
/** * border color, whose format is similar to that of * `color`. * * @default * "#000" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.itemStyle.emphasis.borderColor */ borderColor?: EChartOption.Color | undefined;
/** * border width. No border when it is set to be 0. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.itemStyle.emphasis.borderWidth */ borderWidth?: number | undefined;
/** * Border type, which can be `'solid'`, `'dashed'`, * or `'dotted'`. `'solid'` by default. * * @default * "solid" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.itemStyle.emphasis.borderType */ borderType?: string | undefined;
/** * Size of shadow blur. * This attribute should be used along with `shadowColor`,`shadowOffsetX`, * `shadowOffsetY` to set shadow to component. * * For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.itemStyle.emphasis) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.itemStyle.emphasis.shadowBlur */ shadowBlur?: number | undefined;
/** * Shadow color. Support same format as `color`. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.itemStyle.emphasis.shadowColor */ shadowColor?: EChartOption.Color | undefined;
/** * Offset distance on the horizontal direction of shadow. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.itemStyle.emphasis.shadowOffsetX */ shadowOffsetX?: number | undefined;
/** * Offset distance on the vertical direction of shadow. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.itemStyle.emphasis.shadowOffsetY */ shadowOffsetY?: number | undefined;
/** * Opacity of the component. * Supports value from 0 to 1, and the component will * not be drawn when set to 0. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.itemStyle.emphasis.opacity */ opacity?: number | undefined; } | undefined; } | undefined;
/** * The scope of the area is defined by `data`, which is an array * with two item, representing the left-top point and the right-bottom * point of rectangle area. * Each item can be defined as follows: * * 1. * Specify the coordinate in screen coordinate system using * [x](https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.x) * , * [y](https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.y) * , where the unit is pixel (e.g., * the value is `5`), or percent (e.g., * the value is `'35%'`). * * 2. * Specify the coordinate in data coordinate system (i.e., * cartesian) using * [coord](https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.coord) * , which can be also set as `'min'`, `'max'`, `'average'` * (e.g, * `coord: [23, 'min']`, or `coord: ['average', 'max']`)。 * * 1. * Locate the point on the min value or max value of `series.data` * using * [type](https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.type) * , where * [valueIndex](https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.valueIndex) * or * [valueDim](https://echarts.apache.org/en/option.html#series-bar.markPoint.data.0.valueDim) * can be used to specify the dimension on which the min, max * or average are calculated. * 2. * If in cartesian, you can only specify `xAxis` or `yAxis` * to define a mark area based on only X or Y axis, see sample * [scatter-weight](https://echarts.apache.org/examples/en/editor.html?c=scatter-weight) * * The priority follows as above if more than one above definition * used. * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data */ data?: | { /** * Specify the left-top point. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0 */ 0?: | { /** * Specify this item is on min or max or average value. * * **Options:** * * + `'min'` max value。 * + `'max'` min value。 * + `'average'` average value。 * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.type */ type?: string | undefined;
/** * Specify the dimension on which min, max, average * are calculated, available when * [type](https://echarts.apache.org/en/option.html#series-.markArea.data.type) * used. * The value can be `0` (means xAxis, radiusAxis) or * `1` (means yAxis, angleAxis), using the dimension * of the first axis by default. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.valueIndex */ valueIndex?: number | undefined;
/** * Specify the dimension on which min, max, average * are calculated, available when * [type](https://echarts.apache.org/en/option.html#series-.markArea.data.type) * used. * The value can be the name of the dimension (for example, * the value can be `x`, `angle` in line chart, and * `open`, `close` in candlestick). * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.valueDim */ valueDim?: string | undefined;
/** * The format is \[start coordinate, end coordinate\], * where the coordinate system can be `x`, `y` on * [cartesian](https://echarts.apache.org/en/option.html#grid) * , or `radius`, `angle` on * [polar](https://echarts.apache.org/en/option.html#polar) * . * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.coord */ coord?: any[] | undefined;
/** * Name of the marker, which will display as a label. * * @see https://ecomfe.github.io/echarts-doc/public/en/option.html#series-bar.markArea.data.0.name */ name?: string | undefined;
/** * x value on screen coordinate system, can be pixel * number (like `5`), or percent value (like `'20%'`). * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.x */ x?: number | undefined;
/** * y value on screen coordinate system, can be pixel * number (like `5`), or percent value (like `'20%'`). * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.y */ y?: number | undefined;
/** * value of the item, not necessary. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.value */ value?: number | undefined;
/** * Style of the item. * `itemStyle` of start point and end point will be * merged together. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.itemStyle */ itemStyle?: | { /** * color. * * > Color can be represented in RGB, for example * `'rgb(128, 128, 128)'`. * RGBA can be used when you need alpha channel, * for example `'rgba(128, 128, 128, 0.5)'`. * You may also use hexadecimal format, for example * `'#ccc'`. * Gradient color and texture are also supported * besides single colors. * > * > [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.data.0.itemStyle) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.itemStyle.color */ color?: EChartOption.Color | undefined;
/** * border color, whose format is similar to that * of `color`. * * @default * "#000" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.itemStyle.borderColor */ borderColor?: | EChartOption.Color | undefined;
/** * border width. * No border when it is set to be 0. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.itemStyle.borderWidth */ borderWidth?: number | undefined;
/** * Border type, which can be `'solid'`, `'dashed'`, * or `'dotted'`. `'solid'` by default. * * @default * "solid" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.itemStyle.borderType */ borderType?: string | undefined;
/** * Size of shadow blur. * This attribute should be used along with `shadowColor`,`shadowOffsetX`, * `shadowOffsetY` to set shadow to component. * * For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.data.0.itemStyle) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.itemStyle.shadowBlur */ shadowBlur?: number | undefined;
/** * Shadow color. Support same format as `color`. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.itemStyle.shadowColor */ shadowColor?: | EChartOption.Color | undefined;
/** * Offset distance on the horizontal direction of * shadow. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.itemStyle.shadowOffsetX */ shadowOffsetX?: number | undefined;
/** * Offset distance on the vertical direction of * shadow. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.itemStyle.shadowOffsetY */ shadowOffsetY?: number | undefined;
/** * Opacity of the component. * Supports value from 0 to 1, and the component * will not be drawn when set to 0. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.itemStyle.opacity */ opacity?: number | undefined;
/** * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.itemStyle.emphasis */ emphasis?: | { /** * color. * * > Color can be represented in RGB, for example * `'rgb(128, 128, 128)'`. * RGBA can be used when you need alpha channel, * for example `'rgba(128, 128, 128, 0.5)'`. * You may also use hexadecimal format, for * example `'#ccc'`. * Gradient color and texture are also supported * besides single colors. * > * > [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.data.0.itemStyle.emphasis) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.itemStyle.emphasis.color */ color?: | EChartOption.Color | undefined;
/** * border color, whose format is similar to * that of `color`. * * @default * "#000" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.itemStyle.emphasis.borderColor */ borderColor?: | EChartOption.Color | undefined;
/** * border width. * No border when it is set to be 0. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.itemStyle.emphasis.borderWidth */ borderWidth?: | number | undefined;
/** * Border type, which can be `'solid'`, `'dashed'`, * or `'dotted'`. `'solid'` by default. * * @default * "solid" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.itemStyle.emphasis.borderType */ borderType?: | string | undefined;
/** * Size of shadow blur. * This attribute should be used along with * `shadowColor`,`shadowOffsetX`, `shadowOffsetY` * to set shadow to component. * * For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.data.0.itemStyle.emphasis) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.itemStyle.emphasis.shadowBlur */ shadowBlur?: | number | undefined;
/** * Shadow color. * Support same format as `color`. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.itemStyle.emphasis.shadowColor */ shadowColor?: | EChartOption.Color | undefined;
/** * Offset distance on the horizontal direction * of shadow. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.itemStyle.emphasis.shadowOffsetX */ shadowOffsetX?: | number | undefined;
/** * Offset distance on the vertical direction * of shadow. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.itemStyle.emphasis.shadowOffsetY */ shadowOffsetY?: | number | undefined;
/** * Opacity of the component. * Supports value from 0 to 1, and the component * will not be drawn when set to 0. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.itemStyle.emphasis.opacity */ opacity?: number | undefined; } | undefined; } | undefined;
/** * Label style of the item. * Label style of start point and end point will be * merged together. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label */ label?: | { /** * Whether to show label. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.show */ show?: boolean | undefined;
/** * Label position. * * **Followings are the options:** * * + \[x, y\] * * Use relative percentage, or absolute pixel values * to represent position of label relative to top-left * corner of bounding box. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.data.0.label) * * + 'top' * * + 'left' * + 'right' * + 'bottom' * + 'inside' * + 'insideLeft' * + 'insideRight' * + 'insideTop' * + 'insideBottom' * + 'insideTopLeft' * + 'insideBottomLeft' * + 'insideTopRight' * + 'insideBottomRight' * * See: * [label position](https://echarts.apache.org/examples/en/view.html?c=doc-example/label-position) * . * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.position */ position?: any[] | string | undefined;
/** * Distance to the host graphic element. * Works when position is string value (like `'top'`、`'insideRight'`). * * See: * [label position](https://echarts.apache.org/examples/en/editor.html?c=doc-example/label-position) * . * * @default * 5 * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.distance */ distance?: number | undefined;
/** * Rotate label, from -90 degree to 90, positive * value represents rotate anti-clockwise. * * See: * [label rotation](https://echarts.apache.org/examples/en/editor.html?c=bar-label-rotation) * . * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.rotate */ rotate?: number | undefined;
/** * Whether to move text slightly. * For example: `[30, 40]` means move `30` horizontally * and move `40` vertically. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.offset */ offset?: any[] | undefined;
/** * text color. * * If set as `'auto'`, the color will assigned as * visual color, such as series color. * * @default * ""#fff"" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.color */ color?: string | undefined;
/** * font style * * Options are: * * + `'normal'` * + `'italic'` * + `'oblique'` * * @default * "normal" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.fontStyle */ fontStyle?: string | undefined;
/** * font thick weight * * Options are: * * + `'normal'` * + `'bold'` * + `'bolder'` * + `'lighter'` * + 100 | 200 | 300 | 400... * * @default * "normal" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.fontWeight */ fontWeight?: string | number | undefined;
/** * font family * * Can also be 'serif' , 'monospace', ... * * @default * "sans-serif" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.fontFamily */ fontFamily?: string | undefined;
/** * font size * * @default * 12 * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.fontSize */ fontSize?: number | undefined;
/** * Horizontal alignment of text, automatic by default. * * Options are: * * + `'left'` * + `'center'` * + `'right'` * * If `align` is not set in `rich`, `align` in parent * level will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.data.0.label) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.align */ align?: string | undefined;
/** * Vertical alignment of text, automatic by default. * * Options are: * * + `'top'` * + `'middle'` * + `'bottom'` * * If `verticalAlign` is not set in `rich`, `verticalAlign` * in parent level will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.data.0.label) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.verticalAlign */ verticalAlign?: string | undefined;
/** * Line height of the text fregment. * * If `lineHeight` is not set in `rich`, `lineHeight` * in parent level will be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.data.0.label) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.lineHeight */ lineHeight?: number | undefined;
/** * Background color of the text fregment. * * Can be color string, like `'#123234'`, `'red'`, * `rgba(0,23,11,0.3)'`. * * Or image can be used, for example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.data.0.label) * * `width` or `height` can be specified when using * background image, or auto adapted by default. * * If set as `'auto'`, the color will assigned as * visual color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.backgroundColor */ backgroundColor?: | object | string | undefined;
/** * Border color of the text fregment. * * If set as `'auto'`, the color will assigned as * visual color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.borderColor */ borderColor?: string | undefined;
/** * Border width of the text fregment. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.borderWidth */ borderWidth?: number | undefined;
/** * Border radius of the text fregment. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.borderRadius */ borderRadius?: number | undefined;
/** * Padding of the text fregment, for example: * * + `padding: [3, 4, 5, 6]`: represents padding * of `[top, right, bottom, left]`. * + `padding: 4`: represents `padding: [4, 4, 4, * 4]`. * + `padding: [3, 4]`: represents `padding: [3, * 4, 3, 4]`. * * Notice, `width` and `height` specifies the width * and height of the content, without `padding`. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.padding */ padding?: any[] | number | undefined;
/** * Shadow color of the text block. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.shadowColor */ shadowColor?: string | undefined;
/** * Show blur of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.shadowBlur */ shadowBlur?: number | undefined;
/** * Shadow X offset of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.shadowOffsetX */ shadowOffsetX?: number | undefined;
/** * Shadow Y offset of the text block. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.shadowOffsetY */ shadowOffsetY?: number | undefined;
/** * Width of the text block. * It is the width of the text by default. * In most cases, there is no need to specify it. * You may want to use it in some cases like make * simple table or using background image (see `backgroundColor`). * * Notice, `width` and `height` specifies the width * and height of the content, without `padding`. * * `width` can also be percent string, like `'100%'`, * which represents the percent of `contentWidth` * (that is, the width without `padding`) of its * container box. * It is based on `contentWidth` because that each * text fregment is layout based on the `content * box`, where it makes no sense that calculating * width based on `outerWith` in prectice. * * Notice, `width` and `height` only work when `rich` * specified. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.width */ width?: number | string | undefined;
/** * Height of the text block. * It is the width of the text by default. * You may want to use it in some cases like using * background image (see `backgroundColor`). * * Notice, `width` and `height` specifies the width * and height of the content, without `padding`. * * Notice, `width` and `height` only work when `rich` * specified. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.height */ height?: number | string | undefined;
/** * Storke color of the text. * * If set as `'auto'`, the color will assigned as * visual color, such as series color. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.textBorderColor */ textBorderColor?: string | undefined;
/** * Storke line width of the text. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.textBorderWidth */ textBorderWidth?: number | undefined;
/** * Shadow color of the text itself. * * @default * "transparent" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.textShadowColor */ textShadowColor?: string | undefined;
/** * Shadow blue of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.textShadowBlur */ textShadowBlur?: number | undefined;
/** * Shadow X offset of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.textShadowOffsetX */ textShadowOffsetX?: number | undefined;
/** * Shadow Y offset of the text itself. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.textShadowOffsetY */ textShadowOffsetY?: number | undefined;
/** * "Rich text styles" can be defined in this `rich` * property. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.data.0.label) * * For more details, see * [Rich Text](https://echarts.apache.org/en/option.htmltutorial.html#Rich%20Text) * please. * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.rich */ rich?: | { /** * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.rich.%3Cuser%20defined%20style%20name%3E */ [userStyle: string]: { /** * text color. * * If set as `'auto'`, the color will assigned * as visual color, such as series color. * * @default * ""#fff"" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.rich.%3Cuser%20defined%20style%20name%3E.color */ color?: string | undefined;
/** * font style * * Options are: * * + `'normal'` * + `'italic'` * + `'oblique'` * * @default * "normal" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.rich.%3Cuser%20defined%20style%20name%3E.fontStyle */ fontStyle?: | string | undefined;
/** * font thick weight * * Options are: * * + `'normal'` * + `'bold'` * + `'bolder'` * + `'lighter'` * + 100 | 200 | 300 | 400... * * @default * "normal" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.rich.%3Cuser%20defined%20style%20name%3E.fontWeight */ fontWeight?: | string | number | undefined;
/** * font family * * Can also be 'serif' , 'monospace', * ... * * @default * "sans-serif" * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.rich.%3Cuser%20defined%20style%20name%3E.fontFamily */ fontFamily?: | string | undefined;
/** * font size * * @default * 12 * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.rich.%3Cuser%20defined%20style%20name%3E.fontSize */ fontSize?: | number | undefined;
/** * Horizontal alignment of text, automatic * by default. * * Options are: * * + `'left'` * + `'center'` * + `'right'` * * If `align` is not set in `rich`, `align` * in parent level will be used. * For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.data.0.label.rich.%3Cuser%20defined%20style%20name%3E) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.rich.%3Cuser%20defined%20style%20name%3E.align */ align?: string | undefined;
/** * Vertical alignment of text, automatic * by default. * * Options are: * * + `'top'` * + `'middle'` * + `'bottom'` * * If `verticalAlign` is not set in `rich`, * `verticalAlign` in parent level will * be used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.data.0.label.rich.%3Cuser%20defined%20style%20name%3E) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.rich.%3Cuser%20defined%20style%20name%3E.verticalAlign */ verticalAlign?: | string | undefined;
/** * Line height of the text fregment. * * If `lineHeight` is not set in `rich`, * `lineHeight` in parent level will be * used. For example: * * [see doc](https://echarts.apache.org/en/option.html#series-bar.bar.markArea.data.0.label.rich.%3Cuser%20defined%20style%20name%3E) * * @see https://echarts.apache.org/en/option.html#series-bar.markArea.data.0.label.rich.%3Cuser%20defined%20style%20name%3E.lineHeight */ lineHeight?: | number