| { |
| "highlight": "<p>Highlights the given graphic element.</p>\n<p>Series is specified through <code class=\"codespan\">seriesName</code> or <code class=\"codespan\">seriesIndex</code>. If another data needs to be specified, then use <code class=\"codespan\">dataIndex</code> or <code class=\"codespan\">name</code>.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'highlight',\n // optional; series index; could be an array of multiple series\n seriesIndex?: number|Array,\n // optional; series name; could be an array of multiple series\n seriesName?: string|Array,\n // options are index of data\n dataIndex?: number,\n // options are data name\n name?: string\n})\n</code></pre>\n", |
| "downplay": "<p>Cancels highlighting graphic element.</p>\n<p>Series is specified through <code class=\"codespan\">seriesName</code> or <code class=\"codespan\">seriesIndex</code>. If another data needs to be specified, then use <code class=\"codespan\">dataIndex</code> or <code class=\"codespan\">name</code>.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'downplay',\n // optional; series index; could be an array of multiple series\n seriesIndex?: number|Array,\n // optional; series name; could be an array of multiple series\n seriesName?: string|Array,\n // options are index of data\n dataIndex?: number,\n // options are data name\n name?: string\n})\n</code></pre>\n<!--============= legend ==========-->\n", |
| "legend": "<p>Actions related to <a href=\"option.html#legend\" target=\"_blank\">legend component</a>, which should include <a href=\"option.html#legend\" target=\"_blank\">legend component</a> before use.</p>\n", |
| "legend.legendSelect": "<p>Selects legend.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'legendSelect',\n // legend name\n name: string\n})\n</code></pre>\n<p><strong>EVENT:</strong> <a href=\"#events.legendselected\">legendselected</a></p>\n", |
| "legend.legendUnSelect": "<p>Unselects the legend.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'legendUnSelect',\n // legend name\n name: string\n})\n</code></pre>\n<p><strong>EVENT:</strong> <a href=\"#events.legendunselected\">legendunselected</a></p>\n", |
| "legend.legendToggleSelect": "<p>Toggles legend selecting state.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'legendToggleSelect',\n // legend name\n name: string\n})\n</code></pre>\n<p><strong>EVENT:</strong> <a href=\"#events.legendselectchanged\">legendselectchanged</a></p>\n", |
| "legend.legendScroll": "<p>Controll the scrolling of legend. It works when <a href=\"option.html#legend.type\" target=\"_blank\">legend.type</a> is <code class=\"codespan\">'scroll'</code>.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'legendScroll',\n scrollDataIndex: number,\n legendId: string\n})\n</code></pre>\n<p><strong>EVENT:</strong> <a href=\"#events.legendscroll\">legendscroll</a></p>\n<!--============= tooltip ==========-->\n", |
| "tooltip": "<p>Actions related to <a href=\"option.html#tooltip\" target=\"_blank\">tooltip component</a>, which should include <a href=\"option.html#tooltip\" target=\"_blank\">tooltip component</a> before use.</p>\n", |
| "tooltip.showTip": "<p>Shows tooltip.</p>\n<p>There are two usages as followed.</p>\n<p>1 Display tooltip at certain position relative to container. If it cannot be displayed at the specified location, then it is invalid.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'showTip',\n // x coordinate on screen\n x: number,\n // y coordinate on screen\n y: number,\n // Position of tooltip. Only works in this action.\n // Use tooltip.position in option by default.\n position: Array.<number>|string|Function\n})\n</code></pre>\n<p>2 Specify graphic element, and display tooltip according to the tooltip configuration item.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'showTip',\n // index of series, which is optional when trigger of tooltip is axis\n seriesIndex?: number,\n // data index; could assign by name attribute when not defined\n dataIndex?: number,\n // optional; data name; ignored when dataIndex is defined\n name?: string,\n // Position of tooltip. Only works in this action.\n // Use tooltip.position in option by default.\n position: Array.<number>|string|Function\n})\n</code></pre>\n<p>Parameter <code class=\"codespan\">position</code> is the same as <a href=\"option.html#tooltip.position\" target=\"_blank\">tooltip.position</a>.</p>\n", |
| "tooltip.hideTip": "<p>Hides tooltip.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'hideTip'\n})\n</code></pre>\n<!--============= dataZoom ==========-->\n", |
| "dataZoom": "<p>Actions related to <a href=\"option.html#dataZoom\" target=\"_blank\">data region zoom component</a>, which should include <a href=\"option.html#dataZoom\" target=\"_blank\">data region zoom component</a> before use.</p>\n", |
| "dataZoom.dataZoom": "<p>Zoom data region.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'dataZoom',\n // optional; index of dataZoom component; useful for are multiple dataZoom components; 0 by default\n dataZoomIndex: number,\n // percentage of starting position; 0 - 100\n start: number,\n // percentage of ending position; 0 - 100\n end: number,\n // data value at starting location\n startValue: number,\n // data value at ending location\n endValue: number\n})\n</code></pre>\n<p><strong>EVENT:</strong> <a href=\"#events.datazoom\">datazoom</a></p>\n", |
| "dataZoom.takeGlobalCursor": "<p>Activate or inactivate <code class=\"codespan\">dataZoom</code> buttom in <code class=\"codespan\">toolbox</code>.</p>\n<pre><code class=\"lang-js\">myChart.dispatchAction({\n type: 'takeGlobalCursor',\n key: 'dataZoomSelect',\n // Activate or inactivate.\n dataZoomSelectActive: true\n});\n</code></pre>\n<!--============= visualMap ==========-->\n", |
| "visualMap": "<p>Actions related to <a href=\"option.html#visualMap\" target=\"_blank\">visual mapping component</a>, which should include <a href=\"option.html#visualMap\" target=\"_blank\">visual mapping component</a> before use.</p>\n", |
| "visualMap.selectDataRange": "<p>Selects data range of visual mapping.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'selectDataRange',\n // optional; index of visualMap component; useful for are multiple visualMap components; 0 by default\n visualMapIndex: number,\n // continuous visualMap is different from discrete one\n // continuous visualMap is an array representing range of data values.\n // discrete visualMap is an object, whose key is category or piece index; value is `true` or `false`\n selected: Object|Array\n})\n</code></pre>\n<p>?\n<strong>For example: </strong></p>\n<pre><code class=\"lang-js\">myChart.dispatchAction({\n type: 'selectDataRange',\n // select a value range between 20 and 40\n selected: [20, 40],\n // cancel selecting the second range\n selected: { 1: false },\n // cancel selecting `excellent` category\n selected: { 'excellent': false }\n});\n</code></pre>\n<p><strong>EVENT:</strong> <a href=\"#events.datarangeselected\">datarangeselected</a></p>\n<!--============= timeline ==========-->\n", |
| "timeline": "<p>Actions related to <a href=\"option.html#timeline\" target=\"_blank\">timeline component</a>, which should include <a href=\"option.html#timeline\" target=\"_blank\">timeline component</a> before use.</p>\n", |
| "timeline.timelineChange": "<p>Sets the current time point.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'timelineChange',\n // index of time point\n currentIndex: number\n})\n</code></pre>\n<p><strong>EVENT:</strong> <a href=\"#events.timelinechanged\">timelinechanged</a></p>\n", |
| "timeline.timelinePlayChange": "<p>Toggles playing status of timeline.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'timelinePlayChange',\n // laying status; true for auto-play\n playState: boolean\n})\n</code></pre>\n<p><strong>EVENT:</strong> <a href=\"#events.timelineplaychanged\">timelineplaychanged</a></p>\n<!--============= toolbox ==========-->\n", |
| "toolbox": "<p>Actions related to <a href=\"option.html#toolbox\" target=\"_blank\">toolbox component</a>, which should include <a href=\"option.html#toolbox\" target=\"_blank\">toolbox component</a> before use.</p>\n", |
| "toolbox.restore": "<p>Resets option.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'restore'\n})\n</code></pre>\n<p><strong>EVENT:</strong> <a href=\"#events.restore\">restore</a>\n<!--============= pie ==========--></p>\n", |
| "pie": "<p>Actions related to <a href=\"option.html#series-pie\" target=\"_blank\">pie chart</a>, which should include <a href=\"option.html#series-pie\" target=\"_blank\">pie chart</a> before use.</p>\n", |
| "pie.pieSelect": "<p>Selects the specified pie chart.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'pieSelect',\n // optional; series index; could be an array of multiple series\n seriesIndex?: number|Array,\n // optional; series name; could be an array of multiple series\n seriesName?: string|Array,\n // data index; could assign by name attribute when not defined\n dataIndex?: number,\n // optional; data name; ignored when dataIndex is defined\n name?: string\n})\n</code></pre>\n<p><strong>EVENT:</strong> <a href=\"#events.pieselected\">pieselected</a></p>\n", |
| "pie.pieUnSelect": "<p>Cancels selecting specified pie chart.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'pieUnSelect',\n // optional; series index; could be an array of multiple series\n seriesIndex?: number|Array,\n // optional; series name; could be an array of multiple series\n seriesName?: string|Array,\n // data index; could assign by name attribute when not defined\n dataIndex?: number,\n // optional; data name; ignored when dataIndex is defined\n name?: string\n})\n</code></pre>\n<p><strong>EVENT:</strong> <a href=\"#events.pieunselected\">pieunselected</a></p>\n", |
| "pie.pieToggleSelect": "<p>Toggles selecting status of specified pie chart.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'pieToggleSelect',\n // optional; series index; could be an array of multiple series\n seriesIndex?: number|Array,\n // optional; series name; could be an array of multiple series\n seriesName?: string|Array,\n // data index; could assign by name attribute when not defined\n dataIndex?: number,\n // optional; data name; ignored when dataIndex is defined\n name?: string\n})\n</code></pre>\n<p><strong>EVENT:</strong> <a href=\"#events.pieselectchanged\">pieselectchanged</a></p>\n<!--============= map ==========-->\n", |
| "map": "<p>Actions related to <a href=\"option.html#series-map\" target=\"_blank\">map</a>, which should include <a href=\"option.html#series-map\" target=\"_blank\">map</a> before use.</p>\n", |
| "map.mapSelect": "<p>Selects the specified map area.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'mapSelect',\n // optional; series index; could be an array of multiple series\n seriesIndex?: number|Array,\n // optional; series name; could be an array of multiple series\n seriesName?: string|Array,\n // data index; could assign by name attribute when not defined\n dataIndex?: number,\n // optional; data name; ignored when dataIndex is defined\n name?: string\n})\n</code></pre>\n<p><strong>EVENT:</strong> <a href=\"#events.mapselected\">mapselected</a></p>\n", |
| "map.mapUnSelect": "<p>Cancels selecting specified map area.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'mapUnSelect',\n // optional; series index; could be an array of multiple series\n seriesIndex?: number|Array,\n // optional; series name; could be an array of multiple series\n seriesName?: string|Array,\n // data index; could assign by name attribute when not defined\n dataIndex?: number,\n // optional; data name; ignored when dataIndex is defined\n name?: string\n})\n</code></pre>\n<p><strong>EVENT:</strong> <a href=\"#events.mapunselected\">mapunselected</a></p>\n", |
| "map.mapToggleSelect": "<p>Toggles selecting status of specified map area.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'mapToggleSelect',\n // optional; series index; could be an array of multiple series\n seriesIndex?: number|Array,\n // optional; series name; could be an array of multiple series\n seriesName?: string|Array,\n // data index; could assign by name attribute when not defined\n dataIndex?: number,\n // optional; data name; ignored when dataIndex is defined\n name?: string\n})\n</code></pre>\n<p><strong>EVENT:</strong> <a href=\"#events.mapselectchanged\">mapselectchanged</a></p>\n<!--============= graph ==========-->\n", |
| "graph": "<p>Actions related to <a href=\"option.html#series-graph\" target=\"_blank\">graph</a>, which should include <a href=\"option.html#series-graph\" target=\"_blank\">graph</a> before use.</p>\n", |
| "graph.focusNodeAdjacency": "<p>Highlight the specified node and all of its adjacent nodes.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'focusNodeAdjacency',\n\n // Use seriesId or seriesIndex or seriesName to location the series.\n seriesId: 'xxx',\n seriesIndex: 0,\n seriesName: 'nnn',\n\n // Use dataIndex to location the node.\n dataIndex: 12\n})\n</code></pre>\n<p>Event <a href=\"#event.focusNodeAdjacency\">focusNodeAdjacency</a> will be thrown finally.</p>\n", |
| "graph.unfocusNodeAdjacency": "<p>Reverse highlight the specified node and all of its adjacent nodes.</p>\n<pre><code class=\"lang-js\">dispatchAction({\n type: 'unfocusNodeAdjacency',\n\n // Use seriesId or seriesIndex or seriesName to location the series.\n seriesId: 'xxx',\n seriesIndex: 0,\n seriesName: 'nnn'\n})\n</code></pre>\n<p>Event <a href=\"#event.unfocusNodeAdjacency\">unfocusNodeAdjacency</a> will be thrown finally.</p>\n<!--============= brush ==========-->\n", |
| "brush": "<p><a href=\"option.html#brush\" target=\"_blank\">brush</a> related actions.</p>\n", |
| "brush.brush": "<p>This action sets select-boxes (areas) in this chart. For example:</p>\n<pre><code class=\"lang-javascript\">myChart.dispatchAction({\n type: 'brush',\n areas: [ // "areas" means select-boxes. Multi-boxes can be specified.\n // If "areas" is empty, all of the select-boxes will be deleted.\n { // The first area.\n\n // Indicate that this area is a "coodinate system area", belonging\n // to a geo coordinate system with getIndex: 0.\n // We can also use xAxisIndex or yAxisIndex to indicate that\n // this area belongs to a catesian coodinate system.\n // If no coordinate system is specified, this area is a\n // "global area", which does not belong to any coordinate system.\n // If an area belongs to a coordinate system, this area moves\n // and scales alone with the coordinate system.\n geoIndex: 0,\n // xAxisIndex: 0,\n // yAxisIndex: 0,\n\n // Optional: 'polygon', 'rect', 'lineX', 'lineY'\n brushType: 'polygon',\n\n // Only for "global area", define the area with the pixel coordinates.\n range: [\n ...\n ],\n\n // Only for "coordinate system area", define the area with the\n // coordinates.\n coordRange: [\n // In this case, the area is in a geo coordinate system, so\n // this is [longitude, latitude].\n [119.72,34.85],[119.68,34.85],[119.5,34.84],[119.19,34.77]\n ]\n },\n ... // Other areas.\n ]\n});\n</code></pre>\n<p>The content of <code class=\"codespan\">range</code> and <code class=\"codespan\">coordRange</code> can be:</p>\n<ul>\n<li>If <code class=\"codespan\">brushType</code> is 'rect':\n <code class=\"codespan\">range</code> and <code class=\"codespan\">coordRange</code> is: <code class=\"codespan\">[[minX, maxX], [minY, maxY]]</code></li>\n<li>If <code class=\"codespan\">brushType</code> is 'lineX' or 'lineY':\n <code class=\"codespan\">range</code> and <code class=\"codespan\">coordRange</code> is: [min, maxX]</li>\n<li>If <code class=\"codespan\">brushType</code> is 'polygon':\n <code class=\"codespan\">range</code> and <code class=\"codespan\">coordRange</code> is: [[point1X, point1X], [point2X, point2X], ...]</li>\n</ul>\n<p>The difference between <code class=\"codespan\">range</code> and <code class=\"codespan\">coordRange</code> is:</p>\n<ul>\n<li>If the area is "global area", we should use <code class=\"codespan\">range</code>.</li>\n<li>If the area is "coordinate system area" (i.e., <code class=\"codespan\">geoIndex</code> or <code class=\"codespan\">xAxisIndex</code> or <code class=\"codespan\">yAxisIndex</code> is specified), we should use <code class=\"codespan\">coordRange</code>.</li>\n<li>The unit of <code class=\"codespan\">range</code> is "pixel", while the unit of <code class=\"codespan\">coordRange</code> should be the save as the unit of the coordinate system. For example, in geo coordinate system, <code class=\"codespan\">coordRange</code> should be [<code class=\"codespan\">longitude</code>, <code class=\"codespan\">latitude</code>], and in cartesian, it should be [<code class=\"codespan\">axis A value</code>, <code class=\"codespan\">axis B value</code>, <code class=\"codespan\">axis C value</code>, ...].</li>\n</ul>\n", |
| "brush.takeGlobalCursor": "<p>The switch of the brush. This action can make the mouse enabled/disabled to brush.\nIn fact, the brush buttons in <a href=\"option.html#toolbox.feature.brush\" target=\"_blank\">toolbox</a> just use this aciton.</p>\n<p>This event corresponding to this action is <a href=\"#events.globalCursorTaken\">globalCursorTaken</a>.</p>\n<pre><code class=\"lang-js\">api.dispatchAction({\n type: 'takeGlobalCursor',\n // If intending to enable brush, must set. Otherwise, the mouse will be disabled to brush.\n key: 'brush',\n brushOption: {\n // See more info in the `brushType` of "brush component".\n // If set as `false`, the mouse is disabled to brush.\n brushType: string,\n // See more info in the `brushModel` of "brush component".\n // IF not set, use the `brushMode` of brush component.\n brushMode: string\n }\n});\n</code></pre>\n" |
| } |