2020-11-01 00:26:47 +08:00
{
"title" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p>标题组件，包含主标题和副标题。</p>\n<p>在 ECharts 2.x 中单个 ECharts 实例最多只能拥有一个标题组件。但是在 ECharts 3 中可以存在任意多个标题组件，这在需要标题进行排版，或者单个实例中的多个图表都需要标题时会比较有用。</p>\n<p><strong>例如下面不同缓动函数效果的示例，每一个缓动效果图都带有一个标题组件：</strong></p>\n<iframe data-src=\"http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=line-easing&edit=1&reset=1\" width=\"700\" height=\"400\"><iframe />\n\n\n\n\n\n" ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\nconst option = {\n title: {\n text: 'Main Title',\n subtext: 'Sub Title',\n left: 'center',\n top: 'center',\n textStyle: {\n fontSize: 30\n },\n subtextStyle: {\n fontSize: 20\n }\n }\n}\n" ,
"name" : "title-only" ,
"title" : "只有标题的实例" ,
"title-en" : "Title"
}
]
} ,
"legend" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p>图例组件。</p>\n<p>图例组件展现了不同系列的标记(symbol)，颜色和名字。可以通过点击图例控制哪些系列不显示。</p>\n<p>ECharts 3 中单个 echarts 实例中可以存在多个图例组件，会方便多个图例的布局。</p>\n<p>当图例数量过多时，可以使用 <a href=\"http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=pie-legend&edit=1&reset=1\" target=\"_blank\">滚动图例（垂直）</a> 或 <a href=\"http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=radar2&edit=1&reset=1\" target=\"_blank\">滚动图例（水平）</a>，参见：<a href=\"#legend.type\">legend.type</a></p>\n\n\n\n" ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\n\noption = {\n color: ['#003366', '#006699', '#4cabce', '#e5323e'],\n dataset: {\n source: [\n ['type', '2012', '2013', '2014', '2015', '2016'],\n ['Forest', 320, 332, 301, 334, 390],\n ['Steppe', 220, 182, 191, 234, 290],\n ['Desert', 150, 232, 201, 154, 190],\n ['Wetland', 98, 77, 101, 99, 40]\n ]\n },\n legend: {\n },\n xAxis: {\n type: 'category',\n axisTick: {show: false}\n },\n yAxis: {},\n series: [\n {\n type: 'bar',\n seriesLayoutBy: 'row'\n },\n {\n type: 'bar',\n seriesLayoutBy: 'row'\n },\n {\n type: 'bar',\n seriesLayoutBy: 'row'\n },\n {\n type: 'bar',\n seriesLayoutBy: 'row'\n }\n ]\n};\n" ,
"name" : "legend" ,
"title" : "基础图例" ,
"title-en" : "Basic Legend"
} ,
{
"code" : "\nconst option = {\n legend: {\n width: 350,\n left: 0\n },\n tooltip: {},\n dataset: {\n source: [\n ['product', '2012', '2013', '2014', '2015'],\n ['Matcha Latte', 41.1, 30.4, 65.1, 53.3],\n ['Milk Tea', 86.5, 92.1, 85.7, 83.1],\n ['Cheese Cocoa', 24.1, 67.2, 79.5, 86.4]\n ]\n },\n xAxis: [\n {type: 'category', gridIndex: 0},\n {type: 'category', gridIndex: 1}\n ],\n yAxis: [\n {gridIndex: 0},\n {gridIndex: 1}\n ],\n grid: [\n {bottom: '55%'},\n {top: '55%'}\n ],\n series: [\n // These series are in the first grid.\n {type: 'bar', seriesLayoutBy: 'row'},\n {type: 'bar', seriesLayoutBy: 'row'},\n {type: 'bar', seriesLayoutBy: 'row'},\n // These series are in the second grid.\n {type: 'bar', xAxisIndex: 1, yAxisIndex: 1},\n {type: 'bar', xAxisIndex: 1, yAxisIndex: 1},\n {type: 'bar', xAxisIndex: 1, yAxisIndex: 1},\n {type: 'bar', xAxisIndex: 1, yAxisIndex: 1}\n ]\n};\n\n" ,
"name" : "legend-more" ,
"title" : "多源图例" ,
"title-en" : "Legend on Multiple Source"
}
]
} ,
"grid" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p>直角坐标系内绘图网格，单个 grid 内最多可以放置上下两个 X 轴，左右两个 Y 轴。可以在网格上绘制<a href=\"#series-line\">折线图</a>， ， ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\nconst option = {\n color: ['#3398DB'],\n tooltip: {\n trigger: 'axis',\n axisPointer: { // 坐标轴指示器，坐标轴触发有效\n type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'\n }\n },\n grid: {\n },\n xAxis: [\n {\n type: 'category',\n data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],\n axisTick: {\n alignWithLabel: true\n }\n }\n ],\n yAxis: [\n {\n type: 'value'\n }\n ],\n series: [\n {\n name: '直接访问',\n type: 'bar',\n barWidth: '60%',\n data: [10, 52, 200, 334, 390, 330, 220]\n }\n ]\n};\n\n" ,
"title" : "基础网格示例" ,
"name" : "grid" ,
"title-en" : "Basic Grid"
}
]
} ,
"xAxis" : {
"desc" : "<p>直角坐标系 grid 中的 x 轴，一般情况下单个 grid 组件最多只能放上下两个 x 轴，多于两个 x 轴需要通过配置 <a href=\"#xAxis.offset\">offset</a> 属性防止同个位置多个 x 轴的重叠。</p>\n\n\n\n\n\n" ,
"exampleBaseOptions" : [
{
"code" : "\nconst option = {\n color: ['#3398DB'],\n tooltip: {\n trigger: 'axis',\n axisPointer: {\n type: 'shadow'\n }\n },\n grid: {},\n xAxis: [\n {\n type: 'category',\n data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']\n }\n ],\n yAxis: [\n {\n type: 'value'\n }\n ],\n series: [\n {\n name: '直接访问',\n type: 'bar',\n barWidth: '60%',\n data: [10, 52, 200, 334, 390, 330, 220]\n }\n ]\n};\n" ,
"title" : "基础 x 轴示例" ,
"name" : "x-axis" ,
"title-en" : "Basic X Axis"
} ,
{
"code" : "\n// https://echarts.apache.org/examples/zh/editor.html?c=line-function\nconst option = {\"animation\":false,\"grid\":{\"top\":40,\"left\":50,\"right\":40,\"bottom\":50},\"xAxis\":{\"name\":\"x\",\"minorTick\":{\"show\":true},\"splitLine\":{\"lineStyle\":{\"color\":\"#999\"}},\"minorSplitLine\":{\"show\":true,\"lineStyle\":{\"color\":\"#ddd\"}}},\"yAxis\":{\"name\":\"y\",\"min\":-100,\"max\":100,\"minorTick\":{\"show\":true},\"splitLine\":{\"lineStyle\":{\"color\":\"#999\"}},\"minorSplitLine\":{\"show\":true,\"lineStyle\":{\"color\":\"#ddd\"}}},\"dataZoom\":[{\"show\":true,\"type\":\"inside\",\"filterMode\":\"none\",\"xAxisIndex\":[0],\"startValue\":-20,\"endValue\":20},{\"show\":true,\"type\":\"inside\",\"filterMode\":\"none\",\"yAxisIndex\":[0],\"startValue\":-20,\"endValue\":20}],\"series\":[{\"type\":\"line\",\"showSymbol\":false,\"clip\":true,\"smooth\":true,\"data\" : [ [ -100 , -7.28568859177975 ] , [ -99.5 , -10.308641686442629 ] , [ -99 , -12.413148293738898 ] , [ -98.5 , -13.515078781534513 ] , [ -98 , -13.621163798783135 ] , [ -97.5 , -12.823906192675082 ] , [ -97 , -11.288665356829664 ] , [ -96.5 , -9.23425907937281 ] , [ -96 , -6.909008869380329 ] , [ -95.5 , -4.564555818396275 ] , [ -95 , -2.429959682553713 ] , [ -94.5 , -0.6885479810639478 ] , [ -94 , 0.5402906066423075 ] , [ -93.5 , 1.21264800981265 ] , [ -93 , 1.3638845704762748 ] , [ -92.5 , 1.1043049945382515 ] , [ -92 , 0.607128800864712 ] , [ -91.5 , 0.08988902269203362 ] , [ -91 , -0.2089830400941321 ] , [ -90.5 , -0.05616574430357663 ] , [ -90 , 0.7504337485361828 ] , [ -89.5 , 2.357963053593699 ] , [ -89 , 4.8396258541001735 ] , [ -88.5 , 8.182302580101384 ] , [ -88 , 12.28210110977527 ] , [ -87.5 , 16.94843212511602 ] , [ -87 , 21.916427041284017 ] , [ -86.5 , 26.866748982321948 ] , [ -86 , 31.45115851897577 ] , [ -85.5 , 35.321648453659435 ] , [ -85 , 38.160606043315696 ] , [ -84.5 , 39.709329939589225 ] , [ -84 , 39.792336052740495 ] , [ -83.5 , 38.33522352984697 ] , [ -83 , 35.37441051193005 ] , [ -82.5 , 31.057742636470405 ] , [ -82 , 25.635764735233245 ] , [ -81.5 , 19.444258578788666 ] , [ -81 , 12.879415101870299 ] , [ -80.5 , 6.367660473015441 ] , [ -80 , 0.33263375275288687 ] , [ -79.5 , -4.837923076371445 ] , [ -79 , -8.822578093923074 ] , [ -78.5 , -11.391358995906408 ] , [ -78 , -12.423514388716917 ] , [ -77.5 , -11.916388761583795 ] , [ -77 , -9.984670358500548 ] , [ -76.5 , -6.850092793304596 ] , [ -76 , -2.8224853658042144 ] , [ -75.5 , 1.7261975266933924 ] , [ -75 , 6.392644923935266 ] , [ -74.5 , 10.775134678186568 ] , [ -74 , 14.505865183234313 ] , [ -73.5 , 17.279956480954215 ] , [ -73 , 18.878712863643415 ] , [ -72.5 , 19.185255699222136 ] , [ -72 , 18.191313030152614 ] , [ -71.5 , 15.994731145683359 ] , [ -71 , 12.788083709042441 ] , [ -70.5 , 8.83952449599976 ] , [ -70 , 4.467692549018498 ] , [ -69.5 , 0.012975590895437749 ] , [ -69 , -4.1922741387420865 ] , [ -68.5 , -7.851922117811794 ] , [ -68 , -10.730163368329142 ] , [ -67.5 , -12.669495084794402 ] , [ -67 , -13.601062453462621 ] , [ -66.5 , -13.5465994712637 ] , [ -66 , -12.611959711686918 ] , [ -65.5 , -10.97299885981492 ] , [ -65 , -8.855262294629314 ] , [ -64.5 , -6.509484909480171 ] , [ -64 , -4.185277201955389 ] , [ -63.5 , -2.105518924587793 ] , [ -63 , -0.4438966754207421 ] , [ -62.5 , 0.692286852115487 ] , [ -62 , 1.2724079897455145 ] , [ -61.5 , 1.3449501671845296 ] , [ -61 , 1.0318351442775524 ] , [ -60.5 , 0.5151905269770695 ] , [ -60 , 0.017801185985999862 ] , [ -59.5 , -0.22090709289360527 ] , [ -59 , 0.028928422051093385 ] , [ -58.5 , 0.9617190257942162 ] , [ -58 , 2.713348257419601 ] , [ -57.5 , 5.3431673515049924 ] , [ -57 , 8.822875928469273 ] , [ -56.5 , 13.03348526904271 ] , [ -56 , 17.770830581210273 ] , [ -55.5 , 22.759318555202444 ] , [ -55 , 27.67283754054597 ] , [ -54.5 , 32.1610885780304 ] , [ -54 , 35.87907719610712 ] , [ -53.5 , 38.51718597410974 ] , [ -53 , 39.82915643467974 ] , [ -52.5 , 39.65545557536569 ] , [ -52 , 37.93987574464047 ] , [ -51.5 , 34.737784778835895 ] , [ -51 , 30.215157003198623 ] , [ -50.5 , 24.638312364356967 ] , [ -50 , 18.3551004804382 ] , [ -49.5 , 11.769017244537302 ] , [ -49 , 5.308367228986769 ] , [ -48.5 , -0.6069701736010016 ] , [ -48 , -5.598389007462409 ] , [ -47.5 , -9.358254797929293 ] , [ -47 , -11.673945378494896 ] , [ -46.5 , -12.44420341716319 ] , [ -46 , -11.68642247579883 ] , [ -45.5 , -9.534261396568692 ] , [ -45 , -6.225807256488313 ] , [ -44.5 , -2.08331287986152 ] , [ -44 , 2.5137494777176124 ] , [ -43.5 , 7.160013600760711 ] , [ -43 , 11.457257707042197 ] , [ -42.5 , 15.04636057918079 ] , [ -42 , 17.635494470616305 ] , [ -41.5 , 19.022220309574532 ] , [ -41 , 19.10769812254342 ] , [ -40.5 , 17.901924909054376 ] , [ -40 , 15.519701164991243 ] , [ -39.5 , 12.16783590862111 ] , [ -39 , 8.124856971095452 ] , [
"title" : "Minor Ticks" ,
"name" : "minor-ticks-x-axis" ,
"title-en" : "Minor Axis Ticks"
}
]
} ,
"yAxis" : {
"desc" : "<p>直角坐标系 grid 中的 y 轴，一般情况下单个 grid 组件最多只能放左右两个 y 轴，多于两个 y 轴需要通过配置 <a href=\"#yAxis.offset\">offset</a> 属性防止同个位置多个 Y 轴的重叠。</p>\n\n\n\n\n\n" ,
"exampleBaseOptions" : [
{
"code" : "\nconst option = {\n color: ['#3398DB'],\n tooltip: {\n trigger: 'axis',\n axisPointer: {\n type: 'shadow'\n }\n },\n grid: {},\n xAxis: [\n {\n type: 'category',\n data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']\n }\n ],\n yAxis: [\n {\n type: 'value'\n }\n ],\n series: [\n {\n name: '直接访问',\n type: 'bar',\n barWidth: '60%',\n data: [10, 52, 200, 334, 390, 330, 220]\n }\n ]\n};\n" ,
"title" : "基础 y 轴示例" ,
"name" : "y-axis" ,
"title-en" : "Basic Y Axis"
} ,
{
"code" : "\noption = {\n legend: {\n left: 'left',\n data: ['2的指数', '3的指数']\n },\n xAxis: {\n type: 'category',\n name: 'x',\n splitLine: {show: false},\n data: ['一', '二', '三', '四', '五', '六', '七', '八', '九']\n },\n grid: {\n left: '3%',\n right: '4%',\n bottom: '3%',\n containLabel: true\n },\n yAxis: {\n type: 'log',\n name: 'y',\n minorTick: {\n show: true\n },\n minorSplitLine: {\n show: true\n }\n },\n series: [\n {\n name: '3的指数',\n type: 'line',\n data: [1, 3, 9, 27, 81, 247, 741, 2223, 6669]\n },\n {\n name: '2的指数',\n type: 'line',\n data: [1, 2, 4, 8, 16, 32, 64, 128, 256]\n },\n {\n name: '1/2的指数',\n type: 'line',\n data: [1/2, 1/4, 1/8, 1/16, 1/32, 1/64, 1/128, 1/256, 1/512]\n }\n ]\n};\n\n" ,
"title" : "Log 轴示例" ,
"name" : "y-axis-log" ,
"title-en" : "Log Axis"
}
]
} ,
"polar" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p>极坐标系，可以用于散点图和折线图。每个极坐标系拥有一个<a href=\"#angleAxis\">角度轴</a>和一个<a href=\"#radiusAxis\">半径轴</a>。</p>\n<p><strong>示例：</strong></p>\n<iframe data-src=\"http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=scatter-polar-punchCard&edit=1&reset=1\" width=\"600\" height=\"400\"><iframe />\n\n\n\n\n\n" ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\n\nconst hours = ['12a', '1a', '2a', '3a', '4a', '5a', '6a',\n '7a', '8a', '9a','10a','11a',\n '12p', '1p', '2p', '3p', '4p', '5p',\n '6p', '7p', '8p', '9p', '10p', '11p'];\nconst days = ['Saturday', 'Friday', 'Thursday',\n 'Wednesday', 'Tuesday', 'Monday', 'Sunday'];\n\nconst data = [[0,0,5],[0,1,1],[0,2,0],[0,3,0],[0,4,0],[0,5,0],[0,6,0],[0,7,0],[0,8,0],[0,9,0],[0,10,0],[0,11,2],[0,12,4],[0,13,1],[0,14,1],[0,15,3],[0,16,4],[0,17,6],[0,18,4],[0,19,4],[0,20,3],[0,21,3],[0,22,2],[0,23,5],[1,0,7],[1,1,0],[1,2,0],[1,3,0],[1,4,0],[1,5,0],[1,6,0],[1,7,0],[1,8,0],[1,9,0],[1,10,5],[1,11,2],[1,12,2],[1,13,6],[1,14,9],[1,15,11],[1,16,6],[1,17,7],[1,18,8],[1,19,12],[1,20,5],[1,21,5],[1,22,7],[1,23,2],[2,0,1],[2,1,1],[2,2,0],[2,3,0],[2,4,0],[2,5,0],[2,6,0],[2,7,0],[2,8,0],[2,9,0],[2,10,3],[2,11,2],[2,12,1],[2,13,9],[2,14,8],[2,15,10],[2,16,6],[2,17,5],[2,18,5],[2,19,5],[2,20,7],[2,21,4],[2,22,2],[2,23,4],[3,0,7],[3,1,3],[3,2,0],[3,3,0],[3,4,0],[3,5,0],[3,6,0],[3,7,0],[3,8,1],[3,9,0],[3,10,5],[3,11,4],[3,12,7],[3,13,14],[3,14,13],[3,15,12],[3,16,9],[3,17,5],[3,18,5],[3,19,10],[3,20,6],[3,21,4],[3,22,4],[3,23,1],[4,0,1],[4,1,3],[4,2,0],[4,3,0],[4,4,0],[4,5,1],[4,6,0],[4,7,0],[4,8,0],[4,9,2],[4,10,4],[4,11,4],[4,12,2],[4,13,4],[4,14,4],[4,15,14],[4,16,12],[4,17,1],[4,18,8],[4,19,5],[4,20,3],[4,21,7],[4,22,3],[4,23,0],[5,0,2],[5,1,1],[5,2,0],[5,3,3],[5,4,0],[5,5,0],[5,6,0],[5,7,0],[5,8,2],[5,9,0],[5,10,4],[5,11,1],[5,12,5],[5,13,10],[5,14,5],[5,15,7],[5,16,11],[5,17,6],[5,18,0],[5,19,5],[5,20,3],[5,21,4],[5,22,2],[5,23,0],[6,0,1],[6,1,0],[6,2,0],[6,3,0],[6,4,0],[6,5,0],[6,6,0],[6,7,0],[6,8,0],[6,9,0],[6,10,1],[6,11,0],[6,12,2],[6,13,1],[6,14,3],[6,15,4],[6,16,0],[6,17,0],[6,18,0],[6,19,0],[6,20,1],[6,21,2],[6,22,2],[6,23,6]];\n\nconst option = {\n title: {\n text: 'Punch Card of Github',\n link: 'https://github.com/pissang/echarts-next/graphs/punch-card'\n },\n legend: {\n data: ['Punch Card'],\n left: 'right'\n },\n polar: {},\n angleAxis: {\n type: 'category',\n data: hours,\n boundaryGap: false,\n splitLine: {\n show: true,\n lineStyle: {\n color: '#999',\n type: 'dashed'\n }\n },\n axisLine: {\n show: false\n }\n },\n radiusAxis: {\n type: 'category',\n data: days,\n axisLine: {\n show: false\n },\n axisLabel: {\n rotate: 45\n }\n },\n series: [{\n name: 'Punch Card',\n type: 'scatter',\n coordinateSystem: 'polar',\n symbolSize: function (val) {\n return val[2] * 2;\n },\n data: data\n }]\n};\n" ,
"name" : "polar" ,
"title" : "极坐标系" ,
"title-en" : "Polar"
}
]
} ,
"radiusAxis" : {
"desc" : "<p>极坐标系的径向轴。</p>\n\n\n\n\n\n" ,
"exampleBaseOptions" : [
{
"code" : "\nconst data = [];\n\nfor (let i = 0; i <= 360; i++) {\n const t = i / 180 * Math.PI;\n const r = Math.sin(2 * t) * Math.cos(2 * t);\n data.push([r, i]);\n}\n\nconst option = {\n polar: {\n center: ['50%', '54%']\n },\n tooltip: {\n trigger: 'axis',\n axisPointer: {\n type: 'cross'\n }\n },\n angleAxis: {\n type: 'value',\n startAngle: 0,\n },\n radiusAxis: {\n min: 0\n },\n series: [{\n coordinateSystem: 'polar',\n name: 'line',\n type: 'line',\n showSymbol: false,\n data: data\n }],\n animationDuration: 2000\n};\n" ,
"name" : "two-number-axis" ,
"title" : "双数值轴" ,
"title-en" : "Tow Number Axes"
} ,
{
"code" : "\n\nconst hours = ['12a', '1a', '2a', '3a', '4a', '5a', '6a',\n '7a', '8a', '9a','10a','11a',\n '12p', '1p', '2p', '3p', '4p', '5p',\n '6p', '7p', '8p', '9p', '10p', '11p'];\nconst days = ['Saturday', 'Friday', 'Thursday',\n 'Wednesday', 'Tuesday', 'Monday', 'Sunday'];\n\nconst option = {\n title: {\n text: 'Punch Card of Github'\n },\n legend: {\n data: ['Punch Card'],\n left: 'right'\n },\n polar: {},\n angleAxis: {\n type: 'category',\n data: hours,\n boundaryGap: false\n },\n radiusAxis: {\n type: 'category',\n data: days\n }\n};\n" ,
"name" : "two-category-axis" ,
"title" : "双类目轴" ,
"title-en" : "Tow Category Axes"
}
]
} ,
"angleAxis" : {
"desc" : "<p>极坐标系的角度轴。</p>\n\n\n\n\n\n" ,
"exampleBaseOptions" : [
{
"code" : "\nconst data = [];\n\nfor (let i = 0; i <= 360; i++) {\n const t = i / 180 * Math.PI;\n const r = Math.sin(2 * t) * Math.cos(2 * t);\n data.push([r, i]);\n}\n\nconst option = {\n polar: {\n center: ['50%', '54%']\n },\n tooltip: {\n trigger: 'axis',\n axisPointer: {\n type: 'cross'\n }\n },\n angleAxis: {\n type: 'value',\n startAngle: 0,\n },\n radiusAxis: {\n min: 0\n },\n series: [{\n coordinateSystem: 'polar',\n name: 'line',\n type: 'line',\n showSymbol: false,\n data: data\n }],\n animationDuration: 2000\n};\n" ,
"name" : "two-number-axis" ,
"title" : "双数值轴" ,
"title-en" : "Two Number Axes"
} ,
{
"code" : "\n\nconst hours = ['12a', '1a', '2a', '3a', '4a', '5a', '6a',\n '7a', '8a', '9a','10a','11a',\n '12p', '1p', '2p', '3p', '4p', '5p',\n '6p', '7p', '8p', '9p', '10p', '11p'];\nconst days = ['Saturday', 'Friday', 'Thursday',\n 'Wednesday', 'Tuesday', 'Monday', 'Sunday'];\n\nconst option = {\n title: {\n text: 'Punch Card of Github'\n },\n legend: {\n data: ['Punch Card'],\n left: 'right'\n },\n polar: {},\n angleAxis: {\n type: 'category',\n data: hours,\n boundaryGap: false\n },\n radiusAxis: {\n type: 'category',\n data: days\n }\n};\n" ,
"name" : "two-category-axis" ,
"title" : "双类目轴" ,
"title-en" : "Two Category Axes"
}
]
} ,
"radar" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p>雷达图坐标系组件，只适用于<a href=\"#series-radar\">雷达图</a>。该组件等同 ECharts 2 中的 polar 组件。因为 3 中的 polar 被重构为标准的极坐标组件，为避免混淆，雷达图使用 radar 组件作为其坐标系。</p>\n<p>雷达图坐标系与极坐标系不同的是它的每一个轴（ ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\nconst option = {\n title: {\n text: '基础雷达图'\n },\n tooltip: {},\n legend: {\n data: ['Allocated Budget', 'Actual Spending']\n },\n radar: {\n indicator: [\n { name: 'sales', max: 6500},\n { name: 'Administration', max: 16000},\n { name: 'Information Techology', max: 30000},\n { name: 'Customer Support', max: 38000},\n { name: 'Development', max: 52000},\n { name: 'Marketing', max: 25000}\n ]\n },\n series: [{\n name: '预算 vs 开销（ ） ,
"name" : "radar" ,
"title" : "基础雷达图" ,
"title-en" : "Radar"
}
]
} ,
"dataZoom" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><code class=\"codespan\">dataZoom</code> 组件 用于区域缩放，从而能自由关注细节的数据信息，或者概览数据整体，或者去除离群点的影响。</p>\n<p>现在支持这几种类型的 <code class=\"codespan\">dataZoom</code> 组件：</p>\n<ul>\n<li><p><a href=\"#dataZoom-inside\">内置型数据区域缩放组件（ ） （ ） （ ） （ ） （ ， （ ） ） > f i t e r M o d e : & # 39 ; e m p t y & # 39 ; < / c o d e > 。 < / p > \ n < / l i > \ n < l i > < p > 如 <EFBFBD> <EFBFBD>
2020-11-01 00:26:47 +08:00
} ,
"dataZoom-inside" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><strong>内置型数据区域缩放组件（ ） （ ） ） ： （ ） ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\nconst data = [[\"2014-07-14\",156],[\"2014-07-15\",140],[\"2014-07-16\",133],[\"2014-07-17\",186],[\"2014-07-18\",182],[\"2014-07-19\",106],[\"2014-07-20\",119],[\"2014-07-21\",68],[\"2014-07-22\",54],[\"2014-07-23\",82],[\"2014-07-24\",90],[\"2014-07-25\",134],[\"2014-07-26\",188],[\"2014-07-27\",194],[\"2014-07-28\",159],[\"2014-07-29\",159],[\"2014-07-30\",169],[\"2014-07-31\",244],[\"2014-08-01\",199],[\"2014-08-02\",163],[\"2014-08-03\",149],[\"2014-08-05\",80],[\"2014-08-06\",67],[\"2014-08-07\",162],[\"2014-08-08\",140],[\"2014-08-09\",143],[\"2014-08-10\",125],[\"2014-08-11\",76],[\"2014-08-12\",119],[\"2014-08-13\",70],[\"2014-08-14\",104],[\"2014-08-15\",109],[\"2014-08-16\",159],[\"2014-08-17\",124],[\"2014-08-18\",135],[\"2014-08-19\",150],[\"2014-08-20\",164],[\"2014-08-21\",169],[\"2014-08-22\",83],[\"2014-08-23\",155],[\"2014-08-24\",75],[\"2014-08-25\",59],[\"2014-08-26\",78],[\"2014-08-27\",136],[\"2014-08-28\",103],[\"2014-08-29\",104],[\"2014-08-30\",176],[\"2014-08-31\",89],[\"2014-09-01\",127],[\"2014-09-03\",54],[\"2014-09-04\",100],[\"2014-09-05\",140],[\"2014-09-06\",186],[\"2014-09-07\",200],[\"2014-09-08\",61],[\"2014-09-09\",109],[\"2014-09-10\",111],[\"2014-09-11\",114],[\"2014-09-12\",97],[\"2014-09-13\",94],[\"2014-09-14\",66],[\"2014-09-15\",54],[\"2014-09-16\",87],[\"2014-09-17\",80],[\"2014-09-18\",84],[\"2014-09-19\",117],[\"2014-09-20\",168],[\"2014-09-21\",129],[\"2014-09-22\",127],[\"2014-09-23\",64],[\"2014-09-24\",60],[\"2014-09-25\",144],[\"2014-09-26\",170],[\"2014-09-27\",58],[\"2014-09-28\",87],[\"2014-09-29\",70],[\"2014-09-30\",53],[\"2014-10-01\",92],[\"2014-10-02\",78],[\"2014-10-03\",123],[\"2014-10-04\",95],[\"2014-10-05\",54],[\"2014-10-06\",68],[\"2014-10-07\",200],[\"2014-10-08\",314],[\"2014-10-09\",379],[\"2014-10-10\",346],[\"2014-10-11\",233],[\"2014-10-14\",80],[\"2014-10-15\",73],[\"2014-10-16\",76],[\"2014-10-17\",132],[\"2014-10-18\",211],[\"2014-10-19\",289],[\"2014-10-20\",250],[\"2014-10-21\",82],[\"2014-10-22\",99],[\"2014-10-23\",163],[\"2014-10-24\",267],[\"2014-10-25\",353],[\"2014-10-26\",78],[\"2014-10-27\",72],[\"2014-10-28\",88],[\"2014-10-29\",140],[\"2014-10-30\",206],[\"2014-10-31\",204],[\"2014-11-01\",65],[\"2014-11-03\",59],[\"2014-11-04\",150],[\"2014-11-05\",79],[\"2014-11-07\",63],[\"2014-11-08\",93],[\"2014-11-09\",80],[\"2014-11-10\",95],[\"2014-11-11\",59],[\"2014-11-13\",65],[\"2014-11-14\",77],[\"2014-11-15\",143],[\"2014-11-16\",98],[\"2014-11-17\",64],[\"2014-11-18\",93],[\"2014-11-19\",282],[\"2014-11-23\",155],[\"2014-11-24\",94],[\"2014-11-25\",196],[\"2014-11-26\",293],[\"2014-11-27\",83],[\"2014-11-28\",114],[\"2014-11-29\",276],[\"2014-12-01\",54],[\"2014-12-02\",65],[\"2014-12-03\",51],[\"2014-12-05\",62],[\"2014-12-06\",89],[\"2014-12-07\",65],[\"2014-12-08\",82],[\"2014-12-09\",276],[\"2014-12-10\",153],[\"2014-12-11\",52],[\"2014-12-13\",69],[\"2014-12-14\",113],[\"2014-12-15\",82],[\"2014-12-17\",99],[\"2014-12-19\",53],[\"2014-12-22\",103],[\"2014-12-23\",100],[\"2014-12-25\",73],[\"2014-12-26\",155],[\"2014-12-27\",243],[\"2014-12-28\",155],[\"2014-12-29\",125],[\"2014-12-30\",65],[\"2015-01-01\",65],[\"2015-01-02\",79],[\"2015-01-03\",200],[\"2015-01-04\",226],[\"2015-01-05\",122],[\"2015-01-06\",60],[\"2015-01-07\",85],[\"2015-01-08\",190],[\"2015-01-09\",105],[\"2015-01-10\",208],[\"2015-01-11\",59],[\"2015-01-12\",160],[\"2015-01-13\",211],[\"2015-01-14\",265],[\"2015-01-15\",386],[\"2015-01-16\",118],[\"2015-01-17\",89],[\"2015-01-18\",94],[\"2015-01-19\",77],[\"2015-01-20\",113],[\"2015-01-22\",143],[\"2015-01-23\",257],[\"2015-01-24\",117],[\"2015-01-25\",185],[\"2015-01-26\",119],[\"2015-01-28\",65],[\"2015-01-29\",87],[\"2015-01-31\",60],[\"2015-02-01\",108],[\"2015-02-02\",188],[\"2015-02-03\",143],[\"2015-02-05\",62],[\"2015-02-06\",100],[\"2015-02-09\",152],[\"2015-02-10\",166],[\"2015-02-11\",55],[\"2015-02-12\",59],[\"2015-02-13\",175],[\"2015-02-14\",293],[\"2015-02-15\",326],[\"2015-02-16\",153],[\"2015-02-18\",73],[\"2015-02-19\",267],[\"2015-02-20\",183],[\"2015-02-21\",394],[\" 2015 -0 2
"name" : "data-zoom-inside" ,
"title" : "使用拖拽滚轮平移缩放" ,
"title-en" : "DataZoom with Pan and Zoom"
}
]
} ,
"dataZoom-slider" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><strong>滑动条型数据区域缩放组件（ ） ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\nconst data = [[\"2014-07-14\",156],[\"2014-07-15\",140],[\"2014-07-16\",133],[\"2014-07-17\",186],[\"2014-07-18\",182],[\"2014-07-19\",106],[\"2014-07-20\",119],[\"2014-07-21\",68],[\"2014-07-22\",54],[\"2014-07-23\",82],[\"2014-07-24\",90],[\"2014-07-25\",134],[\"2014-07-26\",188],[\"2014-07-27\",194],[\"2014-07-28\",159],[\"2014-07-29\",159],[\"2014-07-30\",169],[\"2014-07-31\",244],[\"2014-08-01\",199],[\"2014-08-02\",163],[\"2014-08-03\",149],[\"2014-08-05\",80],[\"2014-08-06\",67],[\"2014-08-07\",162],[\"2014-08-08\",140],[\"2014-08-09\",143],[\"2014-08-10\",125],[\"2014-08-11\",76],[\"2014-08-12\",119],[\"2014-08-13\",70],[\"2014-08-14\",104],[\"2014-08-15\",109],[\"2014-08-16\",159],[\"2014-08-17\",124],[\"2014-08-18\",135],[\"2014-08-19\",150],[\"2014-08-20\",164],[\"2014-08-21\",169],[\"2014-08-22\",83],[\"2014-08-23\",155],[\"2014-08-24\",75],[\"2014-08-25\",59],[\"2014-08-26\",78],[\"2014-08-27\",136],[\"2014-08-28\",103],[\"2014-08-29\",104],[\"2014-08-30\",176],[\"2014-08-31\",89],[\"2014-09-01\",127],[\"2014-09-03\",54],[\"2014-09-04\",100],[\"2014-09-05\",140],[\"2014-09-06\",186],[\"2014-09-07\",200],[\"2014-09-08\",61],[\"2014-09-09\",109],[\"2014-09-10\",111],[\"2014-09-11\",114],[\"2014-09-12\",97],[\"2014-09-13\",94],[\"2014-09-14\",66],[\"2014-09-15\",54],[\"2014-09-16\",87],[\"2014-09-17\",80],[\"2014-09-18\",84],[\"2014-09-19\",117],[\"2014-09-20\",168],[\"2014-09-21\",129],[\"2014-09-22\",127],[\"2014-09-23\",64],[\"2014-09-24\",60],[\"2014-09-25\",144],[\"2014-09-26\",170],[\"2014-09-27\",58],[\"2014-09-28\",87],[\"2014-09-29\",70],[\"2014-09-30\",53],[\"2014-10-01\",92],[\"2014-10-02\",78],[\"2014-10-03\",123],[\"2014-10-04\",95],[\"2014-10-05\",54],[\"2014-10-06\",68],[\"2014-10-07\",200],[\"2014-10-08\",314],[\"2014-10-09\",379],[\"2014-10-10\",346],[\"2014-10-11\",233],[\"2014-10-14\",80],[\"2014-10-15\",73],[\"2014-10-16\",76],[\"2014-10-17\",132],[\"2014-10-18\",211],[\"2014-10-19\",289],[\"2014-10-20\",250],[\"2014-10-21\",82],[\"2014-10-22\",99],[\"2014-10-23\",163],[\"2014-10-24\",267],[\"2014-10-25\",353],[\"2014-10-26\",78],[\"2014-10-27\",72],[\"2014-10-28\",88],[\"2014-10-29\",140],[\"2014-10-30\",206],[\"2014-10-31\",204],[\"2014-11-01\",65],[\"2014-11-03\",59],[\"2014-11-04\",150],[\"2014-11-05\",79],[\"2014-11-07\",63],[\"2014-11-08\",93],[\"2014-11-09\",80],[\"2014-11-10\",95],[\"2014-11-11\",59],[\"2014-11-13\",65],[\"2014-11-14\",77],[\"2014-11-15\",143],[\"2014-11-16\",98],[\"2014-11-17\",64],[\"2014-11-18\",93],[\"2014-11-19\",282],[\"2014-11-23\",155],[\"2014-11-24\",94],[\"2014-11-25\",196],[\"2014-11-26\",293],[\"2014-11-27\",83],[\"2014-11-28\",114],[\"2014-11-29\",276],[\"2014-12-01\",54],[\"2014-12-02\",65],[\"2014-12-03\",51],[\"2014-12-05\",62],[\"2014-12-06\",89],[\"2014-12-07\",65],[\"2014-12-08\",82],[\"2014-12-09\",276],[\"2014-12-10\",153],[\"2014-12-11\",52],[\"2014-12-13\",69],[\"2014-12-14\",113],[\"2014-12-15\",82],[\"2014-12-17\",99],[\"2014-12-19\",53],[\"2014-12-22\",103],[\"2014-12-23\",100],[\"2014-12-25\",73],[\"2014-12-26\",155],[\"2014-12-27\",243],[\"2014-12-28\",155],[\"2014-12-29\",125],[\"2014-12-30\",65],[\"2015-01-01\",65],[\"2015-01-02\",79],[\"2015-01-03\",200],[\"2015-01-04\",226],[\"2015-01-05\",122],[\"2015-01-06\",60],[\"2015-01-07\",85],[\"2015-01-08\",190],[\"2015-01-09\",105],[\"2015-01-10\",208],[\"2015-01-11\",59],[\"2015-01-12\",160],[\"2015-01-13\",211],[\"2015-01-14\",265],[\"2015-01-15\",386],[\"2015-01-16\",118],[\"2015-01-17\",89],[\"2015-01-18\",94],[\"2015-01-19\",77],[\"2015-01-20\",113],[\"2015-01-22\",143],[\"2015-01-23\",257],[\"2015-01-24\",117],[\"2015-01-25\",185],[\"2015-01-26\",119],[\"2015-01-28\",65],[\"2015-01-29\",87],[\"2015-01-31\",60],[\"2015-02-01\",108],[\"2015-02-02\",188],[\"2015-02-03\",143],[\"2015-02-05\",62],[\"2015-02-06\",100],[\"2015-02-09\",152],[\"2015-02-10\",166],[\"2015-02-11\",55],[\"2015-02-12\",59],[\"2015-02-13\",175],[\"2015-02-14\",293],[\"2015-02-15\",326],[\"2015-02-16\",153],[\"2015-02-18\",73],[\"2015-02-19\",267],[\"2015-02-20\",183],[\"2015-02-21\",394],[\" 2015 -0 2
"name" : "data-zoom-slider" ,
"title" : "滑块缩放的 dataZoom" ,
"title-en" : "DataZoom with Slider"
}
]
} ,
"visualMap" : {
"desc" : "<p><code class=\"codespan\">visualMap</code> 是视觉映射组件，用于进行『视觉编码』，也就是将数据映射到视觉元素（视觉通道）。</p>\n<p>视觉元素可以是：<br></p>\n<ul>\n<li><code class=\"codespan\">symbol</code>: 图元的图形类别。</li>\n<li><code class=\"codespan\">symbolSize</code>: 图元的大小。</li>\n<li><code class=\"codespan\">color</code>: 图元的颜色。</li>\n<li><code class=\"codespan\">colorAlpha</code>: 图元的颜色的透明度。</li>\n<li><code class=\"codespan\">opacity</code>: 图元以及其附属物（如文字标签）的透明度。</li>\n<li><code class=\"codespan\">colorLightness</code>: 颜色的明暗度，参见 <a href=\"https://en.wikipedia.org/wiki/HSL_and_HSV\" target=\"_blank\">HSL</a>。</li>\n<li><code class=\"codespan\">colorSaturation</code>: 颜色的饱和度，参见 <a href=\"https://en.wikipedia.org/wiki/HSL_and_HSV\" target=\"_blank\">HSL</a>。</li>\n<li><code class=\"codespan\">colorHue</code>: 颜色的色调，参见 <a href=\"https://en.wikipedia.org/wiki/HSL_and_HSV\" target=\"_blank\">HSL</a>。</li>\n</ul>\n<p><code class=\"codespan\">visualMap</code> 组件可以定义多个，从而可以同时对数据中的多个维度进行视觉映射。</p>\n<p><code class=\"codespan\">visualMap</code> 组件可以定义为 <a href=\"#visualMap-piecewise\">分段型（ ） （ ） （
} ,
"visualMap-continuous" : {
"desc" : "<p><strong>连续型视觉映射组件（ ） （ ） ） ,
"exampleBaseOptions" : [
{
"code" : "\n// https://echarts.apache.org/examples/zh/editor.html?c=heatmap-large\noption = {\"tooltip\":{},\"xAxis\":{\"type\":\"category\",\"data\":[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20]},\"yAxis\":{\"type\":\"category\",\"data\":[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19]},\"visualMap\":{\"min\":0,\"max\":100,\"calculable\":true,\"realtime\":false,\"inRange\":{\"color\":[\"#313695\",\"#4575b4\",\"#74add1\",\"#abd9e9\",\"#e0f3f8\",\"#ffffbf\",\"#fee090\",\"#fdae61\",\"#f46d43\",\"#d73027\",\"#a50026\"]}},\"series\":[{\"name\":\"Gaussian\",\"type\":\"heatmap\",\"data\" : [ [ 0 , 0 , 50 ] , [ 0 , 1 , 50 ] , [ 0 , 2 , 50 ] , [ 0 , 3 , 50 ] , [ 0 , 4 , 50 ] , [ 0 , 5 , 50 ] , [ 0 , 6 , 50 ] , [ 0 , 7 , 50 ] , [ 0 , 8 , 50 ] , [ 0 , 9 , 50 ] , [ 0 , 10 , 50 ] , [ 0 , 11 , 50 ] , [ 0 , 12 , 50 ] , [ 0 , 13 , 50 ] , [ 0 , 14 , 50 ] , [ 0 , 15 , 50 ] , [ 0 , 16 , 50 ] , [ 0 , 17 , 50 ] , [ 0 , 18 , 50 ] , [ 0 , 19 , 50 ] , [ 0 , 20 , 50 ] , [ 1 , 0 , 54.994209375000004 ] , [ 1 , 1 , 54.98855287535156 ] , [ 1 , 2 , 54.983669047750006 ] , [ 1 , 3 , 54.980227686550776 ] , [ 1 , 4 , 54.978760914000006 ] , [ 1 , 5 , 54.97964233398438 ] , [ 1 , 6 , 54.983074003125 ] , [ 1 , 7 , 54.98908121921484 ] , [ 1 , 8 , 54.997515127 ] , [ 1 , 9 , 55.00806314130469 ] , [ 1 , 10 , 55.020267187500004 ] , [ 1 , 11 , 55.0335497593164 ] , [ 1 , 12 , 55.047247794 ] , [ 1 , 13 , 55.0606543648125 ] , [ 1 , 14 , 55.073068190875 ] , [ 1 , 15 , 55.08385096435546 ] , [ 1 , 16 , 55.092492495 ] , [ 1 , 17 , 55.09868367200781 ] , [ 1 , 18 , 55.10239724325 ] , [ 1 , 19 , 55.103976411832036 ] , [ 1 , 20 , 55.104231250000005 ] , [ 2 , 0 , 59.9144 ] , [ 2 , 1 , 59.87254178725 ] , [ 2 , 2 , 59.83612736 ] , [ 2 , 3 , 59.80991875325 ] , [ 2 , 4 , 59.797737472 ] , [ 2 , 5 , 59.80230078125 ] , [ 2 , 6 , 59.825115776000004 ] , [ 2 , 7 , 59.866431231250004 ] , [ 2 , 8 , 59.925247232000004 ] , [ 2 , 9 , 59.999382583250004 ] , [ 2 , 10 , 60.08560000000001 ] , [ 2 , 11 , 60.17978907725 ] , [ 2 , 12 , 60.27720704 ] , [ 2 , 13 , 60.37277727325 ] , [ 2 , 14 , 60.461445632 ] , [ 2 , 15 , 60.53859453125 ] , [ 2 , 16 , 60.60051481600001 ] , [ 2 , 17 , 60.64493541125 ] , [ 2 , 18 , 60.67161075200001 ] , [ 2 , 19 , 60.68296599325001 ] , [ 2 , 20 , 60.6848 ] , [ 3 , 0 , 64.60082187500001 ] , [ 3 , 1 , 64.4705362889961 ] , [ 3 , 2 , 64.35634390175 ] , [ 3 , 3 , 64.27246293910156 ] , [ 3 , 4 , 64.230427154 ] , [ 3 , 5 , 64.23854693603516 ] , [ 3 , 6 , 64.301550051125 ] , [ 3 , 7 , 64.42040201135937 ] , [ 3 , 8 , 64.592306075 ] , [ 3 , 9 , 64.81088287663673 ] , [ 3 , 10 , 65.0665296875 ] , [ 3 , 11 , 65.34695930592969 ] , [ 3 , 12 , 65.637918578 ] , [ 3 , 13 , 65.92408654830078 ] , [ 3 , 14 , 66.190152240875 ] , [ 3 , 15 , 66.4220720703125 ] , [ 3 , 16 , 66.60850688299999 ] , [ 3 , 17 , 66.74243862852734 ] , [ 3 , 18 , 66.82296666124999 ] , [ 3 , 19 , 66.85728367200781 ] , [ 3 , 20 , 66.86283125 ] , [ 4 , 0 , 68.8416 ] , [ 4 , 1 , 68.557701681 ] , [ 4 , 2 , 68.30702156800001 ] , [ 4 , 3 , 68.11922918100001 ] , [ 4 , 4 , 68.01867264 ] , [ 4 , 5 , 68.023140625 ] , [ 4 , 6 , 68.143015296 ] , [ 4 , 7 , 68.380816173 ] , [ 4 , 8 , 68.731134976 ] , [ 4 , 9 , 69.180961425 ] , [ 4 , 10 , 69.7104 ] , [ 4 , 11 , 70.29377766100001 ] , [ 4 , 12 , 70.90114252800001 ] , [ 4 , 13 , 71.50015352100002 ] , [ 4 , 14 , 72.05836096 ] , [ 4 , 15 , 72.545878125 ] , [ 4 , 16 , 72.938443776 ] , [ 4 , 17 , 73.22087563299999 ] , [ 4 , 18 , 73.39091481599999 ] , [ 4 , 19 , 73.46346124499999 ] , [ 4 , 20 , 73.4752 ] , [ 5 , 0 , 72.412109375 ] , [ 5 , 1 , 71.90412197265626 ] , [ 5 , 2 , 71.45227109375 ] , [ 5 , 3 , 71.10730203857422 ] , [ 5 , 4 , 70.91138125 ] , [ 5 , 5 , 70.89576721191406 ] , [ 5 , 6 , 71.07918007812499 ] , [ 5 , 7 , 71.46687003173828 ] , [ 5 , 8 , 72.050384375 ] , [ 5 , 9 , 72.80803334960937 ] , [ 5 , 10 , 73.7060546875 ] , [ 5 , 11 , 74.70047689208985 ] , [ 5 , 12 , 75.73968125 ] , [ 5 , 13 , 76.76766257324219 ] , [ 5 , 14 , 77.72798867187501 ] , [ 5 , 15 , 78.5684585571289 ] , [ 5 , 16 , 79.246459375 ] , [ 5 , 17 , 79.73502207031248 ] , [ 5 , 18 , 80.02957578124999 ] , [ 5 , 19 , 80.15540096435545 ] , [ 5 , 20 , 80.17578125 ] , [ 6 , 0 , 75.10759999999999 ] , [ 6 , 1 , 74.306365026875 ] , [ 6 , 2 , 73.588477184 ] , [ 6 , 3 , 73.030288488875 ] , [ 6 , 4 , 72.69610342399999 ] , [ 6 , 5 , 72.634326171875 ] , [ 6 , 6 , 72.87470864 ] , [ 6 , 7 , 73.426699275875 ] , [ 6 , 8 , 74.278892672 ] , [ 6 , 9 , 75.399579960875 ] , [ 6 , 10 , 76.7384 ] , [ 6 , 11 , 78.229091346875 ] , [ 6 , 12 , 79.79334502399999 ] , [ 6 , 13 , 81.345758073875 ] , [ 6 , 14 , 82.79988790399999 ] , [ 6 , 15 , 84.075407421875 ] , [ 6 , 16 , 85.10636096 ] , [ 6 , 17 , 85.85052099087498 ] , [ 6 , 18 , 86.299845632 ] , [ 6 , 19 , 86.49203694087497 ] , [ 6 , 20 , 86.5232 ] , [ 7 , 0 , 76.769071875 ] , [ 7 , 1 , 75.61228988726954 ] , [ 7 , 2 , 74.56835686375 ] , [ 7 , 3 , 73.74219509090625 ] , [ 7 , 4 , 73.223470242 ] , [ 7 , 5 , 73.08077093505861 ] , [ 7 , 6 , 73.357375684125 ] , [ 7 , 7 , 74.06860724378906 ] , [ 7 , 8 , 75.20077434699999 ] , [ 7 , 9 , 76.71170083616016 ] , [ 7 , 10 , 78.53284218750001 ] , [ 7 , 11 , 80.57298942873437 ] , [ 7 , 12 , 82.72356045 ] , [ 7 , 13 , 84.86547870807422 ] , [ 7 , 14 , 86.877639323875 ] , [ 7 , 15 , 88.64696257324218 ] , [ 7 , 16 , 90.080034771 ] , [ 7 , 17 , 91.11633654830075 ] , [ 7 , 18 , 91.74305852324999 ] , [ 7 , 19 , 92.01150436481247 ] , [ 7 , 20 , 92.05508124999999 ] , [ 8 , 0 ,
"name" : "visual-map-heatmap" ,
"title" : "热力图颜色线性映射" ,
"title-en" : "Heatmap - Linear Map"
}
]
} ,
"visualMap-piecewise" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><strong>分段型视觉映射组件（ ） （ ） ） ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\n// https://echarts.apache.org/examples/zh/editor.html?c=heatmap-large\noption = {\"tooltip\":{},\"xAxis\":{\"type\":\"category\",\"data\":[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20]},\"yAxis\":{\"type\":\"category\",\"data\":[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19]},\"visualMap\":{\"type\":\"piecewise\",\"splitNumber\": 8,\"min\":0,\"max\":100,\"calculable\":true,\"realtime\":false,\"inRange\":{\"color\":[\"#313695\",\"#4575b4\",\"#74add1\",\"#abd9e9\",\"#e0f3f8\",\"#ffffbf\",\"#fee090\",\"#fdae61\",\"#f46d43\",\"#d73027\",\"#a50026\"]}},\"series\":[{\"name\":\"Gaussian\",\"type\":\"heatmap\",\"data\" : [ [ 0 , 0 , 50 ] , [ 0 , 1 , 50 ] , [ 0 , 2 , 50 ] , [ 0 , 3 , 50 ] , [ 0 , 4 , 50 ] , [ 0 , 5 , 50 ] , [ 0 , 6 , 50 ] , [ 0 , 7 , 50 ] , [ 0 , 8 , 50 ] , [ 0 , 9 , 50 ] , [ 0 , 10 , 50 ] , [ 0 , 11 , 50 ] , [ 0 , 12 , 50 ] , [ 0 , 13 , 50 ] , [ 0 , 14 , 50 ] , [ 0 , 15 , 50 ] , [ 0 , 16 , 50 ] , [ 0 , 17 , 50 ] , [ 0 , 18 , 50 ] , [ 0 , 19 , 50 ] , [ 0 , 20 , 50 ] , [ 1 , 0 , 54.994209375000004 ] , [ 1 , 1 , 54.98855287535156 ] , [ 1 , 2 , 54.983669047750006 ] , [ 1 , 3 , 54.980227686550776 ] , [ 1 , 4 , 54.978760914000006 ] , [ 1 , 5 , 54.97964233398438 ] , [ 1 , 6 , 54.983074003125 ] , [ 1 , 7 , 54.98908121921484 ] , [ 1 , 8 , 54.997515127 ] , [ 1 , 9 , 55.00806314130469 ] , [ 1 , 10 , 55.020267187500004 ] , [ 1 , 11 , 55.0335497593164 ] , [ 1 , 12 , 55.047247794 ] , [ 1 , 13 , 55.0606543648125 ] , [ 1 , 14 , 55.073068190875 ] , [ 1 , 15 , 55.08385096435546 ] , [ 1 , 16 , 55.092492495 ] , [ 1 , 17 , 55.09868367200781 ] , [ 1 , 18 , 55.10239724325 ] , [ 1 , 19 , 55.103976411832036 ] , [ 1 , 20 , 55.104231250000005 ] , [ 2 , 0 , 59.9144 ] , [ 2 , 1 , 59.87254178725 ] , [ 2 , 2 , 59.83612736 ] , [ 2 , 3 , 59.80991875325 ] , [ 2 , 4 , 59.797737472 ] , [ 2 , 5 , 59.80230078125 ] , [ 2 , 6 , 59.825115776000004 ] , [ 2 , 7 , 59.866431231250004 ] , [ 2 , 8 , 59.925247232000004 ] , [ 2 , 9 , 59.999382583250004 ] , [ 2 , 10 , 60.08560000000001 ] , [ 2 , 11 , 60.17978907725 ] , [ 2 , 12 , 60.27720704 ] , [ 2 , 13 , 60.37277727325 ] , [ 2 , 14 , 60.461445632 ] , [ 2 , 15 , 60.53859453125 ] , [ 2 , 16 , 60.60051481600001 ] , [ 2 , 17 , 60.64493541125 ] , [ 2 , 18 , 60.67161075200001 ] , [ 2 , 19 , 60.68296599325001 ] , [ 2 , 20 , 60.6848 ] , [ 3 , 0 , 64.60082187500001 ] , [ 3 , 1 , 64.4705362889961 ] , [ 3 , 2 , 64.35634390175 ] , [ 3 , 3 , 64.27246293910156 ] , [ 3 , 4 , 64.230427154 ] , [ 3 , 5 , 64.23854693603516 ] , [ 3 , 6 , 64.301550051125 ] , [ 3 , 7 , 64.42040201135937 ] , [ 3 , 8 , 64.592306075 ] , [ 3 , 9 , 64.81088287663673 ] , [ 3 , 10 , 65.0665296875 ] , [ 3 , 11 , 65.34695930592969 ] , [ 3 , 12 , 65.637918578 ] , [ 3 , 13 , 65.92408654830078 ] , [ 3 , 14 , 66.190152240875 ] , [ 3 , 15 , 66.4220720703125 ] , [ 3 , 16 , 66.60850688299999 ] , [ 3 , 17 , 66.74243862852734 ] , [ 3 , 18 , 66.82296666124999 ] , [ 3 , 19 , 66.85728367200781 ] , [ 3 , 20 , 66.86283125 ] , [ 4 , 0 , 68.8416 ] , [ 4 , 1 , 68.557701681 ] , [ 4 , 2 , 68.30702156800001 ] , [ 4 , 3 , 68.11922918100001 ] , [ 4 , 4 , 68.01867264 ] , [ 4 , 5 , 68.023140625 ] , [ 4 , 6 , 68.143015296 ] , [ 4 , 7 , 68.380816173 ] , [ 4 , 8 , 68.731134976 ] , [ 4 , 9 , 69.180961425 ] , [ 4 , 10 , 69.7104 ] , [ 4 , 11 , 70.29377766100001 ] , [ 4 , 12 , 70.90114252800001 ] , [ 4 , 13 , 71.50015352100002 ] , [ 4 , 14 , 72.05836096 ] , [ 4 , 15 , 72.545878125 ] , [ 4 , 16 , 72.938443776 ] , [ 4 , 17 , 73.22087563299999 ] , [ 4 , 18 , 73.39091481599999 ] , [ 4 , 19 , 73.46346124499999 ] , [ 4 , 20 , 73.4752 ] , [ 5 , 0 , 72.412109375 ] , [ 5 , 1 , 71.90412197265626 ] , [ 5 , 2 , 71.45227109375 ] , [ 5 , 3 , 71.10730203857422 ] , [ 5 , 4 , 70.91138125 ] , [ 5 , 5 , 70.89576721191406 ] , [ 5 , 6 , 71.07918007812499 ] , [ 5 , 7 , 71.46687003173828 ] , [ 5 , 8 , 72.050384375 ] , [ 5 , 9 , 72.80803334960937 ] , [ 5 , 10 , 73.7060546875 ] , [ 5 , 11 , 74.70047689208985 ] , [ 5 , 12 , 75.73968125 ] , [ 5 , 13 , 76.76766257324219 ] , [ 5 , 14 , 77.72798867187501 ] , [ 5 , 15 , 78.5684585571289 ] , [ 5 , 16 , 79.246459375 ] , [ 5 , 17 , 79.73502207031248 ] , [ 5 , 18 , 80.02957578124999 ] , [ 5 , 19 , 80.15540096435545 ] , [ 5 , 20 , 80.17578125 ] , [ 6 , 0 , 75.10759999999999 ] , [ 6 , 1 , 74.306365026875 ] , [ 6 , 2 , 73.588477184 ] , [ 6 , 3 , 73.030288488875 ] , [ 6 , 4 , 72.69610342399999 ] , [ 6 , 5 , 72.634326171875 ] , [ 6 , 6 , 72.87470864 ] , [ 6 , 7 , 73.426699275875 ] , [ 6 , 8 , 74.278892672 ] , [ 6 , 9 , 75.399579960875 ] , [ 6 , 10 , 76.7384 ] , [ 6 , 11 , 78.229091346875 ] , [ 6 , 12 , 79.79334502399999 ] , [ 6 , 13 , 81.345758073875 ] , [ 6 , 14 , 82.79988790399999 ] , [ 6 , 15 , 84.075407421875 ] , [ 6 , 16 , 85.10636096 ] , [ 6 , 17 , 85.85052099087498 ] , [ 6 , 18 , 86.299845632 ] , [ 6 , 19 , 86.49203694087497 ] , [ 6 , 20 , 86.5232 ] , [ 7 , 0 , 76.769071875 ] , [ 7 , 1 , 75.61228988726954 ] , [ 7 , 2 , 74.56835686375 ] , [ 7 , 3 , 73.74219509090625 ] , [ 7 , 4 , 73.223470242 ] , [ 7 , 5 , 73.08077093505861 ] , [ 7 , 6 , 73.357375684125 ] , [ 7 , 7 , 74.06860724378906 ] , [ 7 , 8 , 75.20077434699999 ] , [ 7 , 9 , 76.71170083616016 ] , [ 7 , 10 , 78.53284218750001 ] , [ 7 , 11 , 80.57298942873437 ] , [ 7 , 12 , 82.72356045 ] , [ 7 , 13 , 84.86547870807422 ] , [ 7 , 14 , 86.877639323875 ] , [ 7 , 15 , 88.64696257324218 ] , [ 7 , 16 , 90.080034771 ] , [ 7 , 17 , 91.11633654830075 ] , [ 7 , 18 , 91.74305852324999 ] , [ 7 , 19 , 92.0115
"name" : "visual-map-heatmap" ,
"title" : "热力图颜色分段映射" ,
"title-en" : "Heatmap - Step Map"
}
]
} ,
"tooltip" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p>提示框组件。</p>\n<hr>\n<p><strong>提示框组件的通用介绍：</strong></p>\n<p>提示框组件可以设置在多种地方：</p>\n<ul>\n<li><p>可以设置在全局，即 <a href=\"#tooltip\">tooltip</a></p>\n</li>\n<li><p>可以设置在坐标系中，即 <a href=\"#grid.tooltip\">grid.tooltip</a>、<a href=\"#polar.tooltip\">polar.tooltip</a>、<a href=\"#single.tooltip\">single.tooltip</a></p>\n</li>\n<li><p>可以设置在系列中，即 <a href=\"#series.tooltip\">series.tooltip</a></p>\n</li>\n<li><p>可以设置在系列的每个数据项中，即 <a href=\"#series.data.tooltip\">series.data.tooltip</a></p>\n</li>\n</ul>\n<hr>\n\n\n\n" ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
2020-12-17 19:56:53 +08:00
"code" : "\nvar base = +new Date(2016, 9, 3);\nvar oneDay = 24 * 3600 * 1000;\nvar valueBase = Math.random() * 300;\nvar valueBase2 = Math.random() * 50;\nvar data = [];\nvar data2 = [];\n\nfor (var i = 1; i < 10; i++) {\n var now = new Date(base += oneDay);\n var dayStr = [now.getFullYear(), now.getMonth() + 1, now.getDate()].join('-');\n\n valueBase = Math.round((Math.random() - 0.5) * 20 + valueBase);\n valueBase <= 0 && (valueBase = Math.random() * 300);\n data.push([dayStr, valueBase]);\n\n valueBase2 = Math.round((Math.random() - 0.5) * 20 + valueBase2);\n valueBase2 <= 0 && (valueBase2 = Math.random() * 50);\n data2.push([dayStr, valueBase2]);\n}\n\nconst option = {\n legend: {\n top: 'bottom',\n data: ['意向']\n },\n tooltip: {\n triggerOn: 'none',\n alwaysShowContent: true,\n position: function (pt) {\n return [pt[0], 130];\n }\n },\n xAxis: {\n type: 'time',\n // boundaryGap: [0, 0],\n axisPointer: {\n value: '2016-10-7',\n snap: true,\n label: {\n show: true,\n formatter: function (params) {\n return echarts.format.formatTime('yyyy-MM-dd', params.value);\n }\n },\n handle: {\n show: true\n }\n },\n splitLine: {\n show: false\n }\n },\n yAxis: {\n type: 'value',\n axisTick: {\n inside: true\n },\n splitLine: {\n show: false\n },\n axisLabel: {\n inside: true\n },\n z: 10\n },\n grid: {\n top: 110,\n left: 15,\n right: 15,\n height: 160\n },\n series: [\n {\n name: '模拟数据',\n type: 'line',\n smooth: true,\n symbol: 'circle',\n symbolSize: 5,\n sampling: 'lttb',\n itemStyle: {\n color: '#8ec6ad'\n },\n stack: 'a',\n areaStyle: {\n },\n data: data\n },\n {\n name: '模拟数据',\n type: 'line',\n smooth: true,\n stack: 'a',\n symbol: 'circle',\n symbolSize: 5,\n sampling: 'lttb',\n itemStyle: {\n color: '#d68262'\n },\n areaStyle: {\n },\n data: data2\n }\n\n ]\n};\n" ,
2020-11-01 00:26:47 +08:00
"name" : "tooltip" ,
"title" : "提示框" ,
"title-en" : "Tooltip"
}
]
} ,
"axisPointer" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p>这是坐标轴指示器（ ） ， ： ， ， ： （ > & # 39 ; n o n e & # 39 ; < / c o d e > （ 于 是 效 果 为 ： 手 指 按 住 按 钮 则 显 示 t o o l t i p ， 松
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
2020-12-17 19:56:53 +08:00
"code" : "\nvar base = +new Date(2016, 9, 3);\nvar oneDay = 24 * 3600 * 1000;\nvar valueBase = Math.random() * 300;\nvar valueBase2 = Math.random() * 50;\nvar data = [];\nvar data2 = [];\n\nfor (var i = 1; i < 10; i++) {\n var now = new Date(base += oneDay);\n var dayStr = [now.getFullYear(), now.getMonth() + 1, now.getDate()].join('-');\n\n valueBase = Math.round((Math.random() - 0.5) * 20 + valueBase);\n valueBase <= 0 && (valueBase = Math.random() * 300);\n data.push([dayStr, valueBase]);\n\n valueBase2 = Math.round((Math.random() - 0.5) * 20 + valueBase2);\n valueBase2 <= 0 && (valueBase2 = Math.random() * 50);\n data2.push([dayStr, valueBase2]);\n}\n\noption = {\n legend: {\n top: 'bottom',\n data: ['意向']\n },\n tooltip: {\n triggerOn: 'none',\n position: function (pt) {\n return [pt[0], 130];\n }\n },\n xAxis: {\n type: 'time',\n // boundaryGap: [0, 0],\n axisPointer: {\n value: '2016-10-7',\n snap: true,\n label: {\n show: true,\n formatter: function (params) {\n return echarts.format.formatTime('yyyy-MM-dd', params.value);\n }\n },\n handle: {\n show: true\n }\n },\n splitLine: {\n show: false\n }\n },\n yAxis: {\n type: 'value',\n axisTick: {\n inside: true\n },\n splitLine: {\n show: false\n },\n axisLabel: {\n inside: true,\n formatter: '{value}\\n'\n },\n z: 10\n },\n grid: {\n top: 110,\n left: 15,\n right: 15,\n height: 160\n },\n series: [\n {\n name: '模拟数据',\n type: 'line',\n smooth: true,\n symbol: 'circle',\n symbolSize: 5,\n sampling: 'lttb',\n itemStyle: {\n color: '#8ec6ad'\n },\n stack: 'a',\n areaStyle: {\n },\n data: data\n },\n {\n name: '模拟数据',\n type: 'line',\n smooth: true,\n stack: 'a',\n symbol: 'circle',\n symbolSize: 5,\n sampling: 'lttb',\n itemStyle: {\n color: '#d68262'\n },\n areaStyle: {\n },\n data: data2\n }\n\n ]\n};\n\n" ,
2020-11-01 00:26:47 +08:00
"name" : "axis-pointer" ,
"title" : "坐标轴指示器" ,
"title-en" : "Axis Pointer"
}
]
} ,
"toolbox" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p>工具栏。内置有<a href=\"#toolbox.feature.saveAsImage\">导出图片</a>， ， ， ， ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\noption = {\n toolbox: {\n show: true,\n feature: {\n dataZoom: {\n yAxisIndex: 'none'\n },\n dataView: {readOnly: false},\n magicType: {type: ['line', 'bar']},\n restore: {},\n saveAsImage: {}\n }\n },\n xAxis: {\n type: 'category',\n boundaryGap: false,\n data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']\n },\n yAxis: {\n type: 'value',\n axisLabel: {\n formatter: '{value} °C'\n }\n },\n series: [\n {\n name: '最高气温',\n type: 'line',\n data: [11, 11, 15, 13, 12, 13, 10],\n markPoint: {\n data: [\n {type: 'max', name: 'Max'},\n {type: 'min', name: 'Min'}\n ]\n },\n markLine: {\n data: [\n {type: 'average', name: 'Avg'}\n ]\n }\n },\n {\n name: '最低气温',\n type: 'line',\n data: [1, -2, 2, 5, 3, 2, 0],\n markPoint: {\n data: [\n {name: '周最低', value: -2, xAxis: 1, yAxis: -1.5}\n ]\n },\n markLine: {\n data: [\n {type: 'average', name: 'Avg'},\n [{\n symbol: 'none',\n x: '90%',\n yAxis: 'max'\n }, {\n symbol: 'circle',\n label: {\n position: 'start',\n formatter: 'Max'\n },\n type: 'max',\n name: 'Top'\n }]\n ]\n }\n }\n ]\n};\n" ,
"title" : "工具栏" ,
"title-en" : "Toolbox"
}
]
} ,
"brush" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><code class=\"codespan\">brush</code> 是区域选择组件，用户可以选择图中一部分数据，从而便于向用户展示被选中数据，或者他们的一些统计计算结果。</p>\n<p><br></p>\n<hr>\n<p><strong>刷子的类型和启动按钮</strong></p>\n<p>目前 <code class=\"codespan\">brush</code> 组件支持的图表类型：<code class=\"codespan\">scatter</code>、<code class=\"codespan\">bar</code>、<code class=\"codespan\">candlestick</code>（ ， ， ， ， （ ） > o p t i o n = { \ n g e o : { \ n . . . \ n } , \ n b r u s h : { \ n g e o I n d e x : & # 3 9 ; a l l & # 3 9 ; , // 只可以在所有 geo 坐标系中刷选，也就是上面定义的 geo 组件中。\n ...\n }\n};\n</code></pre>\n<p>例如：</p>\n<pre><code cl
2020-11-01 00:26:47 +08:00
} ,
"geo" : {
"desc" : "<p>地理坐标系组件。</p>\n<p>地理坐标系组件用于地图的绘制，支持在地理坐标系上绘制<a href=\"#series-scatter\">散点图</a>，
} ,
"parallel" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><strong>平行坐标系介绍</strong></p>\n<p><a href=\"https://en.wikipedia.org/wiki/Parallel_coordinates\" target=\"_blank\">平行坐标系（ ） ， > p a r a l l e l < / a > 、 < a h r e f
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\nconst dataBJ = [\n [1,55,9,56,0.46,18,6,\"良\"],\n [2,25,11,21,0.65,34,9,\"优\"],\n [3,56,7,63,0.3,14,5,\"良\"],\n [4,33,7,29,0.33,16,6,\"优\"],\n [5,42,24,44,0.76,40,16,\"优\"],\n [6,82,58,90,1.77,68,33,\"良\"],\n [7,74,49,77,1.46,48,27,\"良\"],\n [8,78,55,80,1.29,59,29,\"良\"],\n [9,267,216,280,4.8,108,64,\"重度污染\"],\n [10,185,127,216,2.52,61,27,\"中度污染\"],\n [11,39,19,38,0.57,31,15,\"优\"],\n [12,41,11,40,0.43,21,7,\"优\"],\n [13,64,38,74,1.04,46,22,\"良\"],\n [14,108,79,120,1.7,75,41,\"轻度污染\"],\n [15,108,63,116,1.48,44,26,\"轻度污染\"],\n [16,33,6,29,0.34,13,5,\"优\"],\n [17,94,66,110,1.54,62,31,\"良\"],\n [18,186,142,192,3.88,93,79,\"中度污染\"],\n [19,57,31,54,0.96,32,14,\"良\"],\n [20,22,8,17,0.48,23,10,\"优\"],\n [21,39,15,36,0.61,29,13,\"优\"],\n [22,94,69,114,2.08,73,39,\"良\"],\n [23,99,73,110,2.43,76,48,\"良\"],\n [24,31,12,30,0.5,32,16,\"优\"],\n [25,42,27,43,1,53,22,\"优\"],\n [26,154,117,157,3.05,92,58,\"中度污染\"],\n [27,234,185,230,4.09,123,69,\"重度污染\"],\n [28,160,120,186,2.77,91,50,\"中度污染\"],\n [29,134,96,165,2.76,83,41,\"轻度污染\"],\n [30,52,24,60,1.03,50,21,\"良\"],\n [31,46,5,49,0.28,10,6,\"优\"]\n];\n\nconst dataGZ = [\n [1,26,37,27,1.163,27,13,\"优\"],\n [2,85,62,71,1.195,60,8,\"良\"],\n [3,78,38,74,1.363,37,7,\"良\"],\n [4,21,21,36,0.634,40,9,\"优\"],\n [5,41,42,46,0.915,81,13,\"优\"],\n [6,56,52,69,1.067,92,16,\"良\"],\n [7,64,30,28,0.924,51,2,\"良\"],\n [8,55,48,74,1.236,75,26,\"良\"],\n [9,76,85,113,1.237,114,27,\"良\"],\n [10,91,81,104,1.041,56,40,\"良\"],\n [11,84,39,60,0.964,25,11,\"良\"],\n [12,64,51,101,0.862,58,23,\"良\"],\n [13,70,69,120,1.198,65,36,\"良\"],\n [14,77,105,178,2.549,64,16,\"良\"],\n [15,109,68,87,0.996,74,29,\"轻度污染\"],\n [16,73,68,97,0.905,51,34,\"良\"],\n [17,54,27,47,0.592,53,12,\"良\"],\n [18,51,61,97,0.811,65,19,\"良\"],\n [19,91,71,121,1.374,43,18,\"良\"],\n [20,73,102,182,2.787,44,19,\"良\"],\n [21,73,50,76,0.717,31,20,\"良\"],\n [22,84,94,140,2.238,68,18,\"良\"],\n [23,93,77,104,1.165,53,7,\"良\"],\n [24,99,130,227,3.97,55,15,\"良\"],\n [25,146,84,139,1.094,40,17,\"轻度污染\"],\n [26,113,108,137,1.481,48,15,\"轻度污染\"],\n [27,81,48,62,1.619,26,3,\"良\"],\n [28,56,48,68,1.336,37,9,\"良\"],\n [29,82,92,174,3.29,0,13,\"良\"],\n [30,106,116,188,3.628,101,16,\"轻度污染\"],\n [31,118,50,0,1.383,76,11,\"轻度污染\"]\n];\n\nconst dataSH = [\n [1,91,45,125,0.82,34,23,\"良\"],\n [2,65,27,78,0.86,45,29,\"良\"],\n [3,83,60,84,1.09,73,27,\"良\"],\n [4,109,81,121,1.28,68,51,\"轻度污染\"],\n [5,106,77,114,1.07,55,51,\"轻度污染\"],\n [6,109,81,121,1.28,68,51,\"轻度污染\"],\n [7,106,77,114,1.07,55,51,\"轻度污染\"],\n [8,89,65,78,0.86,51,26,\"良\"],\n [9,53,33,47,0.64,50,17,\"良\"],\n [10,80,55,80,1.01,75,24,\"良\"],\n [11,117,81,124,1.03,45,24,\"轻度污染\"],\n [12,99,71,142,1.1,62,42,\"良\"],\n [13,95,69,130,1.28,74,50,\"良\"],\n [14,116,87,131,1.47,84,40,\"轻度污染\"],\n [15,108,80,121,1.3,85,37,\"轻度污染\"],\n [16,134,83,167,1.16,57,43,\"轻度污染\"],\n [17,79,43,107,1.05,59,37,\"良\"],\n [18,71,46,89,0.86,64,25,\"良\"],\n [19,97,71,113,1.17,88,31,\"良\"],\n [20,84,57,91,0.85,55,31,\"良\"],\n [21,87,63,101,0.9,56,41,\"良\"],\n [22,104,77,119,1.09,73,48,\"轻度污染\"],\n [23,87,62,100,1,72,28,\"良\"],\n [24,168,128,172,1.49,97,56,\"中度污染\"],\n [25,65,45,51,0.74,39,17,\"良\"],\n [26,39,24,38,0.61,47,17,\"优\"],\n [27,39,24,39,0.59,50,19,\"优\"],\n [28,93,68,96,1.05,79,29,\"良\"],\n [29,188,143,197,1.66,99,51,\"中度污染\"],\n [30,174,131,174,1.55,108,50,\"中度污染\"],\n [31,187,143,201,1.39,89,53,\"中度污染\" ] \ n ] ; \ n \ n c o n s t s c h e m a = [ \ n { n a m e : ' d a t e ' , i n d e x : 0 , t e x t : ' 日 期 ' } , \ n { n a m e : '
"name" : "parallel" ,
"title" : "平行坐标" ,
"title-en" : "Parallel"
} ,
{
"code" : "\n\nvar geoCoordMap = {\n \"Amsterdam\": [4.895168,52.370216],\n \"Athens\": [-83.357567,33.951935],\n \"Auckland\": [174.763332,-36.84846],\n \"Bangkok\": [100.501765,13.756331],\n \"Barcelona\": [2.173403,41.385064],\n \"Beijing\": [116.407395,39.904211],\n \"Berlin\": [13.404954,52.520007],\n \"Bogotá\": [-74.072092,4.710989],\n \"Bratislava\": [17.107748,48.148596],\n \"Brussels\": [4.35171,50.85034],\n \"Budapest\": [19.040235,47.497912],\n \"Buenos Aires\": [-58.381559,-34.603684],\n \"Bucharest\": [26.102538,44.426767],\n \"Caracas\": [-66.903606,10.480594],\n \"Chicago\": [-87.629798,41.878114],\n \"Delhi\": [77.209021,28.613939],\n \"Doha\": [51.53104,25.285447],\n \"Dubai\": [55.270783,25.204849],\n \"Dublin\": [-6.26031,53.349805],\n \"Frankfurt\": [8.682127,50.110922],\n \"Geneva\": [6.143158,46.204391],\n \"Helsinki\": [24.938379,60.169856],\n \"Hong Kong\": [114.109497,22.396428],\n \"Istanbul\": [28.978359,41.008238],\n \"Jakarta\": [106.845599,-6.208763],\n \"Johannesburg\": [28.047305,-26.204103],\n \"Cairo\": [31.235712,30.04442],\n \"Kiev\": [30.5234,50.4501],\n \"Copenhagen\": [12.568337,55.676097],\n \"Kuala Lumpur\": [101.686855,3.139003],\n \"Lima\": [-77.042793,-12.046374],\n \"Lisbon\": [-9.139337,38.722252],\n \"Ljubljana\": [14.505751,46.056947],\n \"London\": [-0.127758,51.507351],\n \"Los Angeles\": [-118.243685,34.052234],\n \"Luxembourg\": [6.129583,49.815273],\n \"Lyon\": [4.835659,45.764043],\n \"Madrid\": [-3.70379,40.416775],\n \"Milan\": [9.185924,45.465422],\n \"Manama\": [50.58605,26.228516],\n \"Manila\": [120.984219,14.599512],\n \"Mexico City\": [-99.133208,19.432608],\n \"Miami\": [-80.19179,25.76168],\n \"Montreal\": [-73.567256,45.501689],\n \"Moscow\": [37.6173,55.755826],\n \"Mumbai\": [72.877656,19.075984],\n \"Munich\": [11.581981,48.135125],\n \"Nairobi\": [36.821946,-1.292066],\n \"New York\": [-74.005941,40.712784],\n \"Nicosia\": [33.382276,35.185566],\n \"Oslo\": [10.752245,59.913869],\n \"Paris\": [2.352222,48.856614],\n \"Prague\": [14.4378,50.075538],\n \"Riga\": [24.105186,56.949649],\n \"Rio de Janeiro\": [-43.172896,-22.906847],\n \"Rome\": [12.496366,41.902783],\n \"Santiago de Chile\": [-70.669265,-33.44889],\n \"São Paulo\": [-46.633309,-23.55052],\n \"Seoul\": [126.977969,37.566535],\n \"Shanghai\": [121.473701,31.230416],\n \"Singapore\": [103.819836,1.352083],\n \"Sofia\": [23.321868,42.697708],\n \"Stockholm\": [18.068581,59.329323],\n \"Sydney\": [151.209296,-33.86882],\n \"Taipei\": [121.565418,25.032969],\n \"Tallinn\": [24.753575,59.436961],\n \"Tel Aviv\": [34.781768,32.0853],\n \"Tokyo\": [139.691706,35.689487],\n \"Toronto\": [-79.383184,43.653226],\n \"Vilnius\": [25.279651,54.687156],\n \"Warsaw\": [21.012229,52.229676],\n \"Vienna\": [16.373819,48.208174],\n \"Zurich\": [8.541694,47.376887]\n};\n\nvar schema = [\n \"Cities\",\n \"Gross purchasing power\",\n \"Net purchasing power\",\n \"Prices (excl. rent)\",\n \"Prices (incl. rent)\",\n \"Gross wages\",\n \"Net wages\",\n \"Working time [hours per year]\",\n \"Vacation [paid working days per year]\",\n \"Time required for 1 Big Mac [minutes]\",\n \"Time required for 1 kg of bread [minutes]\",\n \"Time required for 1 kg of rice [minutes]\",\n \"Time required for 1 iPhone 4S, 16 GB [hours]\",\n \"City break\",\n \"Inflation 2006\",\n \"Inflation 2007\",\n \"Inflation 2008\",\n \"Inflation 2009\",\n \"Inflation 2010\",\n \"Inflation 2011\",\n \"Prices (incl. rent)\",\n \"Food basket\",\n \"Services\",\n \"Normal local rent medium [USD per month]\",\n \"Household appliances\",\n \"Bus or tram or underground\",\n \"Train\",\n \"Taxi [USD per 5 km trip]\",\n \"Medium-sized cars price\",\n \"Medium-sized cars tax\",\n \"Medium-sized cars gas\",\n \" R e s t a u r a n t [ U S D p e r d i n n
"name" : "parallel-large" ,
"title" : "大数据量平行坐标"
}
]
} ,
"parallelAxis" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p>这个组件是平行坐标系中的坐标轴。</p>\n<p><strong>平行坐标系介绍</strong></p>\n<p><a href=\"https://en.wikipedia.org/wiki/Parallel_coordinates\" target=\"_blank\">平行坐标系（ ） ， > o p t i o n = { \ n p a r a l l e l A x i s : [ // 这是一个个『坐标轴』的定义\n {dim: 0, name: schema[0].text}, // 每个『坐标轴』有个 'dim' 属性，表示坐标轴的维度号。\n {dim: 1, name: schema[1].text},\n {dim: 2, name: schema[2].text},\n {dim: 3, name: schema[3].text},\n {dim: 4, name: schema[4].text},\n {dim: 5, name: schema[5].text},\n {dim: 6, name: schema[6].text},\n {dim: 7, name: schema[7].text,\n type: 'category', // 坐标轴也可以支持类别型数据\n data: ['优', '良', '轻度污染', '中度污染', '重度污染', '严重污染']\n }\n ],\n parallel: { // 这是『坐标系』的定义\n left: '5%', // 平行坐标系的位置设置\n right: '13%',\n bottom: '10%',\n top: '20%',\n parallelAxisDefault: { // 『坐标轴』的公有属性可以配置在这里避免重复书写\n type: 'value',\n nameLocation: 'end',\n nameGap: 20\n }\n },\n series: [ // 这里三个系列共用一个平行坐标系\n {\n name: '北京',\n type: 'parallel', // 这个系列类型是 'parallel'\n data: [\n [1, 55, 9, 56, 0.46, 18, 6, '良'],\n [2, 25, 11, 21, 0.65, 34, 9, '优'],\n ...\n ]\n },\n {\n name: '上海',\n type: 'parallel',\n data: [\n [3, 56, 7, 63, 0.3, 14, 5, '良'],\n [4, 33, 7, 29, 0.33, 16, 6, '优'],\n ...\n ]\n },\n {\n name: '广州',\n type: 'parallel',\n data: [\n [4, 33, 7, 29, 0.33, 16, 6, '优'],\n [5, 42, 24, 44, 0.76, 40, 16, '优'],\n ...\n ]\n }\n ]\n};\n</code></pre>\n<p>需要涉及到<E58F8A> <E588B0>
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\nconst dataBJ = [\n [1,55,9,56,0.46,18,6,\"良\"],\n [2,25,11,21,0.65,34,9,\"优\"],\n [3,56,7,63,0.3,14,5,\"良\"],\n [4,33,7,29,0.33,16,6,\"优\"],\n [5,42,24,44,0.76,40,16,\"优\"],\n [6,82,58,90,1.77,68,33,\"良\"],\n [7,74,49,77,1.46,48,27,\"良\"],\n [8,78,55,80,1.29,59,29,\"良\"],\n [9,267,216,280,4.8,108,64,\"重度污染\"],\n [10,185,127,216,2.52,61,27,\"中度污染\"],\n [11,39,19,38,0.57,31,15,\"优\"],\n [12,41,11,40,0.43,21,7,\"优\"],\n [13,64,38,74,1.04,46,22,\"良\"],\n [14,108,79,120,1.7,75,41,\"轻度污染\"],\n [15,108,63,116,1.48,44,26,\"轻度污染\"],\n [16,33,6,29,0.34,13,5,\"优\"],\n [17,94,66,110,1.54,62,31,\"良\"],\n [18,186,142,192,3.88,93,79,\"中度污染\"],\n [19,57,31,54,0.96,32,14,\"良\"],\n [20,22,8,17,0.48,23,10,\"优\"],\n [21,39,15,36,0.61,29,13,\"优\"],\n [22,94,69,114,2.08,73,39,\"良\"],\n [23,99,73,110,2.43,76,48,\"良\"],\n [24,31,12,30,0.5,32,16,\"优\"],\n [25,42,27,43,1,53,22,\"优\"],\n [26,154,117,157,3.05,92,58,\"中度污染\"],\n [27,234,185,230,4.09,123,69,\"重度污染\"],\n [28,160,120,186,2.77,91,50,\"中度污染\"],\n [29,134,96,165,2.76,83,41,\"轻度污染\"],\n [30,52,24,60,1.03,50,21,\"良\"],\n [31,46,5,49,0.28,10,6,\"优\"]\n];\n\nconst dataGZ = [\n [1,26,37,27,1.163,27,13,\"优\"],\n [2,85,62,71,1.195,60,8,\"良\"],\n [3,78,38,74,1.363,37,7,\"良\"],\n [4,21,21,36,0.634,40,9,\"优\"],\n [5,41,42,46,0.915,81,13,\"优\"],\n [6,56,52,69,1.067,92,16,\"良\"],\n [7,64,30,28,0.924,51,2,\"良\"],\n [8,55,48,74,1.236,75,26,\"良\"],\n [9,76,85,113,1.237,114,27,\"良\"],\n [10,91,81,104,1.041,56,40,\"良\"],\n [11,84,39,60,0.964,25,11,\"良\"],\n [12,64,51,101,0.862,58,23,\"良\"],\n [13,70,69,120,1.198,65,36,\"良\"],\n [14,77,105,178,2.549,64,16,\"良\"],\n [15,109,68,87,0.996,74,29,\"轻度污染\"],\n [16,73,68,97,0.905,51,34,\"良\"],\n [17,54,27,47,0.592,53,12,\"良\"],\n [18,51,61,97,0.811,65,19,\"良\"],\n [19,91,71,121,1.374,43,18,\"良\"],\n [20,73,102,182,2.787,44,19,\"良\"],\n [21,73,50,76,0.717,31,20,\"良\"],\n [22,84,94,140,2.238,68,18,\"良\"],\n [23,93,77,104,1.165,53,7,\"良\"],\n [24,99,130,227,3.97,55,15,\"良\"],\n [25,146,84,139,1.094,40,17,\"轻度污染\"],\n [26,113,108,137,1.481,48,15,\"轻度污染\"],\n [27,81,48,62,1.619,26,3,\"良\"],\n [28,56,48,68,1.336,37,9,\"良\"],\n [29,82,92,174,3.29,0,13,\"良\"],\n [30,106,116,188,3.628,101,16,\"轻度污染\"],\n [31,118,50,0,1.383,76,11,\"轻度污染\"]\n];\n\nconst dataSH = [\n [1,91,45,125,0.82,34,23,\"良\"],\n [2,65,27,78,0.86,45,29,\"良\"],\n [3,83,60,84,1.09,73,27,\"良\"],\n [4,109,81,121,1.28,68,51,\"轻度污染\"],\n [5,106,77,114,1.07,55,51,\"轻度污染\"],\n [6,109,81,121,1.28,68,51,\"轻度污染\"],\n [7,106,77,114,1.07,55,51,\"轻度污染\"],\n [8,89,65,78,0.86,51,26,\"良\"],\n [9,53,33,47,0.64,50,17,\"良\"],\n [10,80,55,80,1.01,75,24,\"良\"],\n [11,117,81,124,1.03,45,24,\"轻度污染\"],\n [12,99,71,142,1.1,62,42,\"良\"],\n [13,95,69,130,1.28,74,50,\"良\"],\n [14,116,87,131,1.47,84,40,\"轻度污染\"],\n [15,108,80,121,1.3,85,37,\"轻度污染\"],\n [16,134,83,167,1.16,57,43,\"轻度污染\"],\n [17,79,43,107,1.05,59,37,\"良\"],\n [18,71,46,89,0.86,64,25,\"良\"],\n [19,97,71,113,1.17,88,31,\"良\"],\n [20,84,57,91,0.85,55,31,\"良\"],\n [21,87,63,101,0.9,56,41,\"良\"],\n [22,104,77,119,1.09,73,48,\"轻度污染\"],\n [23,87,62,100,1,72,28,\"良\"],\n [24,168,128,172,1.49,97,56,\"中度污染\"],\n [25,65,45,51,0.74,39,17,\"良\"],\n [26,39,24,38,0.61,47,17,\"优\"],\n [27,39,24,39,0.59,50,19,\"优\"],\n [28,93,68,96,1.05,79,29,\"良\"],\n [29,188,143,197,1.66,99,51,\"中度污染\"],\n [30,174,131,174,1.55,108,50,\"中度污染\"],\n [31,187,143,201,1.39,89,53,\"中度污染\" ] \ n ] ; \ n \ n c o n s t s c h e m a = [ \ n { n a m e : ' d a t e ' , i n d e x : 0 , t e x t : ' 日 期 ' } , \ n { n a m e : '
"name" : "parallel-axis" ,
"title" : "平行坐标" ,
"title-en" : "Parallel"
}
]
} ,
"singleAxis" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p>单轴。可以被应用到散点图中展现一维数据，如下示例</p>\n<iframe data-src=\"http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=scatter-single-axis&edit=1&reset=1\" width=\"700\" height=\"500\"><iframe />\n\n\n\n"
2020-11-01 00:26:47 +08:00
} ,
"timeline" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><code class=\"codespan\">timeline</code> 组件，提供了在多个 ECharts <code class=\"codespan\">option</code> 间进行切换、播放等操作的功能。</p>\n<p>示例效果如下：</p>\n<iframe data-src=\"http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=doc-example/mix-timeline-all&edit=1&reset=1\" width=\"600\" height=\"400\"><iframe />\n\n\n<p><code class=\"codespan\">timeline</code> 和其他组件有些不同， ， ， ， > o p t i o n s < / c o d e > 列 表 ） <EFBFBD>
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : " \ n v a r d a t a M a p = { } ; \ n f u n c t i o n d a t a F o r m a t t e r ( o b j ) { \ n v a r p L i s t = [ ' 北 京 ' , ' 天 津 ' , ' 河 北 ' , ' 山 西 ' , ' 内 蒙 古 ' , ' 辽 宁 ' , ' 吉 林 ' , ' 黑 龙 江 ' , ' 上 海 ' , ' 江 苏 ' , ' 浙 江 ' , ' 安 徽 ' , ' 福 建 ' , ' 江 西 ' , ' 山 东 ' , ' 河 南 ' , ' 湖 北 ' , ' 湖 南 ' , ' 广 东 ' , ' 广 西 ' , ' 海 南 ' , ' 重 庆 ' , ' 四 川 ' , ' 贵 州 ' , ' 云 南 ' , ' 西 藏 ' , ' 陕 西 ' , ' 甘 肃 ' , ' 青 海 ' , ' 宁 夏 ' , ' 新 疆 ' ] ; \ n v a r t e m p ; \ n f o r ( v a r y e a r = 2 0 0 2 ; y e a r < = 2 0 1 1 ; y e a r + + ) { \ n v a r m a x = 0 ; \ n v a r s u m = 0 ; \ n t e m p = o b j [ y e a r ] ; \ n f o r ( v a r i = 0 , l = t e m p . l e n g t h ; i < l ; i + + ) { \ n m a x = M a t h . m a x ( m a x , t e m p [ i ] ) ; \ n s u m + = t e m p [ i ] ; \ n o b j [ y e a r ] [ i ] = { \ n n a m e : p L i s t [ i ] , \ n v a l u e : t e m p [ i ] \ n } \ n } \ n o b j [ y e a r + ' m a x ' ] = M a t h . f l o o r ( m a x / 100 ) * 100 ; \ n o b j [ y e a r + ' s u m ' ] = s u m ; \ n } \ n r e t u r n o b j ; \ n } \ n \ n d a t a M a p . d a t a G D P = d a t a F o r m a t t e r ( { \ n //max : 60000,\n 2011:[16251.93,11307.28,24515.76,11237.55,14359.88,22226.7,10568.83,12582,19195.69,49110.27,32318.85,15300.65,17560.18,11702.82,45361.85,26931.03,19632.26,19669.56,53210.28,11720.87,2522.66,10011.37,21026.68,5701.84,8893.12,605.83,12512.3,5020.37,1670.44,2102.21,6610.05],\n 2010:[14113.58,9224.46,20394.26,9200.86,11672,18457.27,8667.58,10368.6,17165.98,41425.48,27722.31,12359.33,14737.12,9451.26,39169.92,23092.36,15967.61,16037.96,46013.06,9569.85,2064.5,7925.58,17185.48,4602.16,7224.18,507.46,10123.48,4120.75,1350.43,1689.65,5437.47],\n 2009:[12153.03,7521.85,17235.48,7358.31,9740.25,15212.49,7278.75,8587,15046.45,34457.3,22990.35,10062.82,12236.53,7655.18,33896.65,19480.46,12961.1,13059.69,39482.56,7759.16,1654.21,6530.01,14151.28,3912.68,6169.75,441.36,8169.8,3387.56,1081.27,1353.31,4277.05],\n 2008:[11115,6719.01,16011.97,7315.4,8496.2,13668.58,6426.1,8314.37,14069.87,30981.98,21462.69,8851.66,10823.01,6971.05,30933.28,18018.53,11328.92,11555,36796.71,7021,1503.06,5793.66,12601.23,3561.56,5692.12,394.85,7314.58,3166.82,1018.62,1203.92,4183.21],\n 2007:[9846.81,5252.76,13607.32,6024.45,6423.18,11164.3,5284.69,7104,12494.01,26018.48,18753.73,7360.92,9248.53,5800.25,25776.91,15012.46,9333.4,9439.6,31777.01,5823.41,1254.17,4676.13,10562.39,2884.11,4772.52,341.43,5757.29,2703.98,797.35,919.11,3523.16],\n 2006:[8117.78,4462.74,11467.6,4878.61,4944.25,9304.52,4275.12,6211.8,10572.24,21742.05,15718.47,6112.5,7583.85,4820.53,21900.19,12362.79,7617.47,7688.67,26587.76,4746.16,1065.67,3907.23,8690.24,2338.98,3988.14,290.76,4743.61,2277.35,648.5,725.9,3045.26],\n 2005:[6969.52,3905.64,10012.11,4230.53,3905.03,8047.26,3620.27,5513.7,9247.66,18598.69,13417.68,5350.17,6554.69,4056.76,18366.87,10587.42,6590.19,6596.1,22557.37,3984.1,918.75,3467.72,7385.1,2005.42,3462.73,248.8,3933.72,1933.98,543.32,612.61,2604.19],\n 2004:[6033.21,3110.97,8477.63,3571.37,3041.07,6672,3122.01,4750.6,8072.83,15003.6,11648.7,4759.3,5763.35,3456.7,15021.84,8553.79,5633.24,5641.94,18864.62,3433.5,819.66,3034.58,6379.63,1677.8,3081.91,220.34,3175.58,1688.49,466.1,537.11,2209.09],\n 2003:[5007.21,2578.03,6921.29,2855.23,2388.38,6002.54,2662.08,4057.4,6694.23,12442.87,9705.02,3923.11,4983.67,2807.41,12078.15,6867.7,4757.45,4659.99,15844.64,2821.11,713.96,2555.72,5333.09,1426.34,2556.02,185.09,2587.72,1399.83,390.2,445.36,1886.35],\n 2002:[4315,2150.76,6018.28,2324.8,1940.94,5458.22,2348.54,3637.2,5741.03,10606.85,8003.67,3519.72,4467.55,2450.48,10275.5,6035.48,4212.82,4151.54,13502.42,2523.73,642.73,2232.86,4725.01,1243.43,2312.82,162.04,2253.39,1232.03,340.65,377.16,1612.6]\n});\n\ndataMap.dataPI = dataFormatter({\n //max : 4000,\n 2011:[136.27,159.72,2905.73,641.42,1306.3,1915.57,1277.44,1701.5,124.94,3064.78,1583.04,2015.31,1612.24,1391.07,3973.85,3512.24,2569.3,2768.03,2665.2,2047.23,659.23,844.52,2983.51,726.22,1411.01,74.47,1220.9,678.75,155.08,184.14,1139.03],\n 2010:[124.36,145.58,2562.81,554.48,1095.28,1631.08,1050.15,1302.9,114.15,2540.1,1360.56,1729.02,1363.67,1206.98,3588.28,3258.09,2147,2325.5,2286.98,1675.06,539.83,685.38,2482.89,625.03,1108.38,68.72,988.45,599.28,134.92,159.29,1078.
"name" : "timeline" ,
"title" : "时间轴" ,
"title-en" : "Timeline"
}
]
} ,
"graphic" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><code class=\"codespan\">graphic</code> 是原生图形元素组件。可以支持的图形元素包括：</p>\n<p><a href=\"#graphic.elements-image\">image</a>,\n<a href=\"#graphic.elements-text\">text</a>,\n<a href=\"#graphic.elements-circle\">circle</a>,\n<a href=\"#graphic.elements-sector\">sector</a>,\n<a href=\"#graphic.elements-ring\">ring</a>,\n<a href=\"#graphic.elements-polygon\">polygon</a>,\n<a href=\"#graphic.elements-polyline\">polyline</a>,\n<a href=\"#graphic.elements-rect\">rect</a>,\n<a href=\"#graphic.elements-line\">line</a>,\n<a href=\"#graphic.elements-bezierCurve\">bezierCurve</a>,\n<a href=\"#graphic.elements-arc\">arc</a>,\n<a href=\"#graphic.elements-group\">group</a>,</p>\n<p>下面示例中，使用图形元素做了水印，和文本块：</p>\n<iframe data-src=\"http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=line-graphic&edit=1&reset=1\" width=\"600\" height=\"400\"><iframe />\n\n\n<p>下面示例中，使用隐藏的图形元素实现了拖拽：</p>\n<iframe data-src=\"http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=line-draggable&edit=1&reset=1\" width=\"600\" height=\"400\"><iframe />\n\n\n\n\n<p><br></p>\n<hr>\n<p><strong>graphic 设置介绍</strong></p>\n<p>只配一个图形元素时的简写方法：</p>\n<pre><code class=\"lang-javascript\">myChart.setOption({\n ...,\n graphic: {\n type: 'image',\n ...\n }\n});\n</code></pre>\n<p>配多个图形元素：</p>\n<pre><code class=\"lang-javascript\">myChart.setOption({\n ...,\n graphic: [\n { // 一个图形元素，类型是 image。\n type: 'image',\n ...\n },\n { // 一个图形元素，类型是 text， ， ， ， ， ， ， > { \ n // id 用于在更新图形元素时指定更新哪个图形元素，如果不需要用可以忽略。\n id: 'xxx',\n\n // 这个字段在第一次设置时不能忽略，取值见上方『支持的图形元素』。\n type: 'image',\n\n // 下面的各个属性如果不需要设置都可以忽略，忽略则取默认值。\n\n // 指定本次 setOption 对此图形元素进行的操作。默认是 'merge'，还可以 'replace' 或 'remove'。\n $actio
2020-11-01 00:26:47 +08:00
} ,
"calendar" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p>日历坐标系组件。</p>\n<p>在ECharts中， ， ， ， ， ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\nfunction getVirtulData(year) {\n year = year || '2017';\n var date = +new Date(year + '-01-01');\n var end = +new Date((+year + 1) + '-01-01');\n var dayTime = 3600 * 24 * 1000;\n var data = [];\n for (var time = date; time < end; time += dayTime) {\n data.push([\n time,\n Math.floor(Math.random() * 10000)\n ]);\n }\n return data;\n}\n\nconst option = {\n tooltip: {},\n visualMap: {\n min: 0,\n max: 10000,\n type: 'piecewise',\n orient: 'horizontal',\n left: 'center',\n top: 65,\n textStyle: {\n color: '#000'\n }\n },\n calendar: {\n top: 120,\n left: 30,\n right: 30,\n cellSize: ['auto', 13],\n range: '2016',\n itemStyle: {\n borderWidth: 0.5\n },\n yearLabel: {show: false}\n },\n series: {\n type: 'heatmap',\n coordinateSystem: 'calendar',\n data: getVirtulData(2016)\n }\n};\n" ,
"name" : "calendar" ,
"title" : "日历图" ,
"title-en" : "Calendar"
}
]
} ,
"dataset" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p>ECharts 4 开始支持了 <code class=\"codespan\">数据集</code>（
2020-11-01 00:26:47 +08:00
} ,
"aria" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p>W3C 制定了无障碍富互联网应用规范集（<a href=\"https://www.w3.org/WAI/intro/aria\" target=\"_blank\">WAI-ARIA</a>， ） ， ， ， ， ，
2020-11-01 00:26:47 +08:00
} ,
"series-line" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><strong>折线/面积图</strong></p>\n<p>折线图是用折线将各个数据点<a href=\"#series-line.symbol\">标志</a>连接起来的图表，用于展现数据的变化趋势。可用于<a href=\"#grid\">直角坐标系</a>和<a href=\"#polar\">极坐标系</a>上。</p>\n<p><strong>Tip:</strong> 设置 <a href=\"#series-line.areaStyle\">areaStyle</a> 后可以绘制面积图。</p>\n<p><strong>Tip:</strong> 配合分段型 <a href=\"#visualMap-piecewise\">visualMap</a> 组件可以将折线/面积图通过不同颜色分区间。如下示例</p>\n<iframe data-src=\"http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=line-aqi&edit=1&reset=1\" width=\"600\" height=\"400\"><iframe />\n\n\n\n\n\n" ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\nconst option = {\n xAxis: {\n type: 'category',\n data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']\n },\n yAxis: {},\n series: [{\n data: [820, 932, 901, 934, 1290, 1330, 1320],\n type: 'line'\n }]\n};\n" ,
"name" : "cartesian-line" ,
"title" : "基础折线图" ,
"title-en" : "Basic Line Chart"
} ,
{
"code" : "\nconst option = {\n xAxis: {\n type: 'category',\n data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']\n },\n yAxis: {},\n series: [{\n data: [820, 932, 901, '-', 1290, 1330, 1320],\n type: 'line'\n }]\n};\n" ,
"name" : "cartesian-line-empty-data" ,
"title" : "有空数据的折线图" ,
"title-en" : "Line with Empty Data"
}
]
} ,
"series-bar" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><strong>柱状图</strong></p>\n<p>柱状图（或称条形图）是一种通过柱形的高度（横向的情况下则是宽度）来表现数据大小的一种常用图表类型。</p>\n\n\n\n\n\n" ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\nconst option = {\n tooltip: {},\n legend: {},\n xAxis: {\n data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']\n },\n yAxis: {},\n series: [{\n name: 'Sale',\n type: 'bar',\n data: [5, 20, 36, 10, 10, 20, 4]\n }]\n};\n" ,
"name" : "cartesian-bar" ,
"title" : "直角坐标系上的柱状图" ,
"title-en" : "Bar on Cartesian"
} ,
{
"code" : "\nconst option = {\n angleAxis: {\n max: 30\n },\n radiusAxis: {\n type: 'category',\n data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],\n z: 10\n },\n polar: {},\n series: [{\n name: 'Sale',\n type: 'bar',\n data: [5, 20, 36, 10, 10, 20, 4],\n coordinateSystem: 'polar'\n }],\n legend: {},\n};\n" ,
"name" : "polar-bar" ,
"title" : "极坐标系上的柱状图" ,
"title-en" : "Bar on Polar"
} ,
{
"code" : "\noption = {\n legend: {\n data: ['Food', 'Cloth', 'Book']\n },\n grid: {\n left: '3%',\n right: '4%',\n bottom: '3%',\n containLabel: true\n },\n xAxis: {\n type: 'category',\n data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']\n },\n yAxis: {\n type: 'value'\n },\n series: [\n {\n name: 'Food',\n type: 'bar',\n data: [320, 302, 301, 334, 390, 330, 320]\n },\n {\n name: 'Cloth',\n type: 'bar',\n data: [150, 212, 201, 154, 190, 330, 410]\n },\n {\n name: 'Book',\n type: 'bar',\n data: [820, 832, 901, 934, 1290, 1330, 1320]\n }\n ]\n};\n" ,
"name" : "cartesian-bar-multiple-series" ,
"title" : "多系列柱状图" ,
"title-en" : "Multiple Series"
}
]
} ,
"series-pie" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><strong>饼图</strong></p>\n<p>饼图主要用于表现不同类目的数据在总和中的占比。每个的弧度表示数据数量的比例。</p>\n<p>从 ECharts v4.6.0 版本起，我们提供了 <code class=\"codespan\">'labelLine'</code> 与 <code class=\"codespan\">'edge'</code> 两种新的布局方式。详情参见 <a href=\"#series-pie.label.alignTo\">label.alignTo</a>。</p>\n<iframe data-src=\"http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=pie-alignTo&reset=1&edit=1\" width=\"900\" height=\"250\"><iframe />\n\n\n<p>对于一个图表中有多个饼图的场景，可以使用 <a href=\"#series-pie.left\">left</a>、<a href=\"#series-pie.right\">right</a>、<a href=\"#series-pie.top\">top</a>、<a href=\"#series-pie.bottom\">bottom</a>、<a href=\"#series-pie.width\">width</a>、<a href=\"#series-pie.height\">height</a> 配置每个饼图系列的位置和视口大小。<a href=\"#series-pie.radius\">radius</a>、<a href=\"#series-pie.label.margin\">label.margin</a> 等支持百分比的配置项，是相对于该配置项决定的矩形的大小而言的。</p>\n<p><strong>Tip:</strong> 饼图更适合表现数据相对于总数的百分比等关系。如果只是表示不同类目数据间的大小，建议使用 <a href=\"bar\" target=\"_blank\">柱状图</a>，人们对于微小的弧度差别相比于微小的长度差别更不敏感，或者也可以通过配置 <a href=\"#series-pie.roseType\">roseType</a> 显示成南丁格尔图，通过半径大小区分数据的大小。</p>\n<p><strong>下面是自定义南丁格尔图的示例：</strong></p>\n<iframe data-src=\"http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=pie-custom&edit=1&reset=1\" width=\"500\" height=\"400\"><iframe />\n\n\n\n" ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\nconst option = {\n legend: {\n orient: 'vertical',\n left: 'left',\n data: ['Apple', 'Grapes', 'Pineapples', 'Oranges', 'Bananas']\n },\n series: [\n {\n type: 'pie',\n data: [\n {value: 335, name: 'Apple'},\n {value: 310, name: 'Grapes'},\n {value: 234, name: 'Pineapples'},\n {value: 135, name: 'Oranges'},\n {value: 1548, name: 'Bananas'}\n ]\n }\n ]\n};\n\n" ,
"name" : "pie" ,
"title" : "基础饼图" ,
"title-en" : "Basic Pie"
}
]
} ,
"series-scatter" : {
"desc" : "<p>散点（气泡）图。<a href=\"#grid\">直角坐标系</a>上的散点图可以用来展现数据的 <code class=\"codespan\">x</code>， ， ， ,
"exampleBaseOptions" : [
{
"code" : " \ n c o n s t o p t i o n = { \ n l e g e n d : { } , \ n g r i d : { \ n l e f t : ' 3 % ' , \ n r i g h t : ' 7 % ' , \ n b o t t o m : ' 3 % ' , \ n c o n t a i n L a b e l : t r u e \ n } , \ n x A x i s : { \ n t y p e : ' v a l u e ' , \ n s c a l e : t r u e , \ n a x i s L a b e l : { \ n f o r m a t t e r : ' { v a l u e } c m ' \ n } , \ n s p l i t L i n e : { \ n s h o w : f a l s e \ n } \ n } , \ n y A x i s : { \ n t y p e : ' v a l u e ' , \ n s c a l e : t r u e , \ n a x i s L a b e l : { \ n f o r m a t t e r : ' { v a l u e } k g ' \ n } , \ n s p l i t L i n e : { \ n s h o w : f a l s e \ n } \ n } , \ n s e r i e s : [ \ n { \ n n a m e : ' M a l e ' , \ n t y p e : ' s c a t t e r ' , \ n d a t a : [ [ 1 7 4 . 0 , 6 5 . 6 ] , [ 1 7 5 . 3 , 7 1 . 8 ] , [ 1 9 3 . 5 , 8 0 . 7 ] , [ 1 8 6 . 5 , 7 2 . 6 ] , [ 1 8 7 . 2 , 7 8 . 8 ] , [ 1 8 1 . 5 , 7 4 . 8 ] , [ 1 8 4 . 0 , 8 6 . 4 ] , [ 1 8 4 . 5 , 7 8 . 4 ] , [ 1 7 5 . 0 , 6 2 . 0 ] , [ 1 8 4 . 0 , 8 1 . 6 ] , [ 1 8 0 . 0 , 7 6 . 6 ] , [ 1 7 7 . 8 , 8 3 . 6 ] , [ 1 9 2 . 0 , 9 0 . 0 ] , [ 1 7 6 . 0 , 7 4 . 6 ] , [ 1 7 4 . 0 , 7 1 . 0 ] , [ 1 8 4 . 0 , 7 9 . 6 ] , [ 1 9 2 . 7 , 9 3 . 8 ] , [ 1 7 1 . 5 , 7 0 . 0 ] , [ 1 7 3 . 0 , 7 2 . 4 ] , [ 1 7 6 . 0 , 8 5 . 9 ] , [ 1 7 6 . 0 , 7 8 . 8 ] , [ 1 8 0 . 5 , 7 7 . 8 ] , [ 1 7 2 . 7 , 6 6 . 2 ] , [ 1 7 6 . 0 , 8 6 . 4 ] , [ 1 7 3 . 5 , 8 1 . 8 ] , [ 1 7 8 . 0 , 8 9 . 6 ] , [ 1 8 0 . 3 , 8 2 . 8 ] , [ 1 8 0 . 3 , 7 6 . 4 ] , [ 1 6 4 . 5 , 6 3 . 2 ] , [ 1 7 3 . 0 , 6 0 . 9 ] , [ 1 8 3 . 5 , 7 4 . 8 ] , [ 1 7 5 . 5 , 7 0 . 0 ] , [ 1 8 8 . 0 , 7 2 . 4 ] , [ 1 8 9 . 2 , 8 4 . 1 ] , [ 1 7 2 . 8 , 6 9 . 1 ] , [ 1 7 0 . 0 , 5 9 . 5 ] , [ 1 8 2 . 0 , 6 7 . 2 ] , [ 1 7 0 . 0 , 6 1 . 3 ] , [ 1 7 7 . 8 , 6 8 . 6 ] , [ 1 8 4 . 2 , 8 0 . 1 ] , [ 1 8 6 . 7 , 8 7 . 8 ] , [ 1 7 1 . 4 , 8 4 . 7 ] , [ 1 7 2 . 7 , 7 3 . 4 ] , [ 1 7 5 . 3 , 7 2 . 1 ] , [ 1 8 0 . 3 , 8 2 . 6 ] , [ 1 8 2 . 9 , 8 8 . 7 ] , [ 1 8 8 . 0 , 8 4 . 1 ] , [ 1 7 7 . 2 , 9 4 . 1 ] , [ 1 7 2 . 1 , 7 4 . 9 ] , [ 1 6 7 . 0 , 5 9 . 1 ] , [ 1 6 9 . 5 , 7 5 . 6 ] , [ 1 7 4 . 0 , 8 6 . 2 ] , [ 1 7 2 . 7 , 7 5 . 3 ] , [ 1 8 2 . 2 , 8 7 . 1 ] , [ 1 6 4 . 1 , 5 5 . 2 ] , [ 1 6 3 . 0 , 5 7 . 0 ] , [ 1 7 1 . 5 , 6 1 . 4 ] , [ 1 8 4 . 2 , 7 6 . 8 ] , [ 1 7 4 . 0 , 8 6 . 8 ] , [ 1 7 4 . 0 , 7 2 . 2 ] , [ 1 7 7 . 0 , 7 1 . 6 ] , [ 1 8 6 . 0 , 8 4 . 8 ] , [ 1 6 7 . 0 , 6 8 . 2 ] , [ 1 7 1 . 8 , 6 6 . 1 ] , [ 1 8 2 . 0 , 7 2 . 0 ] , [ 1 6 7 . 0 , 6 4 . 6 ] , [ 1 7 7 . 8 , 7 4 . 8 ] , [ 1 6 4 . 5 , 7 0 . 0 ] , [ 1 9 2 . 0 , 1 0 1 . 6 ] , [ 1 7 5 . 5 , 6 3 . 2 ] , [ 1 7 1 . 2 , 7 9 . 1 ] , [ 1 8 1 . 6 , 7 8 . 9 ] , [ 1 6 7 . 4 , 6 7 . 7 ] , [ 1 8 1 . 1 , 6 6 . 0 ] , [ 1 7 7 . 0 , 6 8 . 2 ] , [ 1 7 4 . 5 , 6 3 . 9 ] , [ 1 7 7 . 5 , 7 2 . 0 ] , [ 1 7 0 . 5 , 5 6 . 8 ] , [ 1 8 2 . 4 , 7 4 . 5 ] , [ 1 9 7 . 1 , 9 0 . 9 ] , [ 1 8 0 . 1 , 9 3 . 0 ] , [ 1 7 5 . 5 , 8 0 . 9 ] , [ 1 8 0 . 6 , 7 2 . 7 ] , [ 1 8 4 . 4 , 6 8 . 0 ] , [ 1 7 5 . 5 , 7 0 . 9 ] , [ 1 8 0 . 6 , 7 2 . 5 ] , [ 1 7 7 . 0 , 7 2 . 5 ] , [ 1 7 7 . 1 , 8 3 . 4 ] , [ 1 8 1 . 6 , 7 5 . 5 ] , [ 1 7 6 . 5 , 7 3 . 0 ] , [ 1 7 5 . 0 , 7 0 . 2 ] , [ 1 7 4 . 0 , 7 3 . 4 ] , [ 1 6 5 . 1 , 7 0 . 5 ] , [ 1 7 7 . 0 , 6 8 . 9 ] , [ 1 9 2 . 0 , 1 0 2 . 3 ] , [ 1 7 6 . 5 , 6 8 . 4 ] , [ 1 6 9 . 4 , 6 5 . 9 ] , [ 1 8 2 . 1 , 7 5 . 7 ] , [ 1 7 9 . 8 , 8 4 . 5 ] , [ 1 7 5 . 3 , 8 7 . 7 ] , [ 1 8 4 . 9 , 8 6 . 4 ] , [ 1 7 7 . 3 , 7 3 . 2 ] , [ 1 6 7 . 4 , 5 3 . 9 ] , [ 1 7 8 . 1 , 7 2 . 0 ] , [ 1 6 8 . 9 , 5 5 . 5 ] , [ 1 5 7 . 2 , 5 8 . 4 ] , [ 1 8 0 . 3 , 8 3 . 2 ] , [ 1 7 0 . 2 , 7 2 . 7 ] , [ 1 7 7 . 8 , 6 4 . 1 ] , [ 1 7 2 . 7 , 7 2 . 3 ] , [ 1 6 5 . 1 , 6 5 . 0 ] , [ 1 8 6 . 7 , 8 6 . 4 ] , [ 1 6 5 . 1 , 6 5 . 0 ] , [ 1 7 4 . 0 , 8 8 . 6 ] , [ 1 7 5 . 3 , 8 4 . 1 ] , [ 1 8 5 . 4 , 6 6 . 8 ] , [ 1 7 7 . 8 , 7 5 . 5 ] , [ 1 8 0 . 3 , 9 3 . 2 ] , [ 1 8 0 . 3 , 8 2 . 7 ] , [ 1 7 7 . 8 , 5 8 . 0 ] , [ 1 7 7 . 8 , 7 9 . 5 ] , [ 1 7 7 . 8 , 7 8 . 6 ] , [ 1 7 7 . 8 , 7 1 . 8 ] , [ 1 7 7 . 8 , 1 1 6 . 4 ] , [ 1 6 3 . 8 , 7 2 . 2 ] , [ 1 8 8 . 0 , 8 3 . 6 ] , [ 1 9 8 . 1 , 8 5 . 5 ] , [ 1 7 5 . 3 , 9 0 . 9 ] , [ 1 6 6 . 4 , 8 5 . 9 ] , [ 1 9 0 . 5 , 8 9 . 1 ] , [ 1 6 6 . 4 , 7 5 . 0 ] , [ 1 7 7 . 8 , 7 7 . 7 ] , [ 1 7 9 . 7 , 8 6 . 4 ] , [ 1 7 2 . 7 , 9 0 . 9 ] , [ 1 9 0 . 5 , 7 3 . 6 ] , [ 1 8 5 . 4 , 7 6 . 4 ] , [ 1 6 8 . 9 , 6 9 . 1 ] , [ 1 6 7 . 6 , 8 4 . 5 ] , [ 1 7 5 . 3 , 6 4 . 5 ] , [ 1 7 0 . 2 , 6 9 . 1 ] , [ 1 9 0 . 5 , 1 0 8 . 6 ] , [ 1 7 7 . 8 , 8 6 . 4 ] , [ 1 9 0 . 5 , 8 0 . 9 ] , [ 1 7 7 . 8 , 8 7 . 7 ] , [ 1 8 4 . 2 , 9 4 . 5 ] , [ 1 7 6 . 5 , 8 0 . 2 ] , [ 1 7 7 . 8 , 7 2 . 0 ] , [ 1 8 0 . 3 , 7 1 . 4 ] , [ 1 7 1 . 4 , 7 2 . 7 ] , [ 1 7 2 . 7 , 8 4 . 1 ] , [ 1 7 2 . 7 , 7 6 . 8 ] , [ 1 7 7 . 8 , 6 3 . 6 ] , [ 1 7 7 . 8 , 8 0 . 9 ] , [ 1 8 2 . 9 , 8 0 . 9 ] , [ 1 7 0 . 2 , 8 5 . 5 ] , [ 1 6 7 . 6 , 6 8 . 6 ] , [ 1 7 5 . 3 , 6 7 . 7 ] , [ 1 6 5 . 1 , 6 6 . 4 ] , [ 1 8 5 . 4 , 1 0 2 . 3 ] , [ 1 8 1 . 6 , 7 0 . 5 ] , [ 1 7 2 . 7 , 9 5 . 9 ] , [ 1 9 0 . 5 , 8 4 . 1 ] , [ 1 7 9 . 1 , 8 7 . 3 ] , [ 1 7 5 . 3 , 7 1 . 8 ] , [ 1 7 0 . 2 , 6 5 . 9 ] , [ 1 9 3 . 0 , 9 5 . 9 ] , [ 1 7 1 . 4 , 9 1 . 4 ] , [ 1 7 7 . 8 , 8 1 . 8 ] , [ 1 7 7 . 8 , 9 6 . 8 ] , [ 1 6 7 . 6 , 6 9 . 1 ] , [ 1 6 7 . 6 , 8 2 . 7 ] , [ 1 8 0 . 3 , 7 5 . 5 ] , [ 1 8 2 . 9 , 7 9 . 5 ] , [ 1 7 6 . 5 , 7 3 . 6 ] , [ 1 8 6 . 7 , 9 1 . 8 ] , [ 1 8 8 . 0 , 8 4 . 1 ] , [ 1 8 8 . 0 , 8 5 . 9 ] , [ 1 7 7 . 8 , 8 1 . 8 ] , [ 1 7 4 . 0 , 8 2 . 5 ] , [ 1 7 7 . 8 , 8 0 . 5 ] , [ 1 7 1 . 4 , 7 0 . 0 ] , [ 1 8 5 . 4 , 8 1 . 8 ] , [ 1 8 5 . 4 , 8 4 . 1 ] , [ 1 8 8 . 0 , 9 0 . 5 ] , [ 1 8 8 . 0 , 9 1 . 4 ] , [ 1 8 2 . 9 , 8 9 . 1 ] , [ 1 7 6 . 5 , 8 5 . 0 ] , [ 1 7 5 . 3 , 6 9 . 1 ] , [ 1 7 5 . 3 , 7 3 . 6 ] , [ 1 8 8 . 0 , 8 0 . 5 ] , [ 1 8 8 . 0 , 8 2 . 7 ] , [ 1 7 5 . 3 , 8 6 . 4 ] , [ 1 7 0 . 5 , 6 7 . 7 ] , [ 1 7 9 . 1 , 9 2 . 7 ] , [ 1 7 7 . 8 , 9 3 . 6 ] , [ 1 7 5 . 3 , 7 0 . 9 ] , [ 1 8 2 . 9 , 7 5 . 0 ] , [ 1 7 0 . 8 , 9 3 . 2 ] , [ 1 8 8 . 0 , 9 3 . 2 ] , [ 1 8 0 . 3 , 7 7 . 7 ] , [ 1 7 7 . 8 , 6 1 . 4 ] , [ 1 8 5 . 4 , 9 4 . 1 ] , [ 1 6 8 . 9 , 7 5 . 0 ] , [ 1 8 5 . 4 , 8 3 . 6 ] , [ 1 8 0 . 3 , 8 5 . 5 ] , [ 1 7 4 . 0 , 7 3 . 9 ] , [ 1 6 7 . 6 , 6 6 . 8 ] , [ 1 8 2 . 9 , 8 7 . 3 ] , [ 1 6 0 . 0 , 7 2 . 3 ] , [ 1 8 0 . 3 , 8 8 . 6 ] , [ 1 6 7 . 6 , 7 5 . 5 ] , [ 1 8 6 . 7 , 1 0 1 . 4 ] , [ 1 7 5 . 3 , 9 1 . 1 ] , [ 1 7 5 . 3 , 6 7 . 3 ] , [ 1 7 5 . 9 , 7 7 . 7 ] , [ 1 7 5 . 3 , 8 1 . 8 ] , [ 1 7 9 . 1 , 7 5 . 5 ] , [ 1 8 1 . 6 , 8 4 . 5 ] , [ 1 7 7 . 8 , 7 6 . 6 ] , [ 1 8 2 . 9 , 8 5 . 0 ] , [ 1 7 7 . 8 , 1 0 2 . 5 ] , [ 1 8 4 . 2 , 7 7 . 3 ] , [ 1 7 9 . 1 , 7 1 . 8 ] , [ 1 7 6 . 5 , 8 7 . 9 ] , [ 1 8 8 . 0 , 9 4 . 3 ] , [ 1 7 4 . 0 , 7 0 . 9 ] , [ 1 6 7 . 6 , 6 4 . 5 ] , [ 1 7 0 . 2 , 7 7 . 3 ] , [ 1 6 7 . 6 , 7 2 . 3 ] , [ 1 8 8 . 0 , 8 7 . 3 ] , [ 1 7 4 . 0 , 8 0 . 0 ] , [ 1 7 6
"name" : "scatter" ,
"title" : "基础散点图" ,
"title-en" : "Basic Scatter"
} ,
{
"code" : "\nconst option = {\n title: {\n text: '1990 与 2015 年各国家人均寿命与 GDP'\n },\n legend: {\n right: 10,\n data: ['1990', '2015']\n },\n xAxis: {},\n yAxis: {},\n series: [{\n name: '1990',\n type: 'scatter',\n data: [[28604,77,17096869,'Australia',1990],[31163,77.4,27662440,'Canada',1990],[1516,68,1154605773,'China',1990],[13670,74.7,10582082,'Cuba',1990],[28599,75,4986705,'Finland',1990],[29476,77.1,56943299,'France',1990],[31476,75.4,78958237,'Germany',1990],[28666,78.1,254830,'Iceland',1990],[1777,57.7,870601776,'India',1990],[29550,79.1,122249285,'Japan',1990],[2076,67.9,20194354,'North Korea',1990],[12087,72,42972254,'South Korea',1990],[24021,75.4,3397534,'New Zealand',1990],[43296,76.8,4240375,'Norway',1990],[10088,70.8,38195258,'Poland',1990],[19349,69.6,147568552,'Russia',1990],[10670,67.3,53994605,'Turkey',1990],[26424,75.7,57110117,'United Kingdom',1990],[37062,75.4,252847810,'United States',1990]],\n symbolSize: function (data) {\n return Math.sqrt(data[2]) / 5e2;\n }\n }, {\n name: '2015',\n data: [[44056,81.8,23968973,'Australia',2015],[43294,81.7,35939927,'Canada',2015],[13334,76.9,1376048943,'China',2015],[21291,78.5,11389562,'Cuba',2015],[38923,80.8,5503457,'Finland',2015],[37599,81.9,64395345,'France',2015],[44053,81.1,80688545,'Germany',2015],[42182,82.8,329425,'Iceland',2015],[5903,66.8,1311050527,'India',2015],[36162,83.5,126573481,'Japan',2015],[1390,71.4,25155317,'North Korea',2015],[34644,80.7,50293439,'South Korea',2015],[34186,80.6,4528526,'New Zealand',2015],[64304,81.6,5210967,'Norway',2015],[24787,77.3,38611794,'Poland',2015],[23038,73.13,143456918,'Russia',2015],[19360,76.5,78665830,'Turkey',2015],[38225,81.4,64715810,'United Kingdom',2015],[53354,79.1,321773631,'United States',2015]],\n type: 'scatter',\n symbolSize: function (data) {\n return Math.sqrt(data[2]) / 5e2;\n }\n }]\n};\n" ,
"name" : "scatter-bubble" ,
"title" : "气泡图"
}
]
} ,
"series-effectScatter" : {
"desc" : "<p>带有涟漪特效动画的散点（气泡）图。利用动画特效可以将某些想要突出的数据进行视觉突出。</p>\n<p><strong>Tip:</strong> ECharts 2.x 中在地图上通过 markPoint 实现地图特效在 ECharts 3 中建议通过地理坐标系上的 effectScatter 实现。</p>\n\n" ,
"exampleBaseOptions" : [
{
"code" : "\nconst option = {\n xAxis: {},\n yAxis: {\n scale: true\n },\n series: [{\n name: '1990',\n type: 'effectScatter',\n data: [[28604,77,17096869,'Australia',1990],[31163,77.4,27662440,'Canada',1990],[1516,68,1154605773,'China',1990],[13670,74.7,10582082,'Cuba',1990],[28599,75,4986705,'Finland',1990],[29476,77.1,56943299,'France',1990],[31476,75.4,78958237,'Germany',1990],[28666,78.1,254830,'Iceland',1990],[1777,57.7,870601776,'India',1990],[29550,79.1,122249285,'Japan',1990],[2076,67.9,20194354,'North Korea',1990],[12087,72,42972254,'South Korea',1990],[24021,75.4,3397534,'New Zealand',1990],[43296,76.8,4240375,'Norway',1990],[10088,70.8,38195258,'Poland',1990],[19349,69.6,147568552,'Russia',1990],[10670,67.3,53994605,'Turkey',1990],[26424,75.7,57110117,'United Kingdom',1990],[37062,75.4,252847810,'United States',1990]],\n symbolSize: function (data) {\n return Math.sqrt(data[2]) / 5e2;\n }\n }]\n};\n" ,
"name" : "effectScatter-bubble" ,
"title" : "特效气泡图" ,
"title-en" : "Bubble Chart with Effect"
}
]
} ,
"series-radar" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><strong>雷达图</strong></p>\n<p>雷达图主要用于表现多变量的数据，例如球员的各个属性分析。依赖 <a href=\"#radar\">radar</a> 组件。</p>\n<p>下面是 AQI 数据用雷达图表现的示例。</p>\n<iframe data-src=\"http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=radar-aqi&edit=1&reset=1\" width=\"600\" height=\"500\"><iframe />\n\n\n\n" ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\nconst option = {\n title: {\n text: '基础雷达图'\n },\n tooltip: {},\n legend: {\n data: ['Allocated Budget', 'Actual Spending']\n },\n radar: {\n indicator: [\n { name: 'sales', max: 6500},\n { name: 'Administration', max: 16000},\n { name: 'Information Techology', max: 30000},\n { name: 'Customer Support', max: 38000},\n { name: 'Development', max: 52000},\n { name: 'Marketing', max: 25000}\n ]\n },\n series: [{\n name: '预算 vs 开销（ ） ,
"name" : "radar" ,
"title" : "基础雷达图" ,
"title-en" : "Basic Radar"
}
]
} ,
"series-tree" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><strong>树图</strong></p>\n<p>树图主要用来可视化树形数据结构，是一种特殊的层次类型，具有唯一的根节点，左子树，和右子树。</p>\n<p><strong>注意：目前不支持在单个 series 中直接绘制森林，可以通过在一个 option 中配置多个 series 实现森林</strong></p>\n<p><strong>树图示例：</strong></p>\n<iframe data-src=\"http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=tree-vertical&edit=1&reset=1\" width=\"900\" height=\"780\"><iframe />\n\n\n<p><strong>多个 series 组合成森林示例：</strong></p>\n<iframe data-src=\"http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=tree-legend&edit=1&reset=1\" width=\"800\" height=\"680\"><iframe />\n\n\n\n\n" ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\nconst option = {\n series: [{\n type: 'tree',\n data: [{\n name: 'root',\n children: [{\n name: 'Child A',\n children: [{\n name: 'Leaf C'\n }, {\n name: 'Leaf D'\n }, {\n name: 'Leaf E'\n }, {\n name: 'Leaf F'\n }]\n }, {\n name: 'Child B',\n children: [{\n name: 'Leaf G'\n }, {\n name: 'Leaf H'\n }]\n }, {\n name: 'Child D'\n }, {\n name: 'Child F',\n children: [{\n name: 'Leaf J'\n }, {\n name: 'Leaf K'\n }]\n }]\n }],\n label: {\n position: 'right'\n }\n }]\n}\n" ,
"name" : "tree" ,
"title" : "基础树图" ,
"title-en" : "Basic Tree"
}
]
} ,
"series-treemap" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><a href=\"https://en.wikipedia.org/wiki/Treemapping\" target=\"_blank\">Treemap</a> 是一种常见的表达『层级数据』『树状数据』的可视化形式。它主要用面积的方式，便于突出展现出『树』的各层级中重要的节点。</p>\n<p><strong>示例：</strong></p>\n<iframe data-src=\"http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=treemap-obama&edit=1&reset=1\" width=\"700\" height=\"580\"><iframe />\n\n\n\n<p><strong>视觉映射：</strong></p>\n<p>treemap 首先是把数值映射到『面积』这种视觉元素上。</p>\n<p>此外，也支持对数据的其他维度进行视觉映射，例如映射到颜色、颜色明暗度上。</p>\n<p>关于视觉设置，详见 <a href=\"#series-treemap.levels\">series-treemap.levels</a>。</p>\n<p><strong>下钻（ ） ： ： （ ） ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\nconst data = [{\n name: 'Food',\n children: [{\n value: 3,\n name: 'Fruit',\n children: [{\n value: 1,\n name: 'Apple'\n }, {\n value: 2,\n name: 'Orange',\n children: [{\n name: 'Seville Orange',\n value: 1\n }, {\n name: 'Blood Orange',\n value: 1\n }]\n }]\n }, {\n value: 9,\n name: 'Meat',\n children: [{\n value: 6,\n name: 'Beaf',\n children: [{\n name: 'Sirloin',\n value: 1\n }, {\n name: 'Rib',\n value: 1\n }, {\n name: 'Chuck',\n value: 1\n }, {\n name: 'Shank',\n value: 1\n }]\n }, {\n value: 2,\n name: 'Chicken',\n children: [{\n name: 'Wings',\n value: 1\n }]\n }, {\n name: 'Breast',\n value: 1\n }]\n }]\n}, {\n value: 6,\n name: 'Drinks',\n children: [{\n value: 3,\n name: 'Wine',\n children: [{\n name: 'USA',\n value: 2\n }, {\n name: 'Europe',\n children: [{\n name: 'Germany',\n value: 1\n }]\n }]\n }, {\n name: 'Soft Drink',\n children: [{\n value: 3,\n name: 'Juice',\n children: [{\n name: 'Apple Juice',\n value: 1\n }, {\n name: 'Orange Juice',\n value: 2\n }]\n }]\n }]\n}, {\n value: 6,\n name: 'Fashion',\n children: [{\n name: 'Clothing',\n children: [{\n name: 'Shirts',\n value: 1\n }, {\n name: 'Jackets',\n value: 3,\n children: [{\n name: 'Men',\n value: 1\n }, {\n name: 'Woman',\n value: 1\n }]\n }, {\n value: 2,\n name: 'Coats',\n children: [{\n name: 'Men',\n value: 1\n }, {\n name: 'Woman',\n value: 1\n }]\n }]\n }]\n}, {\n name: 'Computers',\n children: [{\n name: 'Components',\n value: 4,\n children: [{\n name: 'Barebones',\n value: 1\n }, {\n value: 2,\n name: 'External',\n children: [{\n name: 'Hard Drives',\n value: 2\n }]\n }, {\n name: 'Monitors',\n value: 1\n }]\n }, {\n value: 3,\n name: 'Other',\n children: [{\n name: 'USB',\n value: 1,\n }, {\n name: 'Cases'\n }, {\n name: 'Sound Cards',\n value: 1\n }]\n }]\n}];\n\nconst option = {\n series: {\n type: 'treemap',\n data: data\n }\n};\n\n" ,
"name" : "treemap" ,
"title" : "基础矩形树图" ,
"title-en" : "Basic Treemap"
}
]
} ,
"series-sunburst" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><a href=\"https://en.wikipedia.org/wiki/Pie_chart#Ring_chart_/_Sunburst_chart_/_Multilevel_pie_chart\" target=\"_blank\">旭日图（ ） ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\nconst data = [{\n name: 'Food',\n children: [{\n value: 3,\n name: 'Fruit',\n children: [{\n value: 1,\n name: 'Apple'\n }, {\n value: 2,\n name: 'Orange',\n children: [{\n name: 'Seville Orange',\n value: 1\n }, {\n name: 'Blood Orange',\n value: 1\n }]\n }]\n }, {\n value: 9,\n name: 'Meat',\n children: [{\n value: 6,\n name: 'Beaf',\n children: [{\n name: 'Sirloin',\n value: 1\n }, {\n name: 'Rib',\n value: 1\n }, {\n name: 'Chuck',\n value: 1\n }, {\n name: 'Shank',\n value: 1\n }]\n }, {\n value: 2,\n name: 'Chicken',\n children: [{\n name: 'Wings',\n value: 1\n }]\n }, {\n name: 'Breast',\n value: 1\n }]\n }]\n}, {\n value: 6,\n name: 'Drinks',\n children: [{\n value: 3,\n name: 'Wine',\n children: [{\n name: 'USA',\n value: 2\n }, {\n name: 'Europe',\n children: [{\n name: 'Germany',\n value: 1\n }]\n }]\n }, {\n name: 'Soft Drink',\n children: [{\n value: 3,\n name: 'Juice',\n children: [{\n name: 'Apple Juice',\n value: 1\n }, {\n name: 'Orange Juice',\n value: 2\n }]\n }]\n }]\n}, {\n value: 6,\n name: 'Fashion',\n children: [{\n name: 'Clothing',\n children: [{\n name: 'Shirts',\n value: 1\n }, {\n name: 'Jackets',\n value: 3,\n children: [{\n name: 'Men',\n value: 1\n }, {\n name: 'Woman',\n value: 1\n }]\n }, {\n value: 2,\n name: 'Coats',\n children: [{\n name: 'Men',\n value: 1\n }, {\n name: 'Woman',\n value: 1\n }]\n }]\n }]\n}, {\n name: 'Computers',\n children: [{\n name: 'Components',\n value: 4,\n children: [{\n name: 'Barebones',\n value: 1\n }, {\n value: 2,\n name: 'External',\n children: [{\n name: 'Hard Drives',\n value: 2\n }]\n }, {\n name: 'Monitors',\n value: 1\n }]\n }, {\n value: 3,\n name: 'Other',\n children: [{\n name: 'USB',\n value: 1,\n }, {\n name: 'Cases'\n }, {\n name: 'Sound Cards',\n value: 1\n }]\n }]\n}];\n\nconst option = {\n series: {\n type: 'sunburst',\n data: data\n }\n};\n\n" ,
"name" : "sunburst" ,
"title" : "基础旭日图" ,
"title-en" : "Basic Sunburst"
}
]
} ,
"series-boxplot" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><a href=\"https://en.wikipedia.org/wiki/Box_plot\" target=\"_blank\">Boxplot</a> 中文可以称为『箱形图』、『盒须图』、『盒式图』、『盒状图』、『箱线图』，是一种用作显示一组数据分散情况资料的统计图。它能显示出一组数据的最大值、最小值、中位数、下四分位数及上四分位数。</p>\n<p><strong>示例如下：</strong></p>\n<iframe data-src=\"http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=boxplot-light-velocity&edit=1&reset=1\" width=\"600\" height=\"400\"><iframe />\n\n\n<p>也支持多个 <code class=\"codespan\">series</code> 在同一个坐标系中，参见 <a href=\"http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=boxplot-multi&edit=1&reset=1\" target=\"_blank\">例子</a>。</p>\n\n" ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\nconst option = {\n title: [{\n text: \"Michelson-Morley Experiment\",\n left: \"center\"\n }\n ],\n xAxis: {\n type: \"category\",\n data: [\"0\", \"1\", \"2\", \"3\", \"4\"],\n boundaryGap: true,\n nameGap: 30,\n splitArea: {\n show: false\n },\n axisLabel: {\n formatter: \"expr {value}\"\n },\n splitLine: {\n show: false\n },\n },\n yAxis: {\n type: \"value\",\n name: \"km/s minus 299,000\",\n splitArea: {\n show: true,\n },\n },\n series: [{\n name: \"boxplot\",\n type: \"boxplot\",\n data: [\n [655, 850, 940, 980, 1070],\n [760, 800, 845, 885, 960],\n [780, 840, 855, 880, 940],\n [720, 767.5, 815, 865, 920],\n [740, 807.5, 810, 870, 950],\n ]\n }]\n}\n" ,
"name" : "boxplot" ,
"title" : "盒须图" ,
"title-en" : "Boxplot"
}
]
} ,
"series-candlestick" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><a href=\"https://en.wikipedia.org/wiki/Candlestick_chart\" target=\"_blank\">Candlestick</a> 即我们常说的 <code class=\"codespan\">K线图</code>。</p>\n<p>在 ECharts3 中，同时支持 <code class=\"codespan\">'candlestick'</code> 和 <code class=\"codespan\">'k'</code>这两种 <code class=\"codespan\">'series.type'</code>（ ， （ ） ， （ ） ， ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : " \ n v a r u p C o l o r = ' # e c 0 0 0 0 ' ; \ n v a r u p B o r d e r C o l o r = ' # 8 A 0 0 0 0 ' ; \ n v a r d o w n C o l o r = ' # 0 0 d a 3 c ' ; \ n v a r d o w n B o r d e r C o l o r = ' # 0 0 8 F 28 ' ; \ n \ n \ n // 数据意义：开盘(open)，收盘(close)，最低(lowest)，最高(highest)\nvar data0 = splitData([\n ['2013/1/24', 2320.26,2320.26,2287.3,2362.94],\n ['2013/1/25', 2300,2291.3,2288.26,2308.38],\n ['2013/1/28', 2295.35,2346.5,2295.35,2346.92],\n ['2013/1/29', 2347.22,2358.98,2337.35,2363.8],\n ['2013/1/30', 2360.75,2382.48,2347.89,2383.76],\n ['2013/1/31', 2383.43,2385.42,2371.23,2391.82],\n ['2013/2/1', 2377.41,2419.02,2369.57,2421.15],\n ['2013/2/4', 2425.92,2428.15,2417.58,2440.38],\n ['2013/2/5', 2411,2433.13,2403.3,2437.42],\n ['2013/2/6', 2432.68,2434.48,2427.7,2441.73],\n ['2013/2/7', 2430.69,2418.53,2394.22,2433.89],\n ['2013/2/8', 2416.62,2432.4,2414.4,2443.03],\n ['2013/2/18', 2441.91,2421.56,2415.43,2444.8],\n ['2013/2/19', 2420.26,2382.91,2373.53,2427.07],\n ['2013/2/20', 2383.49,2397.18,2370.61,2397.94],\n ['2013/2/21', 2378.82,2325.95,2309.17,2378.82],\n ['2013/2/22', 2322.94,2314.16,2308.76,2330.88],\n ['2013/2/25', 2320.62,2325.82,2315.01,2338.78],\n ['2013/2/26', 2313.74,2293.34,2289.89,2340.71],\n ['2013/2/27', 2297.77,2313.22,2292.03,2324.63],\n ['2013/2/28', 2322.32,2365.59,2308.92,2366.16],\n ['2013/3/1', 2364.54,2359.51,2330.86,2369.65],\n ['2013/3/4', 2332.08,2273.4,2259.25,2333.54],\n ['2013/3/5', 2274.81,2326.31,2270.1,2328.14],\n ['2013/3/6', 2333.61,2347.18,2321.6,2351.44],\n ['2013/3/7', 2340.44,2324.29,2304.27,2352.02],\n ['2013/3/8', 2326.42,2318.61,2314.59,2333.67],\n ['2013/3/11', 2314.68,2310.59,2296.58,2320.96],\n ['2013/3/12', 2309.16,2286.6,2264.83,2333.29],\n ['2013/3/13', 2282.17,2263.97,2253.25,2286.33],\n ['2013/3/14', 2255.77,2270.28,2253.31,2276.22],\n ['2013/3/15', 2269.31,2278.4,2250,2312.08],\n ['2013/3/18', 2267.29,2240.02,2239.21,2276.05],\n ['2013/3/19', 2244.26,2257.43,2232.02,2261.31],\n ['2013/3/20', 2257.74,2317.37,2257.42,2317.86],\n ['2013/3/21', 2318.21,2324.24,2311.6,2330.81],\n ['2013/3/22', 2321.4,2328.28,2314.97,2332],\n ['2013/3/25', 2334.74,2326.72,2319.91,2344.89],\n ['2013/3/26', 2318.58,2297.67,2281.12,2319.99],\n ['2013/3/27', 2299.38,2301.26,2289,2323.48],\n ['2013/3/28', 2273.55,2236.3,2232.91,2273.55],\n ['2013/3/29', 2238.49,2236.62,2228.81,2246.87],\n ['2013/4/1', 2229.46,2234.4,2227.31,2243.95],\n ['2013/4/2', 2234.9,2227.74,2220.44,2253.42],\n ['2013/4/3', 2232.69,2225.29,2217.25,2241.34],\n ['2013/4/8', 2196.24,2211.59,2180.67,2212.59],\n ['2013/4/9', 2215.47,2225.77,2215.47,2234.73],\n ['2013/4/10', 2224.93,2226.13,2212.56,2233.04],\n ['2013/4/11', 2236.98,2219.55,2217.26,2242.48],\n ['2013/4/12', 2218.09,2206.78,2204.44,2226.26],\n ['2013/4/15', 2199.91,2181.94,2177.39,2204.99],\n ['2013/4/16', 2169.63,2194.85,2165.78,2196.43],\n ['2013/4/17', 2195.03,2193.8,2178.47,2197.51],\n ['2013/4/18', 2181.82,2197.6,2175.44,2206.03],\n ['2013/4/19', 2201.12,2244.64,2200.58,2250.11],\n ['2013/4/22', 2236.4,2242.17,2232.26,2245.12],\n ['2013/4/23', 2242.62,2184.54,2182.81,2242.62],\n ['2013/4/24', 2187.35,2218.32,2184.11,2226.12],\n ['2013/4/25', 2213.19,2199.31,2191.85,2224.63],\n ['2013/4/26', 2203.89,2177.91,2173.86,2210.58],\n ['2013/5/2', 2170.78,2174.12,2161.14,2179.65],\n ['2013/5/3', 2179.05,2205.5,2179.05,2222.81],\n ['2013/5/6', 2212.5,2231.17,2212.5,2236.07],\n ['2013/5/7', 2227.86,2235.57,2219.44,2240.26],\n ['2013/5/8', 2242.39,2246.3,2235.42,2255.21],\n ['2013/5/9', 2246.96,2232.97,2221.38,2247.86],\n ['2013/5/10', 2228.82,2246.83,2225.81,2247.67],\n ['2013/5/13', 2247.68,2241.92,2231.36,2250.85],\n ['2013/5/14', 2238.9,2217.01,2205.87,2239.93],\n ['2013/5/15', 2217.09,2224.8,2213.58,2225.19],\n ['2013/5/16', 2221.34,2251.81,2210.77,2252.87],\n ['2013/5/17', 2249.81,2282.87,2248.41,2288.09],\n ['2013/5/20', 2286.33,2299.99,2281.9,2309.39],\n ['2013/5/21', 2297.11,2305.11,2290.12,
"name" : "candlestick" ,
"title" : "K 线图" ,
"title-en" : "Candlestick"
}
]
} ,
"series-heatmap" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><strong>热力图</strong></p>\n<p>热力图主要通过颜色去表现数值的大小，必须要配合 <a href=\"#visualMap\">visualMap</a> 组件使用。</p>\n<p>可以应用在<a href=\"#grid\">直角坐标系</a>以及<a href=\"#geo\">地理坐标系</a>上，这两个坐标系上的表现形式相差很大，直角坐标系上必须要使用两个类目轴。</p>\n<p>下面是在直角坐标系上应用的例子：</p>\n<p><strong>直角坐标系：</strong></p>\n<iframe data-src=\"http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=heatmap-cartesian&edit=1&reset=1\" width=\"600\" height=\"400\"><iframe />\n\n\n\n" ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\nconst hours = ['12a', '1a', '2a', '3a', '4a', '5a', '6a',\n '7a', '8a', '9a','10a','11a',\n '12p', '1p', '2p', '3p', '4p', '5p',\n '6p', '7p', '8p', '9p', '10p', '11p'];\nconst days = ['Saturday', 'Friday', 'Thursday',\n 'Wednesday', 'Tuesday', 'Monday', 'Sunday'];\n\nconst data = [[0,0,5],[0,1,1],[0,2,0],[0,3,0],[0,4,0],[0,5,0],[0,6,0],[0,7,0],[0,8,0],[0,9,0],[0,10,0],[0,11,2],[0,12,4],[0,13,1],[0,14,1],[0,15,3],[0,16,4],[0,17,6],[0,18,4],[0,19,4],[0,20,3],[0,21,3],[0,22,2],[0,23,5],[1,0,7],[1,1,0],[1,2,0],[1,3,0],[1,4,0],[1,5,0],[1,6,0],[1,7,0],[1,8,0],[1,9,0],[1,10,5],[1,11,2],[1,12,2],[1,13,6],[1,14,9],[1,15,11],[1,16,6],[1,17,7],[1,18,8],[1,19,12],[1,20,5],[1,21,5],[1,22,7],[1,23,2],[2,0,1],[2,1,1],[2,2,0],[2,3,0],[2,4,0],[2,5,0],[2,6,0],[2,7,0],[2,8,0],[2,9,0],[2,10,3],[2,11,2],[2,12,1],[2,13,9],[2,14,8],[2,15,10],[2,16,6],[2,17,5],[2,18,5],[2,19,5],[2,20,7],[2,21,4],[2,22,2],[2,23,4],[3,0,7],[3,1,3],[3,2,0],[3,3,0],[3,4,0],[3,5,0],[3,6,0],[3,7,0],[3,8,1],[3,9,0],[3,10,5],[3,11,4],[3,12,7],[3,13,14],[3,14,13],[3,15,12],[3,16,9],[3,17,5],[3,18,5],[3,19,10],[3,20,6],[3,21,4],[3,22,4],[3,23,1],[4,0,1],[4,1,3],[4,2,0],[4,3,0],[4,4,0],[4,5,1],[4,6,0],[4,7,0],[4,8,0],[4,9,2],[4,10,4],[4,11,4],[4,12,2],[4,13,4],[4,14,4],[4,15,14],[4,16,12],[4,17,1],[4,18,8],[4,19,5],[4,20,3],[4,21,7],[4,22,3],[4,23,0],[5,0,2],[5,1,1],[5,2,0],[5,3,3],[5,4,0],[5,5,0],[5,6,0],[5,7,0],[5,8,2],[5,9,0],[5,10,4],[5,11,1],[5,12,5],[5,13,10],[5,14,5],[5,15,7],[5,16,11],[5,17,6],[5,18,0],[5,19,5],[5,20,3],[5,21,4],[5,22,2],[5,23,0],[6,0,1],[6,1,0],[6,2,0],[6,3,0],[6,4,0],[6,5,0],[6,6,0],[6,7,0],[6,8,0],[6,9,0],[6,10,1],[6,11,0],[6,12,2],[6,13,1],[6,14,3],[6,15,4],[6,16,0],[6,17,0],[6,18,0],[6,19,0],[6,20,1],[6,21,2],[6,22,2],[6,23,6]].map(function (item) {\n return [item[1], item[0], item[2] || '-'];\n});\n\noption = {\n tooltip: {\n position: 'top'\n },\n animation: false,\n grid: {\n height: '50%',\n top: '10%'\n },\n xAxis: {\n type: 'category',\n data: hours,\n splitArea: {\n show: true\n }\n },\n yAxis: {\n type: 'category',\n data: days,\n splitArea: {\n show: true\n }\n },\n visualMap: {\n min: 0,\n max: 10,\n calculable: true,\n orient: 'horizontal',\n left: 'center',\n bottom: '15%'\n },\n series: [{\n name: 'Punch Card',\n type: 'heatmap',\n data: data\n }]\n};\n" ,
"name" : "heatmap" ,
"title" : "直角坐标系热力图" ,
"title-en" : "Heatmap on Cartesian"
}
]
} ,
"series-map" : {
"desc" : "<p><strong>地图。</strong></p>\n<p>地图主要用于地理区域数据的可视化，配合 <a href=\"#visualMap\">visualMap</a> 组件用于展示不同区域的人口分布密度等数据。</p>\n<p>多个<a href=\"#series-map.map\">地图类型</a>相同的系列会在同一地图上显示，这时候使用第一个系列的配置项作为地图绘制的配置。</p>\n<p><strong>Tip: </strong>在 ECharts 3 中不再建议在地图类型的图表使用 <code class=\"codespan\">markLine</code> 和 <code class=\"codespan\">markPoint</code>。如果要实现点数据或者线数据的可视化，可以使用在<a href=\"#geo\">地理坐标系组件</a>上的<a href=\"#series-scatter\">散点图</a>和<a href=\"#series-lines\">线图</a>。</p>\n"
} ,
"series-parallel" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p>平行坐标系的系列。</p>\n<p><strong>平行坐标系介绍</strong></p>\n<p><a href=\"https://en.wikipedia.org/wiki/Parallel_coordinates\" target=\"_blank\">平行坐标系（ ） ， > o p t i o n = { \ n p a r a l l e l A x i s : [ // 这是一个个『坐标轴』的定义\n {dim: 0, name: schema[0].text}, // 每个『坐标轴』有个 'dim' 属性，表示坐标轴的维度号。\n {dim: 1, name: schema[1].text},\n {dim: 2, name: schema[2].text},\n {dim: 3, name: schema[3].text},\n {dim: 4, name: schema[4].text},\n {dim: 5, name: schema[5].text},\n {dim: 6, name: schema[6].text},\n {dim: 7, name: schema[7].text,\n type: 'category', // 坐标轴也可以支持类别型数据\n data: ['优', '良', '轻度污染', '中度污染', '重度污染', '严重污染']\n }\n ],\n parallel: { // 这是『坐标系』的定义\n left: '5%', // 平行坐标系的位置设置\n right: '13%',\n bottom: '10%',\n top: '20%',\n parallelAxisDefault: { // 『坐标轴』的公有属性可以配置在这里避免重复书写\n type: 'value',\n nameLocation: 'end',\n nameGap: 20\n }\n },\n series: [ // 这里三个系列共用一个平行坐标系\n {\n name: '北京',\n type: 'parallel', // 这个系列类型是 'parallel'\n data: [\n [1, 55, 9, 56, 0.46, 18, 6, '良'],\n [2, 25, 11, 21, 0.65, 34, 9, '优'],\n ...\n ]\n },\n {\n name: '上海',\n type: 'parallel',\n data: [\n [3, 56, 7, 63, 0.3, 14, 5, '良'],\n [4, 33, 7, 29, 0.33, 16, 6, '优'],\n ...\n ]\n },\n {\n name: '广州',\n type: 'parallel',\n data: [\n [4, 33, 7, 29, 0.33, 16, 6, '优'],\n [5, 42, 24, 44, 0.76, 40, 16, '优'],\n ...\n ]\n }\n ]\n};\n</code></pre>\n<p>需要涉及到三个组件：<a href=
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\nconst dataBJ = [\n [1,55,9,56,0.46,18,6,\"良\"],\n [2,25,11,21,0.65,34,9,\"优\"],\n [3,56,7,63,0.3,14,5,\"良\"],\n [4,33,7,29,0.33,16,6,\"优\"],\n [5,42,24,44,0.76,40,16,\"优\"],\n [6,82,58,90,1.77,68,33,\"良\"],\n [7,74,49,77,1.46,48,27,\"良\"],\n [8,78,55,80,1.29,59,29,\"良\"],\n [9,267,216,280,4.8,108,64,\"重度污染\"],\n [10,185,127,216,2.52,61,27,\"中度污染\"],\n [11,39,19,38,0.57,31,15,\"优\"],\n [12,41,11,40,0.43,21,7,\"优\"],\n [13,64,38,74,1.04,46,22,\"良\"],\n [14,108,79,120,1.7,75,41,\"轻度污染\"],\n [15,108,63,116,1.48,44,26,\"轻度污染\"],\n [16,33,6,29,0.34,13,5,\"优\"],\n [17,94,66,110,1.54,62,31,\"良\"],\n [18,186,142,192,3.88,93,79,\"中度污染\"],\n [19,57,31,54,0.96,32,14,\"良\"],\n [20,22,8,17,0.48,23,10,\"优\"],\n [21,39,15,36,0.61,29,13,\"优\"],\n [22,94,69,114,2.08,73,39,\"良\"],\n [23,99,73,110,2.43,76,48,\"良\"],\n [24,31,12,30,0.5,32,16,\"优\"],\n [25,42,27,43,1,53,22,\"优\"],\n [26,154,117,157,3.05,92,58,\"中度污染\"],\n [27,234,185,230,4.09,123,69,\"重度污染\"],\n [28,160,120,186,2.77,91,50,\"中度污染\"],\n [29,134,96,165,2.76,83,41,\"轻度污染\"],\n [30,52,24,60,1.03,50,21,\"良\"],\n [31,46,5,49,0.28,10,6,\"优\"]\n];\n\nconst dataGZ = [\n [1,26,37,27,1.163,27,13,\"优\"],\n [2,85,62,71,1.195,60,8,\"良\"],\n [3,78,38,74,1.363,37,7,\"良\"],\n [4,21,21,36,0.634,40,9,\"优\"],\n [5,41,42,46,0.915,81,13,\"优\"],\n [6,56,52,69,1.067,92,16,\"良\"],\n [7,64,30,28,0.924,51,2,\"良\"],\n [8,55,48,74,1.236,75,26,\"良\"],\n [9,76,85,113,1.237,114,27,\"良\"],\n [10,91,81,104,1.041,56,40,\"良\"],\n [11,84,39,60,0.964,25,11,\"良\"],\n [12,64,51,101,0.862,58,23,\"良\"],\n [13,70,69,120,1.198,65,36,\"良\"],\n [14,77,105,178,2.549,64,16,\"良\"],\n [15,109,68,87,0.996,74,29,\"轻度污染\"],\n [16,73,68,97,0.905,51,34,\"良\"],\n [17,54,27,47,0.592,53,12,\"良\"],\n [18,51,61,97,0.811,65,19,\"良\"],\n [19,91,71,121,1.374,43,18,\"良\"],\n [20,73,102,182,2.787,44,19,\"良\"],\n [21,73,50,76,0.717,31,20,\"良\"],\n [22,84,94,140,2.238,68,18,\"良\"],\n [23,93,77,104,1.165,53,7,\"良\"],\n [24,99,130,227,3.97,55,15,\"良\"],\n [25,146,84,139,1.094,40,17,\"轻度污染\"],\n [26,113,108,137,1.481,48,15,\"轻度污染\"],\n [27,81,48,62,1.619,26,3,\"良\"],\n [28,56,48,68,1.336,37,9,\"良\"],\n [29,82,92,174,3.29,0,13,\"良\"],\n [30,106,116,188,3.628,101,16,\"轻度污染\"],\n [31,118,50,0,1.383,76,11,\"轻度污染\"]\n];\n\nconst dataSH = [\n [1,91,45,125,0.82,34,23,\"良\"],\n [2,65,27,78,0.86,45,29,\"良\"],\n [3,83,60,84,1.09,73,27,\"良\"],\n [4,109,81,121,1.28,68,51,\"轻度污染\"],\n [5,106,77,114,1.07,55,51,\"轻度污染\"],\n [6,109,81,121,1.28,68,51,\"轻度污染\"],\n [7,106,77,114,1.07,55,51,\"轻度污染\"],\n [8,89,65,78,0.86,51,26,\"良\"],\n [9,53,33,47,0.64,50,17,\"良\"],\n [10,80,55,80,1.01,75,24,\"良\"],\n [11,117,81,124,1.03,45,24,\"轻度污染\"],\n [12,99,71,142,1.1,62,42,\"良\"],\n [13,95,69,130,1.28,74,50,\"良\"],\n [14,116,87,131,1.47,84,40,\"轻度污染\"],\n [15,108,80,121,1.3,85,37,\"轻度污染\"],\n [16,134,83,167,1.16,57,43,\"轻度污染\"],\n [17,79,43,107,1.05,59,37,\"良\"],\n [18,71,46,89,0.86,64,25,\"良\"],\n [19,97,71,113,1.17,88,31,\"良\"],\n [20,84,57,91,0.85,55,31,\"良\"],\n [21,87,63,101,0.9,56,41,\"良\"],\n [22,104,77,119,1.09,73,48,\"轻度污染\"],\n [23,87,62,100,1,72,28,\"良\"],\n [24,168,128,172,1.49,97,56,\"中度污染\"],\n [25,65,45,51,0.74,39,17,\"良\"],\n [26,39,24,38,0.61,47,17,\"优\"],\n [27,39,24,39,0.59,50,19,\"优\"],\n [28,93,68,96,1.05,79,29,\"良\"],\n [29,188,143,197,1.66,99,51,\"中度污染\"],\n [30,174,131,174,1.55,108,50,\"中度污染\"],\n [31,187,143,201,1.39,89,53,\"中度污染\" ] \ n ] ; \ n \ n c o n s t s c h e m a = [ \ n { n a m e : ' d a t e ' , i n d e x : 0 , t e x t : ' 日 期 ' } , \ n { n a m e : '
"name" : "parallel-series" ,
"title" : "平行坐标" ,
"title-en" : "Parallel"
}
]
} ,
"series-lines" : {
"desc" : "<p><strong>路径图</strong></p>\n<p>用于带有起点和终点信息的线数据的绘制，主要用于地图上的航线，路线的可视化。</p>\n<p>ECharts 2.x 里会用地图上的 <code class=\"codespan\">markLine</code> 去绘制迁徙效果，在 ECharts 3 里建议使用单独的 <code class=\"codespan\">lines</code> 类型图表。</p>\n"
} ,
"series-graph" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><strong>关系图</strong></p>\n<p>用于展现节点以及节点之间的关系数据。</p>\n<p><strong>示例：</strong></p>\n<iframe data-src=\"http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=graph&reset=1&edit=1\" width=\"600\" height=\"400\"><iframe />\n\n\n\n" ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\nconst option = {\"title\":{\"text\":\"Les Miserables\",\"subtext\":\"Default layout\",\"top\":\"bottom\",\"left\":\"right\"},\"tooltip\":{},\"legend\":[{\"data\":[\"类目0\",\"类目1\",\"类目2\",\"类目3\",\"类目4\",\"类目5\",\"类目6\",\"类目7\",\"类目8\"]}],\"animationDuration\":1500,\"animationEasingUpdate\":\"quinticInOut\",\"series\":[{\"name\":\"Les Miserables\",\"type\":\"graph\",\"layout\":\"none\",\"data\":[{\"id\":\"0\",\"name\":\"Myriel\",\"symbolSize\":19.12381,\"x\":-266.82776,\"y\":299.6904,\"value\":28.685715,\"category\":0},{\"id\":\"1\",\"name\":\"Napoleon\",\"symbolSize\":2.6666666666666665,\"x\":-418.08344,\"y\":446.8853,\"value\":4,\"category\":0},{\"id\":\"2\",\"name\":\"MlleBaptistine\",\"symbolSize\":6.323809333333333,\"x\":-212.76357,\"y\":245.29176,\"value\":9.485714,\"category\":1},{\"id\":\"3\",\"name\":\"MmeMagloire\",\"symbolSize\":6.323809333333333,\"x\":-242.82404,\"y\":235.26283,\"value\":9.485714,\"category\":1},{\"id\":\"4\",\"name\":\"CountessDeLo\",\"symbolSize\":2.6666666666666665,\"x\":-379.30386,\"y\":429.06424,\"value\":4,\"category\":0},{\"id\":\"5\",\"name\":\"Geborand\",\"symbolSize\":2.6666666666666665,\"x\":-417.26337,\"y\":406.03506,\"value\":4,\"category\":0},{\"id\":\"6\",\"name\":\"Champtercier\",\"symbolSize\":2.6666666666666665,\"x\":-332.6012,\"y\":485.16974,\"value\":4,\"category\":0},{\"id\":\"7\",\"name\":\"Cravatte\",\"symbolSize\":2.6666666666666665,\"x\":-382.69568,\"y\":475.09113,\"value\":4,\"category\":0},{\"id\":\"8\",\"name\":\"Count\",\"symbolSize\":2.6666666666666665,\"x\":-320.384,\"y\":387.17325,\"value\":4,\"category\":0},{\"id\":\"9\",\"name\":\"OldMan\",\"symbolSize\":2.6666666666666665,\"x\":-344.39832,\"y\":451.16772,\"value\":4,\"category\":0},{\"id\":\"10\",\"name\":\"Labarre\",\"symbolSize\":2.6666666666666665,\"x\":-89.34107,\"y\":234.56128,\"value\":4,\"category\":1},{\"id\":\"11\",\"name\":\"Valjean\",\"symbolSize\":66.66666666666667,\"x\":-87.93029,\"y\":-6.8120565,\"value\":100,\"category\":1},{\"id\":\"12\",\"name\":\"Marguerite\",\"symbolSize\":4.495239333333333,\"x\":-339.77908,\"y\":-184.69139,\"value\":6.742859,\"category\":1},{\"id\":\"13\",\"name\":\"MmeDeR\",\"symbolSize\":2.6666666666666665,\"x\":-194.31313,\"y\":178.55301,\"value\":4,\"category\":1},{\"id\":\"14\",\"name\":\"Isabeau\",\"symbolSize\":2.6666666666666665,\"x\":-158.05168,\"y\":201.99768,\"value\":4,\"category\":1},{\"id\":\"15\",\"name\":\"Gervais\",\"symbolSize\":2.6666666666666665,\"x\":-127.701546,\"y\":242.55057,\"value\":4,\"category\":1},{\"id\":\"16\",\"name\":\"Tholomyes\",\"symbolSize\":17.295237333333333,\"x\":-385.2226,\"y\":-393.5572,\"value\":25.942856,\"category\":2},{\"id\":\"17\",\"name\":\"Listolier\",\"symbolSize\":13.638097333333334,\"x\":-516.55884,\"y\":-393.98975,\"value\":20.457146,\"category\":2},{\"id\":\"18\",\"name\":\"Fameuil\",\"symbolSize\":13.638097333333334,\"x\":-464.79382,\"y\":-493.57944,\"value\":20.457146,\"category\":2},{\"id\":\"19\",\"name\":\"Blacheville\",\"symbolSize\":13.638097333333334,\"x\":-515.1624,\"y\":-456.9891,\"value\":20.457146,\"category\":2},{\"id\":\"20\",\"name\":\"Favourite\",\"symbolSize\":13.638097333333334,\"x\":-408.12122,\"y\":-464.5048,\"value\":20.457146,\"category\":2},{\"id\":\"21\",\"name\":\"Dahlia\",\"symbolSize\":13.638097333333334,\"x\":-456.44113,\"y\":-425.13303,\"value\":20.457146,\"category\":2},{\"id\":\"22\",\"name\":\"Zephine\",\"symbolSize\":13.638097333333334,\"x\":-459.1107,\"y\":-362.5133,\"value\":20.457146,\"category\":2},{\"id\":\"23\",\"name\":\"Fantine\",\"symbolSize\":28.266666666666666,\"x\":-313.42786,\"y\":-289.44803,\"value\":42.4,\"category\":2},{\"id\":\"24\",\"name\":\"MmeThenardier\",\"symbolSize\":20.95238266666667,\"x\":4.6313396,\"y\":-273.8517,\"value\":31.428574,\"category\":7},{\"id\":\"25\",\"name\":\"Thenardier\",\"symbolSize\":30.095235333333335,\"x\":82.80825,\"y\":-203.1144,\"value\":45.142853,\"category\":7},{\"id\":\"26\",\"name\":\"Cosette\",\"symbolSize\":20.95238266666667,\"x\":78.64646,\"y\":-31.512747,\"value\" : 31.428574 ,
"name" : "graph" ,
"title" : "复杂关系图"
}
]
} ,
"series-sankey" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><strong> 桑基图 </strong></p>\n<p>是一种特殊的流图（可以看作是有向无环图）。 它主要用来表示原材料、能量等如何从最初形式经过中间过程的加工或转化达到最终状态。</p>\n<p><strong>示例：</strong></p>\n<iframe data-src=\"http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=sankey-energy&edit=1&reset=1\" width=\"700\" height=\"580\"><iframe />\n\n\n<p><br>\n<strong>可视编码：</strong></p>\n<p>桑基图将原数据中的每个<code class=\"codespan\">node</code>编码成一个小矩形，不同的节点尽量用不同的颜色展示，小矩形旁边的<code class=\"codespan\">label</code>编码的是节点的名称。</p>\n<p>此外，图中每两个小矩形之间的边编码的是原数据中的<code class=\"codespan\">link</code>，边的粗细编码的是<code class=\"codespan\">link</code>中的<code class=\"codespan\">value</code>。</p>\n<p><br>\n<strong>排序：</strong></p>\n<p>如果想指定每层节点的顺序是按照 <a href=\"#series-sankey.data\">data</a> 中的顺序排列的。可以设置 <a href=\"#series-sankey.layoutIterations\">layoutIterations</a> 为 <code class=\"codespan\">0</code>。</p>\n\n" ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\nconst option = {\"tooltip\":{\"trigger\":\"item\",\"triggerOn\":\"mousemove\"},\"series\":[{\"type\":\"sankey\",\"data\":[{\"name\":\"Agricultural 'waste'\"},{\"name\":\"Bio-conversion\"},{\"name\":\"Liquid\"},{\"name\":\"Losses\"},{\"name\":\"Solid\"},{\"name\":\"Gas\"},{\"name\":\"Biofuel imports\"},{\"name\":\"Biomass imports\"},{\"name\":\"Coal imports\"},{\"name\":\"Coal\"},{\"name\":\"Coal reserves\"},{\"name\":\"District heating\"},{\"name\":\"Industry\"},{\"name\":\"Heating and cooling - commercial\"},{\"name\":\"Heating and cooling - homes\"},{\"name\":\"Electricity grid\"},{\"name\":\"Over generation / exports\"},{\"name\":\"H2 conversion\"},{\"name\":\"Road transport\"},{\"name\":\"Agriculture\"},{\"name\":\"Rail transport\"},{\"name\":\"Lighting & appliances - commercial\"},{\"name\":\"Lighting & appliances - homes\"},{\"name\":\"Gas imports\"},{\"name\":\"Ngas\"},{\"name\":\"Gas reserves\"},{\"name\":\"Thermal generation\"},{\"name\":\"Geothermal\"},{\"name\":\"H2\"},{\"name\":\"Hydro\"},{\"name\":\"International shipping\"},{\"name\":\"Domestic aviation\"},{\"name\":\"International aviation\"},{\"name\":\"National navigation\"},{\"name\":\"Marine algae\"},{\"name\":\"Nuclear\"},{\"name\":\"Oil imports\"},{\"name\":\"Oil\"},{\"name\":\"Oil reserves\"},{\"name\":\"Other waste\"},{\"name\":\"Pumped heat\"},{\"name\":\"Solar PV\"},{\"name\":\"Solar Thermal\"},{\"name\":\"Solar\"},{\"name\":\"Tidal\"},{\"name\":\"UK land based bioenergy\"},{\"name\":\"Wave\"},{\"name\":\"Wind\"}],\"links\":[{\"source\":\"Agricultural 'waste'\",\"target\":\"Bio-conversion\",\"value\":124.729},{\"source\":\"Bio-conversion\",\"target\":\"Liquid\",\"value\":0.597},{\"source\":\"Bio-conversion\",\"target\":\"Losses\",\"value\":26.862},{\"source\":\"Bio-conversion\",\"target\":\"Solid\",\"value\":280.322},{\"source\":\"Bio-conversion\",\"target\":\"Gas\",\"value\":81.144},{\"source\":\"Biofuel imports\",\"target\":\"Liquid\",\"value\":35},{\"source\":\"Biomass imports\",\"target\":\"Solid\",\"value\":35},{\"source\":\"Coal imports\",\"target\":\"Coal\",\"value\":11.606},{\"source\":\"Coal reserves\",\"target\":\"Coal\",\"value\":63.965},{\"source\":\"Coal\",\"target\":\"Solid\",\"value\":75.571},{\"source\":\"District heating\",\"target\":\"Industry\",\"value\":10.639},{\"source\":\"District heating\",\"target\":\"Heating and cooling - commercial\",\"value\":22.505},{\"source\":\"District heating\",\"target\":\"Heating and cooling - homes\",\"value\":46.184},{\"source\":\"Electricity grid\",\"target\":\"Over generation / exports\",\"value\":104.453},{\"source\":\"Electricity grid\",\"target\":\"Heating and cooling - homes\",\"value\":113.726},{\"source\":\"Electricity grid\",\"target\":\"H2 conversion\",\"value\":27.14},{\"source\":\"Electricity grid\",\"target\":\"Industry\",\"value\":342.165},{\"source\":\"Electricity grid\",\"target\":\"Road transport\",\"value\":37.797},{\"source\":\"Electricity grid\",\"target\":\"Agriculture\",\"value\":4.412},{\"source\":\"Electricity grid\",\"target\":\"Heating and cooling - commercial\",\"value\":40.858},{\"source\":\"Electricity grid\",\"target\":\"Losses\",\"value\":56.691},{\"source\":\"Electricity grid\",\"target\":\"Rail transport\",\"value\":7.863},{\"source\":\"Electricity grid\",\"target\":\"Lighting & appliances - commercial\",\"value\":90.008},{\"source\":\"Electricity grid\",\"target\":\"Lighting & appliances - homes\",\"value\":93.494},{\"source\":\"Gas imports\",\"target\":\"Ngas\",\"value\":40.719},{\"source\":\"Gas reserves\",\"target\":\"Ngas\",\"value\":82.233},{\"source\":\"Gas\",\"target\":\"Heating and cooling - commercial\",\"value\":0.129},{\"source\":\"Gas\",\"target\":\"Losses\",\"value\":1.401},{\"source\":\"Gas\",\"target\":\"Thermal generation\",\"value\":151.891},{\"source\":\"Gas\",\"target\":\"Agriculture\",\"value\":2.096},{\"source\":\"Gas\",\"target\":\"Industry\",\"value\":48.58},{\"source\":\"Geothermal\",\"target\":\"Electricity grid\",\"value\":7.013},{\"source\":\"H2 conversion\",\"target\":\"H2\",\"value\":20.897},{\"source\":\" H 2 c o n
"name" : "sankey" ,
"title" : "桑基图" ,
"title-en" : "Sankey"
}
]
} ,
"series-funnel" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><strong>漏斗图</strong></p>\n<p><strong>示例：</strong></p>\n<iframe data-src=\"http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=funnel&reset=1&edit=1\" width=\"600\" height=\"400\"><iframe />\n\n\n\n" ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\noption = {\n legend: {\n data: ['Display','Click','Visit','Consulting','Order']\n },\n series: [\n {\n name:'漏斗图',\n type:'funnel',\n data: [\n {value: 60, name: 'Visit'},\n {value: 40, name: 'Consulting'},\n {value: 20, name: 'Order'},\n {value: 80, name: 'Click'},\n {value: 100, name: 'Display'}\n ]\n }\n ]\n};\n\n" ,
"name" : "funnel" ,
"tilte" : "基础漏斗图" ,
"title-en" : "Basic Funnel"
}
]
} ,
"series-gauge" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><strong>仪表盘</strong></p>\n<p><strong>示例：</strong></p>\n<iframe data-src=\"http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=gauge&reset=1&edit=1\" width=\"600\" height=\"500\"><iframe />\n\n\n\n" ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\nconst option = {\n series: [\n {\n name: 'Indicator',\n type: 'gauge',\n detail: {formatter: '{value}%'},\n data: [{value: 50, name: 'Percent'}]\n }\n ]\n};\n" ,
"name" : "gauge" ,
"title" : "基础仪表盘" ,
"title-en" : "Basic Gauge"
}
]
} ,
"series-pictorialBar" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><strong>象形柱图</strong></p>\n<p>象形柱图是可以设置各种具象图形元素（如图片、<a href=\"http://www.w3.org/TR/SVG/paths.html#PathData\" target=\"_blank\">SVG PathData</a> 等）的柱状图。往往用在信息图中。用于有至少一个类目轴或时间轴的<a href=\"#grid\">直角坐标系</a>上。</p>\n<p><strong>示例：</strong></p>\n<iframe data-src=\"http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=pictorialBar-hill&reset=1&edit=1\" width=\"800\" height=\"400\"><iframe />\n\n\n\n<p><strong>布局</strong></p>\n<p>象形柱图可以被想象为： ， （ ） ， （ ） ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : " \ n v a r s p i r i t = ' i m a g e : //data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHUAAACUCAYAAACtHGabAAAACXBIWXMAABcSAAAXEgFnn9JSAAAKTWlDQ1BQaG90b3Nob3AgSUNDIHByb2ZpbGUAAHjanVN3WJP3Fj7f92UPVkLY8LGXbIEAIiOsCMgQWaIQkgBhhBASQMWFiApWFBURnEhVxILVCkidiOKgKLhnQYqIWotVXDjuH9yntX167+3t+9f7vOec5/zOec8PgBESJpHmomoAOVKFPDrYH49PSMTJvYACFUjgBCAQ5svCZwXFAADwA3l4fnSwP/wBr28AAgBw1S4kEsfh/4O6UCZXACCRAOAiEucLAZBSAMguVMgUAMgYALBTs2QKAJQAAGx5fEIiAKoNAOz0ST4FANipk9wXANiiHKkIAI0BAJkoRyQCQLsAYFWBUiwCwMIAoKxAIi4EwK4BgFm2MkcCgL0FAHaOWJAPQGAAgJlCLMwAIDgCAEMeE80DIEwDoDDSv+CpX3CFuEgBAMDLlc2XS9IzFLiV0Bp38vDg4iHiwmyxQmEXKRBmCeQinJebIxNI5wNMzgwAABr50cH+OD+Q5+bk4eZm52zv9MWi/mvwbyI+IfHf/ryMAgQAEE7P79pf5eXWA3DHAbB1v2upWwDaVgBo3/ldM9sJoFoK0Hr5i3k4/EAenqFQyDwdHAoLC+0lYqG9MOOLPv8z4W/gi372/EAe/tt68ABxmkCZrcCjg/1xYW52rlKO58sEQjFu9+cj/seFf/2OKdHiNLFcLBWK8ViJuFAiTcd5uVKRRCHJleIS6X8y8R+W/QmTdw0ArIZPwE62B7XLbMB+7gECiw5Y0nYAQH7zLYwaC5EAEGc0Mnn3AACTv/mPQCsBAM2XpOMAALzoGFyolBdMxggAAESggSqwQQcMwRSswA6cwR28wBcCYQZEQAwkwDwQQgbkgBwKoRiWQRlUwDrYBLWwAxqgEZrhELTBMTgN5+ASXIHrcBcGYBiewhi8hgkEQcgIE2EhOogRYo7YIs4IF5mOBCJhSDSSgKQg6YgUUSLFyHKkAqlCapFdSCPyLXIUOY1cQPqQ28ggMor8irxHMZSBslED1AJ1QLmoHxqKxqBz0XQ0D12AlqJr0Rq0Hj2AtqKn0UvodXQAfYqOY4DRMQ5mjNlhXIyHRWCJWBomxxZj5Vg1Vo81Yx1YN3YVG8CeYe8IJAKLgBPsCF6EEMJsgpCQR1hMWEOoJewjtBK6CFcJg4Qxwicik6hPtCV6EvnEeGI6sZBYRqwm7iEeIZ4lXicOE1+TSCQOyZLkTgohJZAySQtJa0jbSC2kU6Q+0hBpnEwm65Btyd7kCLKArCCXkbeQD5BPkvvJw+S3FDrFiOJMCaIkUqSUEko1ZT/lBKWfMkKZoKpRzame1AiqiDqfWkltoHZQL1OHqRM0dZolzZsWQ8ukLaPV0JppZ2n3aC/pdLoJ3YMeRZfQl9Jr6Afp5+mD9HcMDYYNg8dIYigZaxl7GacYtxkvmUymBdOXmchUMNcyG5lnmA+Yb1VYKvYqfBWRyhKVOpVWlX6V56pUVXNVP9V5qgtUq1UPq15WfaZGVbNQ46kJ1Bar1akdVbupNq7OUndSj1DPUV+jvl/9gvpjDbKGhUaghkijVGO3xhmNIRbGMmXxWELWclYD6yxrmE1iW7L57Ex2Bfsbdi97TFNDc6pmrGaRZp3mcc0BDsax4PA52ZxKziHODc57LQMtPy2x1mqtZq1+rTfaetq+2mLtcu0W7eva73VwnUCdLJ31Om0693UJuja6UbqFutt1z+o+02PreekJ9cr1Dund0Uf1bfSj9Rfq79bv0R83MDQINpAZbDE4Y/DMkGPoa5hpuNHwhOGoEctoupHEaKPRSaMnuCbuh2fjNXgXPmasbxxirDTeZdxrPGFiaTLbpMSkxeS+Kc2Ua5pmutG003TMzMgs3KzYrMnsjjnVnGueYb7ZvNv8jYWlRZzFSos2i8eW2pZ8ywWWTZb3rJhWPlZ5VvVW16xJ1lzrLOtt1ldsUBtXmwybOpvLtqitm63Edptt3xTiFI8p0in1U27aMez87ArsmuwG7Tn2YfYl9m32zx3MHBId1jt0O3xydHXMdmxwvOuk4TTDqcSpw+lXZxtnoXOd8zUXpkuQyxKXdpcXU22niqdun3rLleUa7rrStdP1o5u7m9yt2W3U3cw9xX2r+00umxvJXcM970H08PdY4nHM452nm6fC85DnL152Xlle+70eT7OcJp7WMG3I28Rb4L3Le2A6Pj1l+s7pAz7GPgKfep+Hvqa+It89viN+1n6Zfgf8nvs7+sv9j/i/4XnyFvFOBWABwQHlAb2BGoGzA2sDHwSZBKUHNQWNBbsGLww+FUIMCQ1ZH3KTb8AX8hv5YzPcZyya0RXKCJ0VWhv6MMwmTB7WEY6GzwjfEH5vpvlM6cy2CIjgR2yIuB9pGZkX+X0UKSoyqi7qUbRTdHF09yzWrORZ+2e9jvGPqYy5O9tqtnJ2Z6xqbFJsY+ybuIC4qriBeIf4RfGXEnQTJAntieTE2MQ9ieNzAudsmjOc5JpUlnRjruXcorkX5unOy553PFk1WZB8OIWYEpeyP+WDIEJQLxhP5aduTR0T8oSbhU9FvqKNolGxt7hKPJLmnVaV9jjdO31D+miGT0Z1xjMJT1IreZEZkrkj801WRNberM/ZcdktOZSclJyjUg1plrQr1zC3KLdPZisrkw3keeZtyhuTh8r35CP5c/PbFWyFTNGjtFKuUA4WTC+oK3hbGFt4uEi9SFrUM99m/ur5IwuCFny9kLBQuLCz2Lh4WfHgIr9FuxYji1MXdy4xXVK6ZHhp8NJ9y2jLspb9UOJYUlXyannc8o5Sg9KlpUMrglc0lamUycturvRauWMVYZVkVe9ql9VbVn8qF5VfrHCsqK74sEa45uJXTl/VfPV5bdra3kq3yu3rSOuk626s91m/r0q9akHV0IbwDa0b8Y3lG19tSt50oXpq9Y7NtM3KzQM1YTXtW8y2rNvyoTaj9nqdf13LVv2tq7e+2Sba1r/dd3vzDoMdFTve75TsvLUreFdrvUV99W7S7oLdjxpiG7q/5n7duEd3T8Wej3ulewf2Re/ranRvbNyvv7+yCW1SNo0eSDpw5ZuAb9qb7Zp3tXBaKg7CQeXBJ9+mfHvjUOihzsPcw83fmX+39QjrSHkr0jq/dawto22gPaG97+iMo50dXh1Hvrf/fu8x42N1xzWPV56gnSg98fnkgpPjp2Snnp1OPz3Umdx590z8mWtdUV29Z0PPnj8XdO5Mt1/3yfPe549d8Lxw9CL3Ytslt0utPa49R35w/eFIr1tv62X3y+1XPK509E3rO9Hv03/6asDVc9f41y5dn3m978bsG7duJt0cuCW69fh29u0XdwruTNxdeo94r/y+2v3qB/oP6n+0/rFlwG3g+GDAYM/DWQ/vDgmHnv6U/9OH4dJHzEfVI0YjjY+dHx8bDRq98mTOk+GnsqcTz8p+Vv9563Or59/94vtLz1j82PAL+YvPv655qfNy76uprzrHI8cfvM55PfGm/K3O233vuO+638e9H5ko/ED+UPPR+mPHp9BP9z7nfP78L/eE8/sl0p8zAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAABvgSURBVHja7J17dBPXnce/dzR6WH7IwTbYxPgBBJsAtgwJXcchCM5ZEtJwcHqaRxs4hXQh+4dT3O1hd9ukJ05LT/dsT4lTyO7JSbfrQHabbdqNE/qgTjcR5KTOsxjCK4QGGwgy2ARJtoSec/ePGUkzo9HLGj2MdTk62PLM6KffZ76/+7u/e2eGUEoxHduota0BQA+ATgAm0Z9GAPQD6K22HBnGDGxkOkIdtbb1AHgqwWYOAN3VliN9Baj5D7QPwDdS2GXrTAM7raCOWts6Abw6hV3bqi1HhmYKVGaa2dub5f0KUDOsUguA+inuvlpIrApQ86xZ0tzfXIB647UC1Hxr77m0zSi0Gwcq2bvO/K5b25nm
"name" : "pictorial-bar" ,
"title" : "基础象形柱图" ,
"title-en" : "Basic Pictorial Bar"
}
]
} ,
"series-themeRiver" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><strong> 主题河流 </strong></p>\n<p>是一种特殊的流图, 它主要用来表示事件或主题等在一段时间内的变化。</p>\n<p><strong>示例：</strong></p>\n<iframe data-src=\"http://localhost/incubator-echarts-website/next/examples/zh/view.html?c=themeRiver-lastfm&edit=1&reset=1\" width=\"700\" height=\"580\"><iframe />\n\n\n\n<p><br>\n<strong>可视编码：</strong></p>\n<p>主题河流中不同颜色的条带状河流分支编码了不同的事件或主题， ,
2020-11-01 00:26:47 +08:00
"exampleBaseOptions" : [
{
"code" : "\n\nconst option = {\n singleAxis: {\n top: 50,\n bottom: 50,\n axisTick: {},\n axisLabel: {},\n type: 'time',\n axisPointer: {\n animation: true,\n label: {\n show: true\n }\n },\n splitLine: {\n show: true,\n lineStyle: {\n type: 'dashed',\n opacity: 0.2\n }\n }\n },\n series: [\n {\n type: 'themeRiver',\n data: [['2015/11/08',10,'DQ'],['2015/11/09',15,'DQ'],['2015/11/10',35,'DQ'],\n ['2015/11/11',38,'DQ'],['2015/11/12',22,'DQ'],['2015/11/13',16,'DQ'],\n ['2015/11/14',7,'DQ'],['2015/11/15',2,'DQ'],['2015/11/16',17,'DQ'],\n ['2015/11/17',33,'DQ'],['2015/11/18',40,'DQ'],['2015/11/19',32,'DQ'],\n ['2015/11/20',26,'DQ'],['2015/11/21',35,'DQ'],['2015/11/22',40,'DQ'],\n ['2015/11/23',32,'DQ'],['2015/11/24',26,'DQ'],['2015/11/25',22,'DQ'],\n ['2015/11/26',16,'DQ'],['2015/11/27',22,'DQ'],['2015/11/28',10,'DQ'],\n ['2015/11/08',35,'TY'],['2015/11/09',36,'TY'],['2015/11/10',37,'TY'],\n ['2015/11/11',22,'TY'],['2015/11/12',24,'TY'],['2015/11/13',26,'TY'],\n ['2015/11/14',34,'TY'],['2015/11/15',21,'TY'],['2015/11/16',18,'TY'],\n ['2015/11/17',45,'TY'],['2015/11/18',32,'TY'],['2015/11/19',35,'TY'],\n ['2015/11/20',30,'TY'],['2015/11/21',28,'TY'],['2015/11/22',27,'TY'],\n ['2015/11/23',26,'TY'],['2015/11/24',15,'TY'],['2015/11/25',30,'TY'],\n ['2015/11/26',35,'TY'],['2015/11/27',42,'TY'],['2015/11/28',42,'TY'],\n ['2015/11/08',21,'SS'],['2015/11/09',25,'SS'],['2015/11/10',27,'SS'],\n ['2015/11/11',23,'SS'],['2015/11/12',24,'SS'],['2015/11/13',21,'SS'],\n ['2015/11/14',35,'SS'],['2015/11/15',39,'SS'],['2015/11/16',40,'SS'],\n ['2015/11/17',36,'SS'],['2015/11/18',33,'SS'],['2015/11/19',43,'SS'],\n ['2015/11/20',40,'SS'],['2015/11/21',34,'SS'],['2015/11/22',28,'SS'],\n ['2015/11/23',26,'SS'],['2015/11/24',37,'SS'],['2015/11/25',41,'SS'],\n ['2015/11/26',46,'SS'],['2015/11/27',47,'SS'],['2015/11/28',41,'SS'],\n ['2015/11/08',10,'QG'],['2015/11/09',15,'QG'],['2015/11/10',35,'QG'],\n ['2015/11/11',38,'QG'],['2015/11/12',22,'QG'],['2015/11/13',16,'QG'],\n ['2015/11/14',7,'QG'],['2015/11/15',2,'QG'],['2015/11/16',17,'QG'],\n ['2015/11/17',33,'QG'],['2015/11/18',40,'QG'],['2015/11/19',32,'QG'],\n ['2015/11/20',26,'QG'],['2015/11/21',35,'QG'],['2015/11/22',40,'QG'],\n ['2015/11/23',32,'QG'],['2015/11/24',26,'QG'],['2015/11/25',22,'QG'],\n ['2015/11/26',16,'QG'],['2015/11/27',22,'QG'],['2015/11/28',10,'QG'],\n ['2015/11/08',10,'SY'],['2015/11/09',15,'SY'],['2015/11/10',35,'SY'],\n ['2015/11/11',38,'SY'],['2015/11/12',22,'SY'],['2015/11/13',16,'SY'],\n ['2015/11/14',7,'SY'],['2015/11/15',2,'SY'],['2015/11/16',17,'SY'],\n ['2015/11/17',33,'SY'],['2015/11/18',40,'SY'],['2015/11/19',32,'SY'],\n ['2015/11/20',26,'SY'],['2015/11/21',35,'SY'],['2015/11/22',4,'SY'],\n ['2015/11/23',32,'SY'],['2015/11/24',26,'SY'],['2015/11/25',22,'SY'],\n ['2015/11/26',16,'SY'],['2015/11/27',22,'SY'],['2015/11/28',10,'SY'],\n ['2015/11/08',10,'DD'],['2015/11/09',15,'DD'],['2015/11/10',35,'DD'],\n ['2015/11/11',38,'DD'],['2015/11/12',22,'DD'],['2015/11/13',16,'DD'],\n ['2015/11/14',7,'DD'],['2015/11/15',2,'DD'],['2015/11/16',17,'DD'],\n ['2015/11/17',33,'DD'],['2015/11/18',4,'DD'],['2015/11/19',32,'DD'],\n ['2015/11/20',26,'DD'],['2015/11/21',35,'DD'],['2015/11/22',40,'DD'],\n ['2015/11/23',32,'DD'],['2015/11/24',26,'DD'],['2015/11/25',22,'DD'],\n ['2015/11/26',16,'DD'],['2015/11/27',22,'DD'],['2015/11/28',10,'DD']]\n }\n ]\n};\n" ,
"name" : "themeRiver" ,
"title" : "主题河流图" ,
"title-en" : "Basic Theme River"
}
]
} ,
"series-custom" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p><strong>自定义系列</strong></p>\n<p>自定义系列可以自定义系列中的图形元素渲染。从而能扩展出不同的图表。</p>\n<p>同时， （ # s e r i e s - c u s t o m . r e n d e r I t e m .
} ,
"darkMode" : {
"desc" : "<p>是否是暗黑模式，默认会根据背景色 <a href=\"#backgroundColor\">backgroundColor</a> 的亮度自动设置。\n如果是设置了容器的背景色而无法判断到， ，
2020-11-01 00:26:47 +08:00
} ,
"color" : {
"desc" : "<p>调色盘颜色列表。如果系列没有设置颜色，则会依次循环从该列表中取颜色作为系列颜色。</p>\n<p>默认为：</p>\n<pre><code class=\"lang-js\">['#c23531','#2f4554', '#61a0a8', '#d48265', '#91c7ae','#749f83', '#ca8622', '#bda29a','#6e7074', '#546570', '#c4ccd3']\n</code></pre>\n"
} ,
"backgroundColor" : {
"desc" : "<p>背景色，默认无背景。</p>\n<blockquote>\n<p>颜色可以使用 RGB 表示，比如 <code class=\"codespan\">'rgb(128, 128, 128)'</code>，如果想要加上 alpha 通道表示不透明度，可以使用 RGBA， ， ， ，
} ,
"textStyle" : {
"desc" : "<p>全局的字体样式。</p>\n"
} ,
"animation" : {
"desc" : "\n\n<p>是否开启动画。</p>\n" ,
"uiControl" : {
"type" : "boolean" ,
"default" : "true" ,
"clean" : "true"
}
} ,
"animationThreshold" : {
"desc" : "<p>是否开启动画的阈值，当单个系列显示的图形数量大于这个阈值时会关闭动画。</p>\n"
} ,
"animationDuration" : {
"desc" : "\n\n<p>初始动画的时长，支持回调函数，可以通过每个数据返回不同的时长实现更戏剧的初始动画效果：</p>\n<pre><code class=\"lang-js\">animationDuration: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n" ,
"uiControl" : {
"type" : "number" ,
"min" : "0" ,
"default" : "1000" ,
"step" : "20" ,
"clean" : "true"
}
} ,
"animationEasing" : {
2020-12-17 19:56:53 +08:00
"desc" : "\n\n<p>初始动画的缓动效果。不同的缓动效果可以参考 <a href=\"http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=line-easing\" target=\"_blank\">缓动示例</a>。</p>\n" ,
2020-11-01 00:26:47 +08:00
"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" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p>初始动画的延迟，支持回调函数，可以通过每个数据返回不同的 delay 时间实现更戏剧的初始动画效果。</p>\n<p>如下示例：</p>\n<pre><code class=\"lang-js\">animationDelay: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href=\"http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay\" target=\"_blank\">该示例</a></p>\n"
2020-11-01 00:26:47 +08:00
} ,
"animationDurationUpdate" : {
"desc" : "\n\n<p>数据更新动画的时长。</p>\n<p>支持回调函数，可以通过每个数据返回不同的时长实现更戏剧的更新动画效果：</p>\n<pre><code class=\"lang-js\">animationDurationUpdate: function (idx) {\n // 越往后的数据时长越大\n return idx * 100;\n}\n</code></pre>\n" ,
"uiControl" : {
"type" : "number" ,
"min" : "0" ,
"default" : "1000" ,
"step" : "20"
}
} ,
"animationEasingUpdate" : {
"desc" : "\n\n<p>数据更新动画的缓动效果。</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" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p>数据更新动画的延迟，支持回调函数，可以通过每个数据返回不同的 delay 时间实现更戏剧的更新动画效果。</p>\n<p>如下示例：</p>\n<pre><code class=\"lang-js\">animationDelayUpdate: function (idx) {\n // 越往后的数据延迟越大\n return idx * 100;\n}\n</code></pre>\n<p>也可以看<a href=\"http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=bar-animation-delay\" target=\"_blank\">该示例</a></p>\n"
} ,
"stateAnimation" : {
"desc" : "<p>状态切换的动画配置，支持在每个系列里设置单独针对该系列的配置。</p>\n"
2020-11-01 00:26:47 +08:00
} ,
"blendMode" : {
2020-12-17 19:56:53 +08:00
"desc" : "<p>图形的混合模式，不同的混合模式见 <a href=\"https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/globalCompositeOperation\" target=\"_blank\">https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/globalCompositeOperation</a> 。</p>\n<p>默认为 <code class=\"codespan\">'source-over'</code>。 支持每个系列单独设置。</p>\n<p><code class=\"codespan\">'lighter'</code> 也是比较常见的一种混合模式，该模式下图形数量集中的区域会颜色叠加成高亮度的颜色（白色）。常常能起到突出该区域的效果。见示例 <a href=\"http://localhost/incubator-echarts-website/next/examples/zh/editor.html?c=lines-airline\" target=\"_blank\">全球飞行航线</a></p>\n"
2020-11-01 00:26:47 +08:00
} ,
"hoverLayerThreshold" : {
"desc" : "<p>图形数量阈值，决定是否开启单独的 hover 层，在整个图表的图形数量大于该阈值时开启单独的 hover 层。</p>\n<p>单独的 hover 层主要是为了在高亮图形的时候不需要重绘整个图表，只需要把高亮的图形放入单独的一个 canvas 层进行绘制，防止在图形数量很多的时候因为高亮重绘所有图形导致卡顿。</p>\n<p>ECharts 2 里是底层强制使用单独的层绘制高亮图形，但是会带来很多问题，比如高亮的图形可能会不正确的遮挡所有其它图形，还有图形有透明度因为高亮和正常图形叠加导致不正确的透明度显示，还有移动端上因为每个图表都要多一个 canvas 带来的额外内存开销。因此 3 里默认不会开启该优化，只有在图形数量特别多，有必要做该优化时才会自动开启。</p>\n"
} ,
"useUTC" : {
"desc" : "<p>是否使用 UTC 时间。</p>\n<ul>\n<li><code class=\"codespan\">true</code>: 表示 <code class=\"codespan\">axis.type</code> 为 <code class=\"codespan\">'time'</code> 时，依据 UTC 时间确定 tick 位置，并且 <code class=\"codespan\">axisLabel</code> 和 <code class=\"codespan\">tooltip</code> 默认展示的是 UTC 时间。</li>\n<li><code class=\"codespan\">false</code>: 表示 <code class=\"codespan\">axis.type</code> 为 <code class=\"codespan\">'time'</code> 时，依据本地时间确定 tick 位置，并且 <code class=\"codespan\">axisLabel</code> 和 <code class=\"codespan\">tooltip</code> 默认展示的是本地时间。</li>\n</ul>\n<p>默认取值为false， ： （
}
}
