Echart的常用屬性


 theme = {
2 // 全圖默認背景
3 // backgroundColor: ‘rgba(0,0,0,0)’,
4
5 // 默認色板
6 color: [‘#ff7f50’,’#87cefa’,’#da70d6’,’#32cd32’,’#6495ed’,
7 ‘#ff69b4’,’#ba55d3’,’#cd5c5c’,’#ffa500’,’#40e0d0’,
8 ‘#1e90ff’,’#ff6347’,’#7b68ee’,’#00fa9a’,’#ffd700’,
9 ‘#6699FF’,’#ff6666’,’#3cb371’,’#b8860b’,’#30e0e0’],
10
11 // 圖表標題
12 title: {
13 x: ‘left’, // 水平安放位置,默認為左對齊,可選為:
14 // ‘center’ | ‘left’ | ‘right’
15 // | {number}(x坐標,單位px)
16 y: ‘top’, // 垂直安放位置,默認為全圖頂端,可選為:
17 // ‘top’ | ‘bottom’ | ‘center’
18 // | {number}(y坐標,單位px)
19 //textAlign: null // 水平對齊方式,默認根據x設置自動調整
20 backgroundColor: ‘rgba(0,0,0,0)’,
21 borderColor: ‘#ccc’, // 標題邊框顏色
22 borderWidth: 0, // 標題邊框線寬,單位px,默認為0(無邊框)
23 padding: 5, // 標題內邊距,單位px,默認各方向內邊距為5,
24 // 接受數組分別設定上右下左邊距,同css
25 itemGap: 10, // 主副標題縱向間隔,單位px,默認為10,
26 textStyle: {
27 fontSize: 18,
28 fontWeight: ‘bolder’,
29 color: ‘#333’ // 主標題文字顏色
30 },
31 subtextStyle: {
32 color: ‘#aaa’ // 副標題文字顏色
33 }
34 },
35
36 // 圖例
37 legend: {
38 orient: ‘horizontal’, // 布局方式,默認為水平布局,可選為:
39 // ‘horizontal’ | ‘vertical’
40 x: ‘center’, // 水平安放位置,默認為全圖居中,可選為:
41 // ‘center’ | ‘left’ | ‘right’
42 // | {number}(x坐標,單位px)
43 y: ‘top’, // 垂直安放位置,默認為全圖頂端,可選為:
44 // ‘top’ | ‘bottom’ | ‘center’
45 // | {number}(y坐標,單位px)
46 backgroundColor: ‘rgba(0,0,0,0)’,
47 borderColor: ‘#ccc’, // 圖例邊框顏色
48 borderWidth: 0, // 圖例邊框線寬,單位px,默認為0(無邊框)
49 padding: 5, // 圖例內邊距,單位px,默認各方向內邊距為5,
50 // 接受數組分別設定上右下左邊距,同css
51 itemGap: 10, // 各個item之間的間隔,單位px,默認為10,
52 // 橫向布局時為水平間隔,縱向布局時為縱向間隔
53 itemWidth: 20, // 圖例圖形寬度
54 itemHeight: 14, // 圖例圖形高度
55 textStyle: {
56 color: ‘#333’ // 圖例文字顏色
57 }
58 },
59
60 // 值域
61 dataRange: {
62 orient: ‘vertical’, // 布局方式,默認為垂直布局,可選為:
63 // ‘horizontal’ | ‘vertical’
64 x: ‘left’, // 水平安放位置,默認為全圖左對齊,可選為:
65 // ‘center’ | ‘left’ | ‘right’
66 // | {number}(x坐標,單位px)
67 y: ‘bottom’, // 垂直安放位置,默認為全圖底部,可選為:
68 // ‘top’ | ‘bottom’ | ‘center’
69 // | {number}(y坐標,單位px)
70 backgroundColor: ‘rgba(0,0,0,0)’,
71 borderColor: ‘#ccc’, // 值域邊框顏色
72 borderWidth: 0, // 值域邊框線寬,單位px,默認為0(無邊框)
73 padding: 5, // 值域內邊距,單位px,默認各方向內邊距為5,
74 // 接受數組分別設定上右下左邊距,同css
75 itemGap: 10, // 各個item之間的間隔,單位px,默認為10,
76 // 橫向布局時為水平間隔,縱向布局時為縱向間隔
77 itemWidth: 20, // 值域圖形寬度,線性漸變水平布局寬度為該值 * 10
78 itemHeight: 14, // 值域圖形高度,線性漸變垂直布局高度為該值 * 10
79 splitNumber: 5, // 分割段數,默認為5,為0時為線性漸變
80 color:[‘#1e90ff’,’#f0ffff’],//顏色
81 //text:[‘高’,’低’], // 文本,默認為數值文本
82 textStyle: {
83 color: ‘#333’ // 值域文字顏色
84 }
85 },
86
87 toolbox: {
88 orient: ‘horizontal’, // 布局方式,默認為水平布局,可選為:
89 // ‘horizontal’ | ‘vertical’
90 x: ‘right’, // 水平安放位置,默認為全圖右對齊,可選為:
91 // ‘center’ | ‘left’ | ‘right’
92 // | {number}(x坐標,單位px)
93 y: ‘top’, // 垂直安放位置,默認為全圖頂端,可選為:
94 // ‘top’ | ‘bottom’ | ‘center’
95 // | {number}(y坐標,單位px)
96 color : [‘#1e90ff’,’#22bb22’,’#4b0082’,’#d2691e’],
97 backgroundColor: ‘rgba(0,0,0,0)’, // 工具箱背景顏色
98 borderColor: ‘#ccc’, // 工具箱邊框顏色
99 borderWidth: 0, // 工具箱邊框線寬,單位px,默認為0(無邊框)
100 padding: 5, // 工具箱內邊距,單位px,默認各方向內邊距為5,
101 // 接受數組分別設定上右下左邊距,同css
102 itemGap: 10, // 各個item之間的間隔,單位px,默認為10,
103 // 橫向布局時為水平間隔,縱向布局時為縱向間隔
104 itemSize: 16, // 工具箱圖形寬度
105 featureImageIcon : {}, // 自定義圖片icon
106 featureTitle : {
107 mark : ‘輔助線開關’,
108 markUndo : ‘刪除輔助線’,
109 markClear : ‘清空輔助線’,
110 dataZoom : ‘區域縮放’,
111 dataZoomReset : ‘區域縮放后退’,
112 dataView : ‘數據視圖’,
113 lineChart : ‘折線圖切換’,
114 barChart : ‘柱形圖切換’,
115 restore : ‘還原’,
116 saveAsImage : ‘保存為圖片’
117 }
118 },
119
120 // 提示框
121 tooltip: {
122 trigger: ‘item’, // 觸發類型,默認數據觸發,見下圖,可選為:’item’ | ‘axis’
123 showDelay: 20, // 顯示延遲,添加顯示延遲可以避免頻繁切換,單位ms
124 hideDelay: 100, // 隱藏延遲,單位ms
125 transitionDuration : 0.4, // 動畫變換時間,單位s
126 backgroundColor: ‘rgba(0,0,0,0.7)’, // 提示背景顏色,默認為透明度為0.7的黑色
127 borderColor: ‘#333’, // 提示邊框顏色
128 borderRadius: 4, // 提示邊框圓角,單位px,默認為4
129 borderWidth: 0, // 提示邊框線寬,單位px,默認為0(無邊框)
130 padding: 5, // 提示內邊距,單位px,默認各方向內邊距為5,
131 // 接受數組分別設定上右下左邊距,同css
132 axisPointer : { // 坐標軸指示器,坐標軸觸發有效
133 type : ‘line’, // 默認為直線,可選為:’line’ | ‘shadow’
134 lineStyle : { // 直線指示器樣式設置
135 color: ‘#48b’,
136 width: 2,
137 type: ‘solid’
138 },
139 shadowStyle : { // 陰影指示器樣式設置
140 width: ‘auto’, // 陰影大小
141 color: ‘rgba(150,150,150,0.3)’ // 陰影顏色
142 }
143 },
144 textStyle: {
145 color: ‘#fff’
146 }
147 },
148
149 // 區域縮放控制器
150 dataZoom: {
151 orient: ‘horizontal’, // 布局方式,默認為水平布局,可選為:
152 // ‘horizontal’ | ‘vertical’
153 // x: {number}, // 水平安放位置,默認為根據grid參數適配,可選為:
154 // {number}(x坐標,單位px)
155 // y: {number}, // 垂直安放位置,默認為根據grid參數適配,可選為:
156 // {number}(y坐標,單位px)
157 // width: {number}, // 指定寬度,橫向布局時默認為根據grid參數適配
158 // height: {number}, // 指定高度,縱向布局時默認為根據grid參數適配
159 backgroundColor: ‘rgba(0,0,0,0)’, // 背景顏色
160 dataBackgroundColor: ‘#eee’, // 數據背景顏色
161 fillerColor: ‘rgba(144,197,237,0.2)’, // 填充顏色
162 handleColor: ‘rgba(70,130,180,0.8)’ // 手柄顏色
163 },
164
165 // 網格
166 grid: {
167 x: 80,
168 y: 60,
169 x2: 80,
170 y2: 60,
171 // width: {totalWidth} - x - x2,
172 // height: {totalHeight} - y - y2,
173 backgroundColor: ‘rgba(0,0,0,0)’,
174 borderWidth: 1,
175 borderColor: ‘#ccc’
176 },
177
178 // 類目軸
179 categoryAxis: {
180 position: ‘bottom’, // 位置
181 nameLocation: ‘end’, // 坐標軸名字位置,支持’start’ | ‘end’
182 boundaryGap: true, // 類目起始和結束兩端空白策略
183 axisLine: { // 坐標軸線
184 show: true, // 默認顯示,屬性show控制顯示與否
185 lineStyle: { // 屬性lineStyle控制線條樣式
186 color: ‘#48b’,
187 width: 2,
188 type: ‘solid’
189 }
190 },
191 axisTick: { // 坐標軸小標記
192 show: true, // 屬性show控制顯示與否,默認不顯示
193 interval: ‘auto’,
194 // onGap: null,
195 inside : false, // 控制小標記是否在grid里
196 length :5, // 屬性length控制線長
197 lineStyle: { // 屬性lineStyle控制線條樣式
198 color: ‘#333’,
199 width: 1
200 }
201 },
202 axisLabel: { // 坐標軸文本標簽,詳見axis.axisLabel
203 show: true,
204 interval: ‘auto’,
205 rotate: 0,
206 margin: 8,
207 // formatter: null,
208 textStyle: { // 其余屬性默認使用全局文本樣式,詳見TEXTSTYLE
209 color: ‘#333’
210 }
211 },
212 splitLine: { // 分隔線
213 show: true, // 默認顯示,屬性show控制顯示與否
214 // onGap: null,
215 lineStyle: { // 屬性lineStyle(詳見lineStyle)控制線條樣式
216 color: [‘#ccc’],
217 width: 1,
218 type: ‘solid’
219 }
220 },
221 splitArea: { // 分隔區域
222 show: false, // 默認不顯示,屬性show控制顯示與否
223 // onGap: null,
224 areaStyle: { // 屬性areaStyle(詳見areaStyle)控制區域樣式
225 color: [‘rgba(250,250,250,0.3)’,’rgba(200,200,200,0.3)’]
226 }
227 }
228 },
229
230 // 數值型坐標軸默認參數
231 valueAxis: {
232 position: ‘left’, // 位置
233 nameLocation: ‘end’, // 坐標軸名字位置,支持’start’ | ‘end’
234 nameTextStyle: {}, // 坐標軸文字樣式,默認取全局樣式
235 boundaryGap: [0, 0], // 數值起始和結束兩端空白策略
236 splitNumber: 5, // 分割段數,默認為5
237 axisLine: { // 坐標軸線
238 show: true, // 默認顯示,屬性show控制顯示與否
239 lineStyle: { // 屬性lineStyle控制線條樣式
240 color: ‘#48b’,
241 width: 2,
242 type: ‘solid’
243 }
244 },
245 axisTick: { // 坐標軸小標記
246 show: false, // 屬性show控制顯示與否,默認不顯示
247 inside : false, // 控制小標記是否在grid里
248 length :5, // 屬性length控制線長
249 lineStyle: { // 屬性lineStyle控制線條樣式
250 color: ‘#333’,
251 width: 1
252 }
253 },
254 axisLabel: { // 坐標軸文本標簽,詳見axis.axisLabel
255 show: true,
256 rotate: 0,
257 margin: 8,
258 // formatter: null,
259 textStyle: { // 其余屬性默認使用全局文本樣式,詳見TEXTSTYLE
260 color: ‘#333’
261 }
262 },
263 splitLine: { // 分隔線
264 show: true, // 默認顯示,屬性show控制顯示與否
265 lineStyle: { // 屬性lineStyle(詳見lineStyle)控制線條樣式
266 color: [‘#ccc’],
267 width: 1,
268 type: ‘solid’
269 }
270 },
271 splitArea: { // 分隔區域
272 show: false, // 默認不顯示,屬性show控制顯示與否
273 areaStyle: { // 屬性areaStyle(詳見areaStyle)控制區域樣式
274 color: [‘rgba(250,250,250,0.3)’,’rgba(200,200,200,0.3)’]
275 }
276 }
277 },
278
279 polar : {
280 center : [‘50%’, ‘50%’], // 默認全局居中
281 radius : ‘75%’,
282 startAngle : 90,
283 splitNumber : 5,
284 name : {
285 show: true,
286 textStyle: { // 其余屬性默認使用全局文本樣式,詳見TEXTSTYLE
287 color: ‘#333’
288 }
289 },
290 axisLine: { // 坐標軸線
291 show: true, // 默認顯示,屬性show控制顯示與否
292 lineStyle: { // 屬性lineStyle控制線條樣式
293 color: ‘#ccc’,
294 width: 1,
295 type: ‘solid’
296 }
297 },
298 axisLabel: { // 坐標軸文本標簽,詳見axis.axisLabel
299 show: false,
300 textStyle: { // 其余屬性默認使用全局文本樣式,詳見TEXTSTYLE
301 color: ‘#333’
302 }
303 },
304 splitArea : {
305 show : true,
306 areaStyle : {
307 color: [‘rgba(250,250,250,0.3)’,’rgba(200,200,200,0.3)’]
308 }
309 },
310 splitLine : {
311 show : true,
312 lineStyle : {
313 width : 1,
314 color : ‘#ccc’
315 }
316 }
317 },
318
319 // 柱形圖默認參數
320 bar: {
321 barMinHeight: 0, // 最小高度改為0
322 // barWidth: null, // 默認自適應
323 barGap: ‘30%’, // 柱間距離,默認為柱形寬度的30%,可設固定值
324 barCategoryGap : ‘20%’, // 類目間柱形距離,默認為類目間距的20%,可設固定值
325 itemStyle: {
326 normal: {
327 // color: ‘各異’,
328 barBorderColor: ‘#fff’, // 柱條邊線
329 barBorderRadius: 0, // 柱條邊線圓角,單位px,默認為0
330 barBorderWidth: 1, // 柱條邊線線寬,單位px,默認為1
331 label: {
332 show: false
333 // position: 默認自適應,水平布局為’top’,垂直布局為’right’,可選為
334 // ‘inside’|’left’|’right’|’top’|’bottom’
335 // textStyle: null // 默認使用全局文本樣式,詳見TEXTSTYLE
336 }
337 },
338 emphasis: {
339 // color: ‘各異’,
340 barBorderColor: ‘rgba(0,0,0,0)’, // 柱條邊線
341 barBorderRadius: 0, // 柱條邊線圓角,單位px,默認為0
342 barBorderWidth: 1, // 柱條邊線線寬,單位px,默認為1
343 label: {
344 show: false
345 // position: 默認自適應,水平布局為’top’,垂直布局為’right’,可選為
346 // ‘inside’|’left’|’right’|’top’|’bottom’
347 // textStyle: null // 默認使用全局文本樣式,詳見TEXTSTYLE
348 }
349 }
350 }
351 },
352
353 // 折線圖默認參數
354 line: {
355 itemStyle: {
356 normal: {
357 // color: 各異,
358 label: {
359 show: false
360 // position: 默認自適應,水平布局為’top’,垂直布局為’right’,可選為
361 // ‘inside’|’left’|’right’|’top’|’bottom’
362 // textStyle: null // 默認使用全局文本樣式,詳見TEXTSTYLE
363 },
364 lineStyle: {
365 width: 2,
366 type: ‘solid’,
367 shadowColor : ‘rgba(0,0,0,0)’, //默認透明
368 shadowBlur: 5,
369 shadowOffsetX: 3,
370 shadowOffsetY: 3
371 }
372 },
373 emphasis: {
374 // color: 各異,
375 label: {
376 show: false
377 // position: 默認自適應,水平布局為’top’,垂直布局為’right’,可選為
378 // ‘inside’|’left’|’right’|’top’|’bottom’
379 // textStyle: null // 默認使用全局文本樣式,詳見TEXTSTYLE
380 }
381 }
382 },
383 //smooth : false,
384 //symbol: null, // 拐點圖形類型
385 symbolSize: 2, // 拐點圖形大小
386 //symbolRotate : null, // 拐點圖形旋轉控制
387 showAllSymbol: false // 標志圖形默認只有主軸顯示(隨主軸標簽間隔隱藏策略)
388 },
389
390 // K線圖默認參數
391 k: {
392 // barWidth : null // 默認自適應
393 // barMaxWidth : null // 默認自適應
394 itemStyle: {
395 normal: {
396 color: ‘#fff’, // 陽線填充顏色
397 color0: ‘#00aa11’, // 陰線填充顏色
398 lineStyle: {
399 width: 1,
400 color: ‘#ff3200’, // 陽線邊框顏色
401 color0: ‘#00aa11’ // 陰線邊框顏色
402 }
403 },
404 emphasis: {
405 // color: 各異,
406 // color0: 各異
407 }
408 }
409 },
410
411 // 散點圖默認參數
412 scatter: {
413 //symbol: null, // 圖形類型
414 symbolSize: 4, // 圖形大小,半寬(半徑)參數,當圖形為方向或菱形則總寬度為symbolSize * 2
415 //symbolRotate : null, // 圖形旋轉控制
416 large: false, // 大規模散點圖
417 largeThreshold: 2000,// 大規模閥值,large為true且數據量>largeThreshold才啟用大規模模式
418 itemStyle: {
419 normal: {
420 // color: 各異,
421 label: {
422 show: false
423 // position: 默認自適應,水平布局為’top’,垂直布局為’right’,可選為
424 // ‘inside’|’left’|’right’|’top’|’bottom’
425 // textStyle: null // 默認使用全局文本樣式,詳見TEXTSTYLE
426 }
427 },
428 emphasis: {
429 // color: ‘各異’
430 label: {
431 show: false
432 // position: 默認自適應,水平布局為’top’,垂直布局為’right’,可選為
433 // ‘inside’|’left’|’right’|’top’|’bottom’
434 // textStyle: null // 默認使用全局文本樣式,詳見TEXTSTYLE
435 }
436 }
437 }
438 },
439
440 // 雷達圖默認參數
441 radar : {
442 itemStyle: {
443 normal: {
444 // color: 各異,
445 label: {
446 show: false
447 },
448 lineStyle: {
449 width: 2,
450 type: ‘solid’
451 }
452 },
453 emphasis: {
454 // color: 各異,
455 label: {
456 show: false
457 }
458 }
459 },
460 //symbol: null, // 拐點圖形類型
461 symbolSize: 2 // 可計算特性參數,空數據拖拽提示圖形大小
462 //symbolRotate : null, // 圖形旋轉控制
463 },
464
465 // 餅圖默認參數
466 pie: {
467 center : [‘50%’, ‘50%’], // 默認全局居中
468 radius : [0, ‘75%’],
469 clockWise : false, // 默認逆時針
470 startAngle: 90,
471 minAngle: 0, // 最小角度改為0
472 selectedOffset: 10, // 選中是扇區偏移量
473 itemStyle: {
474 normal: {
475 // color: 各異,
476 borderColor: ‘#fff’,
477 borderWidth: 1,
478 label: {
479 show: true,
480 position: ‘outer’
481 // textStyle: null // 默認使用全局文本樣式,詳見TEXTSTYLE
482 },
483 labelLine: {
484 show: true,
485 length: 20,
486 lineStyle: {
487 // color: 各異,
488 width: 1,
489 type: ‘solid’
490 }
491 }
492 },
493 emphasis: {
494 // color: 各異,
495 borderColor: ‘rgba(0,0,0,0)’,
496 borderWidth: 1,
497 label: {
498 show: false
499 // position: ‘outer’
500 // textStyle: null // 默認使用全局文本樣式,詳見TEXTSTYLE
501 },
502 labelLine: {
503 show: false,
504 length: 20,
505 lineStyle: {
506 // color: 各異,
507 width: 1,
508 type: ‘solid’
509 }
510 }
511 }
512 }
513 },
514
515 map: {
516 mapType: ‘china’, // 各省的mapType暫時都用中文
517 mapLocation: {
518 x : ‘center’,
519 y : ‘center’
520 // width // 自適應
521 // height // 自適應
522 },
523 showLegendSymbol : true, // 顯示圖例顏色標識(系列標識的小圓點),存在legend時生效
524 itemStyle: {
525 normal: {
526 // color: 各異,
527 borderColor: ‘#fff’,
528 borderWidth: 1,
529 areaStyle: {
530 color: ‘#ccc’//rgba(135,206,250,0.8)
531 },
532 label: {
533 show: false,
534 textStyle: {
535 color: ‘rgba(139,69,19,1)’
536 }
537 }
538 },
539 emphasis: { // 也是選中樣式
540 // color: 各異,
541 borderColor: ‘rgba(0,0,0,0)’,
542 borderWidth: 1,
543 areaStyle: {
544 color: ‘rgba(255,215,0,0.8)’
545 },
546 label: {
547 show: false,
548 textStyle: {
549 color: ‘rgba(139,69,19,1)’
550 }
551 }
552 }
553 }
554 },
555
556 force : {
557 // 數據map到圓的半徑的最小值和最大值
558 minRadius : 10,
559 maxRadius : 20,
560 density : 1.0,
561 attractiveness : 1.0,
562 // 初始化的隨機大小位置
563 initSize : 300,
564 // 向心力因子,越大向心力越大
565 centripetal : 1,
566 // 冷卻因子
567 coolDown : 0.99,
568 // 分類里如果有樣式會覆蓋節點默認樣式
569 itemStyle: {
570 normal: {
571 // color: 各異,
572 label: {
573 show: false
574 // textStyle: null // 默認使用全局文本樣式,詳見TEXTSTYLE
575 },
576 nodeStyle : {
577 brushType : ‘both’,
578 color : ‘#f08c2e’,
579 strokeColor : ‘#5182ab’
580 },
581 linkStyle : {
582 strokeColor : ‘#5182ab’
583 }
584 },
585 emphasis: {
586 // color: 各異,
587 label: {
588 show: false
589 // textStyle: null // 默認使用全局文本樣式,詳見TEXTSTYLE
590 },
591 nodeStyle : {},
592 linkStyle : {}
593 }
594 }
595 },
596
597 chord : {
598 radius : [‘65%’, ‘75%’],
599 center : [‘50%’, ‘50%’],
600 padding : 2,
601 sort : ‘none’, // can be ‘none’, ‘ascending’, ‘descending’
602 sortSub : ‘none’, // can be ‘none’, ‘ascending’, ‘descending’
603 startAngle : 90,
604 clockWise : false,
605 showScale : false,
606 showScaleText : false,
607 itemStyle : {
608 normal : {
609 label : {
610 show : true
611 // textStyle: null // 默認使用全局文本樣式,詳見TEXTSTYLE
612 },
613 lineStyle : {
614 width : 0,
615 color : ‘#000’
616 },
617 chordStyle : {
618 lineStyle : {
619 width : 1,
620 color : ‘#666’
621 }
622 }
623 },
624 emphasis : {
625 lineStyle : {
626 width : 0,
627 color : ‘#000’
628 },
629 chordStyle : {
630 lineStyle : {
631 width : 2,
632 color : ‘#333’
633 }
634 }
635 }
636 }
637 },
638
639 island: {
640 r: 15,
641 calculateStep: 0.1 // 滾輪可計算步長 0.1 = 10%
642 },
643
644 markPoint : {
645 symbol: ‘pin’, // 標注類型
646 symbolSize: 10, // 標注大小,半寬(半徑)參數,當圖形為方向或菱形則總寬度為symbolSize * 2
647 //symbolRotate : null, // 標注旋轉控制
648 itemStyle: {
649 normal: {
650 // color: 各異,
651 // borderColor: 各異, // 標注邊線顏色,優先於color
652 borderWidth: 2, // 標注邊線線寬,單位px,默認為1
653 label: {
654 show: true,
655 position: ‘inside’ // 可選為’left’|’right’|’top’|’bottom’
656 // textStyle: null // 默認使用全局文本樣式,詳見TEXTSTYLE
657 }
658 },
659 emphasis: {
660 // color: 各異
661 label: {
662 show: true
663 // position: ‘inside’ // ‘left’|’right’|’top’|’bottom’
664 // textStyle: null // 默認使用全局文本樣式,詳見TEXTSTYLE
665 }
666 }
667 }
668 },
669
670 markLine : {
671 // 標線起始和結束的symbol介紹類型,如果都一樣,可以直接傳string
672 symbol: [‘circle’, ‘arrow’],
673 // 標線起始和結束的symbol大小,半寬(半徑)參數,當圖形為方向或菱形則總寬度為symbolSize * 2
674 symbolSize: [2, 4],
675 // 標線起始和結束的symbol旋轉控制
676 //symbolRotate : null,
677 itemStyle: {
678 normal: {
679 // color: 各異, // 標線主色,線色,symbol主色
680 // borderColor: 隨color, // 標線symbol邊框顏色,優先於color
681 borderWidth: 2, // 標線symbol邊框線寬,單位px,默認為2
682 label: {
683 show: false,
684 // 可選為 ‘start’|’end’|’left’|’right’|’top’|’bottom’
685 position: ‘inside’,
686 textStyle: { // 默認使用全局文本樣式,詳見TEXTSTYLE
687 color: ‘#333’
688 }
689 },
690 lineStyle: {
691 // color: 隨borderColor, // 主色,線色,優先級高於borderColor和color
692 // width: 隨borderWidth, // 優先於borderWidth
693 type: ‘solid’,
694 shadowColor : ‘rgba(0,0,0,0)’, //默認透明
695 shadowBlur: 5,
696 shadowOffsetX: 3,
697 shadowOffsetY: 3
698 }
699 },
700 emphasis: {
701 // color: 各異
702 label: {
703 show: false
704 // position: ‘inside’ // ‘left’|’right’|’top’|’bottom’
705 // textStyle: null // 默認使用全局文本樣式,詳見TEXTSTYLE
706 },
707 lineStyle : {}
708 }
709 }
710 },
711
712 textStyle: {
713 decoration: ‘none’,
714 fontFamily: ‘Arial, Verdana, sans-serif’,
715 fontFamily2: ‘微軟雅黑’, // IE8- 字體模糊並且不支持不同字體混排,額外指定一份
716 fontSize: 12,
717 fontStyle: ‘normal’,
718 fontWeight: ‘normal’
719 },
720
721 // 默認標志圖形類型列表
722 symbolList : [
723 ‘circle’, ‘rectangle’, ‘triangle’, ‘diamond’,
724 ‘emptyCircle’, ‘emptyRectangle’, ‘emptyTriangle’, ‘emptyDiamond’
725 ],
726 loadingText : ‘Loading…’,
727 // 可計算特性配置,孤島,提示顏色
728 calculable: false, // 默認關閉可計算特性
729 calculableColor: ‘rgba(255,165,0,0.6)’, // 拖拽提示邊框顏色
730 calculableHolderColor: ‘#ccc’, // 可計算占位提示顏色
731 nameConnector: ’ & ‘,
732 valueConnector: ’ : ‘,
733 animation: true,
734 animationThreshold: 2500, // 動畫元素閥值,產生的圖形原素超過2500不出動畫
735 addDataAnimation: true, // 動態數據接口是否開啟動畫效果
736 animationDuration: 2000,
737 animationEasing: ‘ExponentialOut’ //BounceOut
738 }


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM