| window.__EC_DOC_option_series_parallel = { |
| "id": { |
| "desc": "<p>Component ID, not specified by default. If specified, it can be used to refer the component in option or API.</p>\n" |
| }, |
| "coordinateSystem": { |
| "desc": "<p>The coordinate used in the series, whose options are:</p>\n<ul>\n<li><p><code class=\"codespan\">'parallel'</code></p>\n<p> Use parallel coordinates, with <a href=\"#series-parallel.parallelIndex\">parallelIndex</a> to assign the corresponding parallel coordinate components.</p>\n</li>\n</ul>\n" |
| }, |
| "parallelIndex": { |
| "desc": "<p>Index of <a href=\"#parallel\">parallel coordinates</a> to combine with, which is useful for multiple parallel axes in one chart.</p>\n" |
| }, |
| "name": { |
| "desc": "<p>Series name used for displaying in <a href=\"#tooltip\">tooltip</a> and filtering with <a href=\"#legend\">legend</a>, or updating data and configuration with <code class=\"codespan\">setOption</code>.</p>\n" |
| }, |
| "lineStyle": { |
| "desc": "<p>Line style.</p>\n" |
| }, |
| "lineStyle.color": { |
| "desc": "\n\n<p>Line color. </p>\n<blockquote>\n<p>Color can be represented in RGB, for example <code class=\"codespan\">'rgb(128, 128, 128)'</code>. RGBA can be used when you need alpha channel, for example <code class=\"codespan\">'rgba(128, 128, 128, 0.5)'</code>. You may also use hexadecimal format, for example <code class=\"codespan\">'#ccc'</code>. Gradient color and texture are also supported besides single colors.</p>\n<pre><code class=\"lang-js\">// Linear gradient. First four parameters are x0, y0, x2, and y2, each ranged from 0 to 1, standing for percentage in the bounding box. If global is `true`, then the first four parameters are in absolute pixel positions.\ncolor: {\n type: 'linear',\n x: 0,\n y: 0,\n x2: 0,\n y2: 1,\n colorStops: [{\n offset: 0, color: 'red' // color at 0% position\n }, {\n offset: 1, color: 'blue' // color at 100% position\n }],\n global: false // false by default\n}\n// Radial gradient. First three parameters are x and y positions of center, and radius, similar to linear gradient.\ncolor: {\n type: 'radial',\n x: 0.5,\n y: 0.5,\n r: 0.5,\n colorStops: [{\n offset: 0, color: 'red' // color at 0% position\n }, {\n offset: 1, color: 'blue' // color at 100% position\n }],\n global: false // false by default\n}\n// Fill with texture\ncolor: {\n image: imageDom, // HTMLImageElement, and HTMLCanvasElement are supported, while string path is not supported\n repeat: 'repeat' // whether to repeat texture, whose value can be repeat-x, repeat-y, or no-repeat\n}\n</code></pre>\n</blockquote>\n", |
| "uiControl": { |
| "type": "color" |
| } |
| }, |
| "lineStyle.width": { |
| "desc": "\n\n<p> line width.</p>\n", |
| "uiControl": { |
| "type": "number", |
| "value": "2", |
| "min": "0", |
| "step": "0.5" |
| } |
| }, |
| "lineStyle.type": { |
| "desc": "\n\n<p> line type.</p>\n<p>Options are:</p>\n<ul>\n<li><code class=\"codespan\">'solid'</code></li>\n<li><code class=\"codespan\">'dashed'</code></li>\n<li><code class=\"codespan\">'dotted'</code></li>\n</ul>\n", |
| "uiControl": { |
| "type": "enum", |
| "default": "solid", |
| "options": "solid,dashed,dotted" |
| } |
| }, |
| "lineStyle.shadowBlur": { |
| "desc": "\n\n<p>Size of shadow blur. This attribute should be used along with <code class=\"codespan\">shadowColor</code>,<code class=\"codespan\">shadowOffsetX</code>, <code class=\"codespan\">shadowOffsetY</code> to set shadow to component.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n", |
| "uiControl": { |
| "type": "number", |
| "default": "", |
| "min": "0", |
| "step": "0.5" |
| } |
| }, |
| "lineStyle.shadowColor": { |
| "desc": "\n\n<p>Shadow color. Support same format as <code class=\"codespan\">color</code>.</p>\n", |
| "uiControl": { |
| "type": "color", |
| "default": "" |
| } |
| }, |
| "lineStyle.shadowOffsetX": { |
| "desc": "\n\n<p>Offset distance on the horizontal direction of shadow.</p>\n", |
| "uiControl": { |
| "type": "number", |
| "default": "0", |
| "step": "0.5" |
| } |
| }, |
| "lineStyle.shadowOffsetY": { |
| "desc": "\n\n<p>Offset distance on the vertical direction of shadow.</p>\n", |
| "uiControl": { |
| "type": "number", |
| "default": "0", |
| "step": "0.5" |
| } |
| }, |
| "lineStyle.opacity": { |
| "desc": "\n\n<p>Opacity of the component. Supports value from 0 to 1, and the component will not be drawn when set to 0.</p>\n", |
| "uiControl": { |
| "type": "number", |
| "default": "0.45", |
| "min": "0", |
| "max": "1", |
| "step": "0.01" |
| } |
| }, |
| "emphasis.lineStyle.color": { |
| "desc": "\n\n<p>Line color. </p>\n<blockquote>\n<p>Color can be represented in RGB, for example <code class=\"codespan\">'rgb(128, 128, 128)'</code>. RGBA can be used when you need alpha channel, for example <code class=\"codespan\">'rgba(128, 128, 128, 0.5)'</code>. You may also use hexadecimal format, for example <code class=\"codespan\">'#ccc'</code>. Gradient color and texture are also supported besides single colors.</p>\n<pre><code class=\"lang-js\">// Linear gradient. First four parameters are x0, y0, x2, and y2, each ranged from 0 to 1, standing for percentage in the bounding box. If global is `true`, then the first four parameters are in absolute pixel positions.\ncolor: {\n type: 'linear',\n x: 0,\n y: 0,\n x2: 0,\n y2: 1,\n colorStops: [{\n offset: 0, color: 'red' // color at 0% position\n }, {\n offset: 1, color: 'blue' // color at 100% position\n }],\n global: false // false by default\n}\n// Radial gradient. First three parameters are x and y positions of center, and radius, similar to linear gradient.\ncolor: {\n type: 'radial',\n x: 0.5,\n y: 0.5,\n r: 0.5,\n colorStops: [{\n offset: 0, color: 'red' // color at 0% position\n }, {\n offset: 1, color: 'blue' // color at 100% position\n }],\n global: false // false by default\n}\n// Fill with texture\ncolor: {\n image: imageDom, // HTMLImageElement, and HTMLCanvasElement are supported, while string path is not supported\n repeat: 'repeat' // whether to repeat texture, whose value can be repeat-x, repeat-y, or no-repeat\n}\n</code></pre>\n</blockquote>\n", |
| "uiControl": { |
| "type": "color" |
| } |
| }, |
| "emphasis.lineStyle.width": { |
| "desc": "\n\n<p> line width.</p>\n", |
| "uiControl": { |
| "type": "number", |
| "value": "2", |
| "min": "0", |
| "step": "0.5" |
| } |
| }, |
| "emphasis.lineStyle.type": { |
| "desc": "\n\n<p> line type.</p>\n<p>Options are:</p>\n<ul>\n<li><code class=\"codespan\">'solid'</code></li>\n<li><code class=\"codespan\">'dashed'</code></li>\n<li><code class=\"codespan\">'dotted'</code></li>\n</ul>\n", |
| "uiControl": { |
| "type": "enum", |
| "default": "solid", |
| "options": "solid,dashed,dotted" |
| } |
| }, |
| "emphasis.lineStyle.shadowBlur": { |
| "desc": "\n\n<p>Size of shadow blur. This attribute should be used along with <code class=\"codespan\">shadowColor</code>,<code class=\"codespan\">shadowOffsetX</code>, <code class=\"codespan\">shadowOffsetY</code> to set shadow to component.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n", |
| "uiControl": { |
| "type": "number", |
| "default": "", |
| "min": "0", |
| "step": "0.5" |
| } |
| }, |
| "emphasis.lineStyle.shadowColor": { |
| "desc": "\n\n<p>Shadow color. Support same format as <code class=\"codespan\">color</code>.</p>\n", |
| "uiControl": { |
| "type": "color", |
| "default": "" |
| } |
| }, |
| "emphasis.lineStyle.shadowOffsetX": { |
| "desc": "\n\n<p>Offset distance on the horizontal direction of shadow.</p>\n", |
| "uiControl": { |
| "type": "number", |
| "default": "0", |
| "step": "0.5" |
| } |
| }, |
| "emphasis.lineStyle.shadowOffsetY": { |
| "desc": "\n\n<p>Offset distance on the vertical direction of shadow.</p>\n", |
| "uiControl": { |
| "type": "number", |
| "default": "0", |
| "step": "0.5" |
| } |
| }, |
| "emphasis.lineStyle.opacity": { |
| "desc": "\n\n<p>Opacity of the component. Supports value from 0 to 1, and the component will not be drawn when set to 0.</p>\n", |
| "uiControl": { |
| "type": "number", |
| "default": "0.45", |
| "min": "0", |
| "max": "1", |
| "step": "0.01" |
| } |
| }, |
| "inactiveOpacity": { |
| "desc": "\n\n<p>When perform brush selection, the unselected lines will be set as this transparency rate (which could darken those lines).</p>\n", |
| "uiControl": { |
| "type": "number", |
| "min": "0", |
| "max": "1", |
| "default": "0.05", |
| "step": "0.01" |
| } |
| }, |
| "activeOpacity": { |
| "desc": "\n\n<p>When perform brush selection, the selected lines will be set as this transparency rate (which could highlight those lines).</p>\n", |
| "uiControl": { |
| "type": "number", |
| "min": "0", |
| "max": "1", |
| "default": "1", |
| "step": "0.01" |
| } |
| }, |
| "realtime": { |
| "desc": "\n\n<p>Whether to update view in realtime.</p>\n", |
| "uiControl": { |
| "type": "boolean", |
| "default": "true" |
| } |
| }, |
| "smooth": { |
| "desc": "\n\n<p>Whether to smooth the line. It defaults to be <code class=\"codespan\">false</code> and can be set as <code class=\"codespan\">true</code> or the values from 0 to 1 which indicating the smoothness.</p>\n", |
| "uiControl": { |
| "type": "boolean" |
| } |
| }, |
| "progressive": { |
| "desc": "<p><code class=\"codespan\">progressive</code> specifies the amount of graphic elements that can be rendered within a frame (about 16ms) if "progressive rendering" enabled.</p>\n<p>When data amount is from thousand to more than 10 million, it will take too long time to render all of the graphic elements. Since ECharts 4, "progressive rendering" is supported in its workflow, which processes and renders data chunk by chunk alone with each frame, avoiding to block the UI thread of the browser.</p>\n<p>Set <code class=\"codespan\">progressive: 0</code> to disable progressive permanently. By default, progressive is auto-enabled when data amount is bigger than <code class=\"codespan\">progressiveThreshold</code>.</p>\n" |
| }, |
| "progressiveThreshold": { |
| "desc": "<p>If current data amount is over the threshold, "progressive rendering" is enabled.</p>\n" |
| }, |
| "progressiveChunkMode": { |
| "desc": "<p>Chunk approach, optional values:</p>\n<ul>\n<li><code class=\"codespan\">'sequential'</code>: slice data by data index.</li>\n<li><code class=\"codespan\">'mod'</code>: slice data by mod, which make the data items of each chunk coming from all over the data, bringing better visual effect while progressive rendering.</li>\n</ul>\n" |
| }, |
| "data": { |
| "desc": "<p>For example, <a href=\"#series-parallel.data\">series-parallel.data</a> is the following data:</p>\n<pre><code class=\"lang-javascript\">[\n [1, 55, 9, 56, 0.46, 18, 6, 'good'],\n [2, 25, 11, 21, 0.65, 34, 9, 'excellent'],\n [3, 56, 7, 63, 0.3, 14, 5, 'good'],\n [4, 33, 7, 29, 0.33, 16, 6, 'excellent'],\n { // Data item can also be an Object, so that perticular settings of its line can be set here.\n value: [5, 42, 24, 44, 0.76, 40, 16, 'excellent']\n lineStyle: {...},\n }\n ...\n]\n</code></pre>\n<p>In data above, each row is a "data item", and each column represents a "dimension". For example, the meanings of columns above are: "data", "AQI", "PM2.5", "PM10", "carbon monoxide level", "nitrogen dioxide level", and "sulfur dioxide level".</p>\n" |
| }, |
| "data.name": { |
| "desc": "<p>The name of a data item.</p>\n" |
| }, |
| "data.value": { |
| "desc": "<p>The value of a data item.</p>\n" |
| }, |
| "data.lineStyle": { |
| "desc": "<p>Line style.</p>\n" |
| }, |
| "data.color": { |
| "desc": "\n\n<p>Line color. </p>\n<blockquote>\n<p>Color can be represented in RGB, for example <code class=\"codespan\">'rgb(128, 128, 128)'</code>. RGBA can be used when you need alpha channel, for example <code class=\"codespan\">'rgba(128, 128, 128, 0.5)'</code>. You may also use hexadecimal format, for example <code class=\"codespan\">'#ccc'</code>. Gradient color and texture are also supported besides single colors.</p>\n<pre><code class=\"lang-js\">// Linear gradient. First four parameters are x0, y0, x2, and y2, each ranged from 0 to 1, standing for percentage in the bounding box. If global is `true`, then the first four parameters are in absolute pixel positions.\ncolor: {\n type: 'linear',\n x: 0,\n y: 0,\n x2: 0,\n y2: 1,\n colorStops: [{\n offset: 0, color: 'red' // color at 0% position\n }, {\n offset: 1, color: 'blue' // color at 100% position\n }],\n global: false // false by default\n}\n// Radial gradient. First three parameters are x and y positions of center, and radius, similar to linear gradient.\ncolor: {\n type: 'radial',\n x: 0.5,\n y: 0.5,\n r: 0.5,\n colorStops: [{\n offset: 0, color: 'red' // color at 0% position\n }, {\n offset: 1, color: 'blue' // color at 100% position\n }],\n global: false // false by default\n}\n// Fill with texture\ncolor: {\n image: imageDom, // HTMLImageElement, and HTMLCanvasElement are supported, while string path is not supported\n repeat: 'repeat' // whether to repeat texture, whose value can be repeat-x, repeat-y, or no-repeat\n}\n</code></pre>\n</blockquote>\n", |
| "uiControl": { |
| "type": "color" |
| } |
| }, |
| "data.width": { |
| "desc": "\n\n<p> line width.</p>\n", |
| "uiControl": { |
| "type": "number", |
| "value": "2", |
| "min": "0", |
| "step": "0.5" |
| } |
| }, |
| "data.type": { |
| "desc": "\n\n<p> line type.</p>\n<p>Options are:</p>\n<ul>\n<li><code class=\"codespan\">'solid'</code></li>\n<li><code class=\"codespan\">'dashed'</code></li>\n<li><code class=\"codespan\">'dotted'</code></li>\n</ul>\n", |
| "uiControl": { |
| "type": "enum", |
| "default": "solid", |
| "options": "solid,dashed,dotted" |
| } |
| }, |
| "data.shadowBlur": { |
| "desc": "\n\n<p>Size of shadow blur. This attribute should be used along with <code class=\"codespan\">shadowColor</code>,<code class=\"codespan\">shadowOffsetX</code>, <code class=\"codespan\">shadowOffsetY</code> to set shadow to component.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n", |
| "uiControl": { |
| "type": "number", |
| "default": "", |
| "min": "0", |
| "step": "0.5" |
| } |
| }, |
| "data.shadowColor": { |
| "desc": "\n\n<p>Shadow color. Support same format as <code class=\"codespan\">color</code>.</p>\n", |
| "uiControl": { |
| "type": "color", |
| "default": "" |
| } |
| }, |
| "data.shadowOffsetX": { |
| "desc": "\n\n<p>Offset distance on the horizontal direction of shadow.</p>\n", |
| "uiControl": { |
| "type": "number", |
| "default": "0", |
| "step": "0.5" |
| } |
| }, |
| "data.shadowOffsetY": { |
| "desc": "\n\n<p>Offset distance on the vertical direction of shadow.</p>\n", |
| "uiControl": { |
| "type": "number", |
| "default": "0", |
| "step": "0.5" |
| } |
| }, |
| "data.opacity": { |
| "desc": "\n\n<p>Opacity of the component. Supports value from 0 to 1, and the component will not be drawn when set to 0.</p>\n", |
| "uiControl": { |
| "type": "number", |
| "default": "0.45", |
| "min": "0", |
| "max": "1", |
| "step": "0.01" |
| } |
| }, |
| "data.emphasis.lineStyle.color": { |
| "desc": "\n\n<p>Line color. </p>\n<blockquote>\n<p>Color can be represented in RGB, for example <code class=\"codespan\">'rgb(128, 128, 128)'</code>. RGBA can be used when you need alpha channel, for example <code class=\"codespan\">'rgba(128, 128, 128, 0.5)'</code>. You may also use hexadecimal format, for example <code class=\"codespan\">'#ccc'</code>. Gradient color and texture are also supported besides single colors.</p>\n<pre><code class=\"lang-js\">// Linear gradient. First four parameters are x0, y0, x2, and y2, each ranged from 0 to 1, standing for percentage in the bounding box. If global is `true`, then the first four parameters are in absolute pixel positions.\ncolor: {\n type: 'linear',\n x: 0,\n y: 0,\n x2: 0,\n y2: 1,\n colorStops: [{\n offset: 0, color: 'red' // color at 0% position\n }, {\n offset: 1, color: 'blue' // color at 100% position\n }],\n global: false // false by default\n}\n// Radial gradient. First three parameters are x and y positions of center, and radius, similar to linear gradient.\ncolor: {\n type: 'radial',\n x: 0.5,\n y: 0.5,\n r: 0.5,\n colorStops: [{\n offset: 0, color: 'red' // color at 0% position\n }, {\n offset: 1, color: 'blue' // color at 100% position\n }],\n global: false // false by default\n}\n// Fill with texture\ncolor: {\n image: imageDom, // HTMLImageElement, and HTMLCanvasElement are supported, while string path is not supported\n repeat: 'repeat' // whether to repeat texture, whose value can be repeat-x, repeat-y, or no-repeat\n}\n</code></pre>\n</blockquote>\n", |
| "uiControl": { |
| "type": "color" |
| } |
| }, |
| "data.emphasis.lineStyle.width": { |
| "desc": "\n\n<p> line width.</p>\n", |
| "uiControl": { |
| "type": "number", |
| "value": "2", |
| "min": "0", |
| "step": "0.5" |
| } |
| }, |
| "data.emphasis.lineStyle.type": { |
| "desc": "\n\n<p> line type.</p>\n<p>Options are:</p>\n<ul>\n<li><code class=\"codespan\">'solid'</code></li>\n<li><code class=\"codespan\">'dashed'</code></li>\n<li><code class=\"codespan\">'dotted'</code></li>\n</ul>\n", |
| "uiControl": { |
| "type": "enum", |
| "default": "solid", |
| "options": "solid,dashed,dotted" |
| } |
| }, |
| "data.emphasis.lineStyle.shadowBlur": { |
| "desc": "\n\n<p>Size of shadow blur. This attribute should be used along with <code class=\"codespan\">shadowColor</code>,<code class=\"codespan\">shadowOffsetX</code>, <code class=\"codespan\">shadowOffsetY</code> to set shadow to component.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">{\n shadowColor: 'rgba(0, 0, 0, 0.5)',\n shadowBlur: 10\n}\n</code></pre>\n", |
| "uiControl": { |
| "type": "number", |
| "default": "", |
| "min": "0", |
| "step": "0.5" |
| } |
| }, |
| "data.emphasis.lineStyle.shadowColor": { |
| "desc": "\n\n<p>Shadow color. Support same format as <code class=\"codespan\">color</code>.</p>\n", |
| "uiControl": { |
| "type": "color", |
| "default": "" |
| } |
| }, |
| "data.emphasis.lineStyle.shadowOffsetX": { |
| "desc": "\n\n<p>Offset distance on the horizontal direction of shadow.</p>\n", |
| "uiControl": { |
| "type": "number", |
| "default": "0", |
| "step": "0.5" |
| } |
| }, |
| "data.emphasis.lineStyle.shadowOffsetY": { |
| "desc": "\n\n<p>Offset distance on the vertical direction of shadow.</p>\n", |
| "uiControl": { |
| "type": "number", |
| "default": "0", |
| "step": "0.5" |
| } |
| }, |
| "data.emphasis.lineStyle.opacity": { |
| "desc": "\n\n<p>Opacity of the component. Supports value from 0 to 1, and the component will not be drawn when set to 0.</p>\n", |
| "uiControl": { |
| "type": "number", |
| "default": "0.45", |
| "min": "0", |
| "max": "1", |
| "step": "0.01" |
| } |
| }, |
| "zlevel": { |
| "desc": "<p><code class=\"codespan\">zlevel</code> value of all graphical elements in parallel.</p>\n<p><code class=\"codespan\">zlevel</code> is used to make layers with Canvas. Graphical elements with different <code class=\"codespan\">zlevel</code> values will be placed in different Canvases, which is a common optimization technique. We can put those frequently changed elements (like those with animations) to a separate <code class=\"codespan\">zlevel</code>. Notice that too many Canvases will increase memory cost, and should be used carefully on mobile phones to avoid crash.</p>\n<p>Canvases with bigger <code class=\"codespan\">zlevel</code> will be placed on Canvases with smaller <code class=\"codespan\">zlevel</code>.</p>\n" |
| }, |
| "z": { |
| "desc": "<p><code class=\"codespan\">z</code> value of all graphical elements in parallel, which controls order of drawing graphical components. Components with smaller <code class=\"codespan\">z</code> values may be overwritten by those with larger <code class=\"codespan\">z</code> values.</p>\n<p><code class=\"codespan\">z</code> has a lower priority to <code class=\"codespan\">zlevel</code>, and will not create new Canvas.</p>\n" |
| }, |
| "silent": { |
| "desc": "\n\n<p>Whether to ignore mouse events. Default value is false, for triggering and responding to mouse events.</p>\n", |
| "uiControl": { |
| "type": "boolean" |
| } |
| }, |
| "animation": { |
| "desc": "\n\n<p>Whether to enable animation.</p>\n", |
| "uiControl": { |
| "type": "boolean", |
| "default": "true", |
| "clean": "true" |
| } |
| }, |
| "animationThreshold": { |
| "desc": "<p>Whether to set graphic number threshold to animation. Animation will be disabled when graphic number is larger than threshold.</p>\n" |
| }, |
| "animationDuration": { |
| "desc": "\n\n<p>Duration of the first animation, which supports callback function for different data to have different animation effect:</p>\n<pre><code class=\"lang-js\">animationDuration: function (idx) {\n // delay for later data is larger\n return idx * 100;\n}\n</code></pre>\n", |
| "uiControl": { |
| "type": "number", |
| "min": "0", |
| "default": "1000", |
| "step": "20", |
| "clean": "true" |
| } |
| }, |
| "animationEasing": { |
| "desc": "\n\n<p>Easing method used for the first animation. Varied easing effects can be found at <a href=\"https://echarts.apache.org/next/examples/editor.html?c=line-easing\" target=\"_blank\">easing effect example</a>.</p>\n", |
| "uiControl": { |
| "type": "enum", |
| "options": "linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut", |
| "clean": "true" |
| } |
| }, |
| "animationDelay": { |
| "desc": "<p>Delay before updating the first animation, which supports callback function for different data to have different animation effect.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">animationDelay: function (idx) {\n // delay for later data is larger\n return idx * 100;\n}\n</code></pre>\n<p>See <a href=\"https://echarts.apache.org/next/examples/editor.html?c=bar-animation-delay\" target=\"_blank\">this example</a> for more information.</p>\n" |
| }, |
| "animationDurationUpdate": { |
| "desc": "\n\n<p>Time for animation to complete, which supports callback function for different data to have different animation effect:</p>\n<pre><code class=\"lang-js\">animationDurationUpdate: function (idx) {\n // delay for later data is larger\n return idx * 100;\n}\n</code></pre>\n", |
| "uiControl": { |
| "type": "number", |
| "min": "0", |
| "default": "1000", |
| "step": "20" |
| } |
| }, |
| "animationEasingUpdate": { |
| "desc": "\n\n<p>Easing method used for animation.</p>\n", |
| "uiControl": { |
| "type": "enum", |
| "options": "linear,quadraticIn,quadraticOut,quadraticInOut,cubicIn,cubicOut,cubicInOut,quarticIn,quarticOut,quarticInOut,quinticIn,quinticOut,quinticInOut,sinusoidalIn,sinusoidalOut,sinusoidalInOut,exponentialIn,exponentialOut,exponentialInOut,circularIn,circularOut,circularInOut,elasticIn,elasticOut,elasticInOut,backIn,backOut,backInOut,bounceIn,bounceOut,bounceInOut" |
| } |
| }, |
| "animationDelayUpdate": { |
| "desc": "<p>Delay before updating animation, which supports callback function for different data to have different animation effects.</p>\n<p>For example:</p>\n<pre><code class=\"lang-js\">animationDelayUpdate: function (idx) {\n // delay for later data is larger\n return idx * 100;\n}\n</code></pre>\n<p>See <a href=\"https://echarts.apache.org/next/examples/editor.html?c=bar-animation-delay\" target=\"_blank\">this example</a> for more information.</p>\n" |
| } |
| } |