config-ucharts.js 27 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240
  1. /*
  2. * uCharts®
  3. * 高性能跨平台图表库,支持H5、APP、小程序(微信/支付宝/百度/头条/QQ/360)、Vue、Taro等支持canvas的框架平台
  4. * Copyright (c) 2021 QIUN®秋云 https://www.ucharts.cn All rights reserved.
  5. * Licensed ( http://www.apache.org/licenses/LICENSE-2.0 )
  6. * 复制使用请保留本段注释,感谢支持开源!
  7. *
  8. * uCharts®官方网站
  9. * https://www.uCharts.cn
  10. *
  11. * 开源地址:
  12. * https://gitee.com/uCharts/uCharts
  13. *
  14. * uni-app插件市场地址:
  15. * http://ext.dcloud.net.cn/plugin?id=271
  16. *
  17. */
  18. // 主题颜色配置:如每个图表类型需要不同主题,请在对应图表类型上更改color属性
  19. const color = ['#1890FF', '#91CB74', '#FAC858', '#EE6666', '#73C0DE', '#3CA272', '#FC8452', '#9A60B4', '#ea7ccc'];
  20. //事件转换函数,主要用作格式化x轴为时间轴,根据需求自行修改
  21. const formatDateTime = (timeStamp, returnType) => {
  22. var date = new Date();
  23. date.setTime(timeStamp * 1000);
  24. var y = date.getFullYear();
  25. var m = date.getMonth() + 1;
  26. m = m < 10 ? ('0' + m) : m;
  27. var d = date.getDate();
  28. d = d < 10 ? ('0' + d) : d;
  29. var h = date.getHours();
  30. h = h < 10 ? ('0' + h) : h;
  31. var minute = date.getMinutes();
  32. var second = date.getSeconds();
  33. minute = minute < 10 ? ('0' + minute) : minute;
  34. second = second < 10 ? ('0' + second) : second;
  35. if (returnType == 'full') {
  36. return y + '-' + m + '-' + d + ' ' + h + ':' + minute + ':' + second;
  37. }
  38. if (returnType == 'y-m-d') {
  39. return y + '-' + m + '-' + d;
  40. }
  41. if (returnType == 'h:m') {
  42. return h + ':' + minute;
  43. }
  44. if (returnType == 'h:m:s') {
  45. return h + ':' + minute + ':' + second;
  46. }
  47. return [y, m, d, h, minute, second];
  48. }
  49. const cfu = {
  50. //demotype为自定义图表类型,一般不需要自定义图表类型,只需要改根节点上对应的类型即可
  51. "type": ["pie", "ring", "rose", "word", "funnel", "map", "arcbar", "line", "column", "bar", "area", "radar",
  52. "gauge", "candle", "mix", "tline", "tarea", "scatter", "bubble", "demotype", "mainline","mainradar"],
  53. "range": ["饼状图", "圆环图", "玫瑰图", "词云图", "漏斗图", "地图", "圆弧进度条", "折线图", "柱状图", "条状图", "区域图", "雷达图", "仪表盘", "K线图",
  54. "混合图", "时间轴折线", "时间轴区域", "散点图", "气泡图", "自定义类型", "首页趋势图", "首页雷达图"],
  55. //增加自定义图表类型,如果需要categories,请在这里加入您的图表类型,例如最后的"demotype"
  56. //自定义类型时需要注意"tline","tarea","scatter","bubble"等时间轴(矢量x轴)类图表,没有categories,不需要加入categories
  57. "categories": ["line", "column", "bar", "area", "radar", "gauge", "candle", "mix", "demotype", "mainline", "mainradar"],
  58. //instance为实例变量承载属性,不要删除
  59. "instance": {},
  60. //option为opts及eopts承载属性,不要删除
  61. "option": {},
  62. //下面是自定义format配置,因除H5端外的其他端无法通过props传递函数,只能通过此属性对应下标的方式来替换
  63. "formatter": {
  64. "yAxisDemo1": function(val) {
  65. return val + '元'
  66. },
  67. "yAxisDemo2": function(val) {
  68. return val.toFixed(2)
  69. },
  70. "xAxisDemo1": function(val) {
  71. return val + '年'
  72. },
  73. "xAxisDemo2": function(val) {
  74. return formatDateTime(val, 'h:m')
  75. },
  76. "seriesDemo1": function(val) {
  77. return val + '元'
  78. },
  79. "tooltipDemo1": function(item, category, index, opts) {
  80. if (index == 0) {
  81. return '随便用' + item.data + '年'
  82. } else {
  83. return '其他我没改' + item.data + '天'
  84. }
  85. },
  86. "pieDemo": function(val, index, series) {
  87. if (index !== undefined) {
  88. return series[index].name + ':' + series[index].data + '元'
  89. }
  90. },
  91. },
  92. //这里演示了自定义您的图表类型的option,可以随意命名,之后在组件上 type="demotype" 后,组件会调用这个花括号里的option,如果组件上还存在opts参数,会将demotype与opts中option合并后渲染图表。
  93. "demotype": {
  94. //我这里把曲线图当做了自定义图表类型,您可以根据需要随意指定类型或配置
  95. "type": "line",
  96. "color": color,
  97. "padding": [15, 10, 0, 15],
  98. "xAxis": {
  99. "disableGrid": true,
  100. },
  101. "yAxis": {
  102. "gridType": "dash",
  103. "dashLength": 2,
  104. },
  105. "legend": {},
  106. "extra": {
  107. "line": {
  108. "type": "curve",
  109. "width": 2
  110. },
  111. }
  112. },
  113. //下面是自定义配置,请添加项目所需的通用配置
  114. "pie": {
  115. "type": "pie",
  116. "color": color,
  117. "padding": [5, 5, 5, 5],
  118. "extra": {
  119. "pie": {
  120. "activeOpacity": 0.5,
  121. "activeRadius": 10,
  122. "offsetAngle": 0,
  123. "labelWidth": 15,
  124. "border": true,
  125. "borderWidth": 3,
  126. "borderColor": "#FFFFFF"
  127. },
  128. }
  129. },
  130. "ring": {
  131. "type": "ring",
  132. "color": color,
  133. "padding": [5, 5, 5, 5],
  134. "rotate": false,
  135. "dataLabel": true,
  136. "legend": {
  137. "show": true,
  138. "position": "right",
  139. "lineHeight": 25,
  140. },
  141. "title": {
  142. "name": "收益率",
  143. "fontSize": 15,
  144. "color": "#666666"
  145. },
  146. "subtitle": {
  147. "name": "70%",
  148. "fontSize": 25,
  149. "color": "#7cb5ec"
  150. },
  151. "extra": {
  152. "ring": {
  153. "ringWidth": 30,
  154. "activeOpacity": 0.5,
  155. "activeRadius": 10,
  156. "offsetAngle": 0,
  157. "labelWidth": 15,
  158. "border": true,
  159. "borderWidth": 3,
  160. "borderColor": "#FFFFFF"
  161. },
  162. },
  163. },
  164. "rose": {
  165. "type": "rose",
  166. "color": color,
  167. "padding": [5, 5, 5, 5],
  168. "legend": {
  169. "show": true,
  170. "position": "left",
  171. "lineHeight": 25,
  172. },
  173. "extra": {
  174. "rose": {
  175. "type": "area",
  176. "minRadius": 50,
  177. "activeOpacity": 0.5,
  178. "activeRadius": 10,
  179. "offsetAngle": 0,
  180. "labelWidth": 15,
  181. "border": false,
  182. "borderWidth": 2,
  183. "borderColor": "#FFFFFF"
  184. },
  185. }
  186. },
  187. "word": {
  188. "type": "word",
  189. "color": color,
  190. "extra": {
  191. "word": {
  192. "type": "normal",
  193. "autoColors": false
  194. }
  195. }
  196. },
  197. "funnel": {
  198. "type": "funnel",
  199. "color": color,
  200. "padding": [15, 15, 0, 15],
  201. "extra": {
  202. "funnel": {
  203. "activeOpacity": 0.3,
  204. "activeWidth": 10,
  205. "border": true,
  206. "borderWidth": 2,
  207. "borderColor": "#FFFFFF",
  208. "fillOpacity": 1,
  209. "labelAlign": "right"
  210. },
  211. }
  212. },
  213. "map": {
  214. "type": "map",
  215. "color": color,
  216. "padding": [0, 0, 0, 0],
  217. "dataLabel": true,
  218. "extra": {
  219. "map": {
  220. "border": true,
  221. "borderWidth": 1,
  222. "borderColor": "#666666",
  223. "fillOpacity": 0.6,
  224. "activeBorderColor": "#F04864",
  225. "activeFillColor": "#FACC14",
  226. "activeFillOpacity": 1
  227. },
  228. }
  229. },
  230. "arcbar": {
  231. "type": "arcbar",
  232. "color": color,
  233. "title": {
  234. "name": "百分比",
  235. "fontSize": 25,
  236. "color": "#00FF00"
  237. },
  238. "subtitle": {
  239. "name": "默认标题",
  240. "fontSize": 15,
  241. "color": "#666666"
  242. },
  243. "extra": {
  244. "arcbar": {
  245. "type": "default",
  246. "width": 12,
  247. "backgroundColor": "#E9E9E9",
  248. "startAngle": 0.75,
  249. "endAngle": 0.25,
  250. "gap": 2
  251. }
  252. }
  253. },
  254. "line": {
  255. "type": "line",
  256. "canvasId": "",
  257. "canvas2d": false,
  258. "background": "none",
  259. "animation": true,
  260. "timing": "easeOut",
  261. "duration": 1000,
  262. "color": [
  263. "#0052d4",
  264. "#ff5959",
  265. "#f9b248"
  266. ],
  267. "padding": [
  268. 1,
  269. 10,
  270. 8,
  271. 3
  272. ],
  273. "rotate": false,
  274. "errorReload": true,
  275. "fontSize": 12,
  276. "fontColor": "#696969",
  277. "enableScroll": false,
  278. "touchMoveLimit": 60,
  279. "enableMarkLine": true,
  280. "dataLabel": true,
  281. "dataPointShape": true,
  282. "dataPointShapeType": "solid",
  283. "tapLegend": true,
  284. "xAxis": {
  285. "disabled": false,
  286. "axisLine": true,
  287. "axisLineColor": "#CCCCCC",
  288. "calibration": false,
  289. "fontColor": "#696969",
  290. "fontSize": 12,
  291. "rotateLabel": false,
  292. "labelCount": 6,
  293. "itemCount": 5,
  294. "boundaryGap": "center",
  295. "disableGrid": true,
  296. "gridColor": "#696969",
  297. "gridType": "solid",
  298. "dashLength": 4,
  299. "gridEval": 1,
  300. "scrollShow": false,
  301. "scrollAlign": "left",
  302. "scrollColor": "#F5F5F5",
  303. "scrollBackgroundColor": "#D3D3D3",
  304. "format": ""
  305. },
  306. "yAxis": {
  307. "disabled": false,
  308. "disableGrid": false,
  309. "splitNumber": 5,
  310. "gridType": "dash",
  311. "dashLength": 10,
  312. "gridColor": "#CCCCCC",
  313. "padding": 10,
  314. "showTitle": false,
  315. "data": []
  316. },
  317. "legend": {
  318. "show": true,
  319. "position": "top",
  320. "float": "right",
  321. "padding": 5,
  322. "margin": 15,
  323. "backgroundColor": "rgba(0,0,0,0)",
  324. "borderColor": "rgba(0,0,0,0)",
  325. "borderWidth": 0,
  326. "fontSize": 12,
  327. "fontColor": "#696969",
  328. "lineHeight": 10,
  329. "hiddenColor": "#CECECE",
  330. "itemGap": 10
  331. },
  332. "extra": {
  333. "line": {
  334. "type": "curve",
  335. "width": 2
  336. },
  337. "tooltip": {
  338. "showBox": true,
  339. "showArrow": false,
  340. "showCategory": false,
  341. "borderWidth": 0,
  342. "borderRadius": 6,
  343. "borderColor": "#000000",
  344. "borderOpacity": 0.5,
  345. "bgColor": "#000000",
  346. "bgOpacity": 0.5,
  347. "gridType": "dash",
  348. "dashLength": 8,
  349. "gridColor": "#CCCCCC",
  350. "fontColor": "#FFFFFF",
  351. "splitLine": true,
  352. "horizentalLine": false,
  353. "xAxisLabel": false,
  354. "yAxisLabel": false,
  355. "labelBgColor": "#FFFFFF",
  356. "labelBgOpacity": 0.7,
  357. "labelFontColor": "#666666"
  358. },
  359. "markLine": {
  360. "type": "dash",
  361. "dashLength": 8,
  362. "data": []
  363. }
  364. }
  365. },
  366. "tline": {
  367. "type": "line",
  368. "color": color,
  369. "padding": [15, 10, 0, 15],
  370. "xAxis": {
  371. "disableGrid": false,
  372. "boundaryGap": "justify",
  373. },
  374. "yAxis": {
  375. "gridType": "dash",
  376. "dashLength": 2,
  377. "data": [{
  378. "min": 0,
  379. "max": 80
  380. }]
  381. },
  382. "legend": {},
  383. "extra": {
  384. "line": {
  385. "type": "curve",
  386. "width": 2
  387. },
  388. }
  389. },
  390. "tarea": {
  391. "type": "area",
  392. "color": color,
  393. "padding": [15, 10, 0, 15],
  394. "xAxis": {
  395. "disableGrid": true,
  396. "boundaryGap": "justify",
  397. },
  398. "yAxis": {
  399. "gridType": "dash",
  400. "dashLength": 2,
  401. "data": [{
  402. "min": 0,
  403. "max": 80
  404. }]
  405. },
  406. "legend": {},
  407. "extra": {
  408. "area": {
  409. "type": "curve",
  410. "opacity": 0.2,
  411. "addLine": true,
  412. "width": 2,
  413. "gradient": true
  414. },
  415. }
  416. },
  417. "column": {
  418. "type": "column",
  419. "canvasId": "",
  420. "canvas2d": false,
  421. "background": "none",
  422. "animation": true,
  423. "timing": "easeOut",
  424. "duration": 1000,
  425. "color": [
  426. "#0052d4",
  427. "#ff5959",
  428. "#f9b248"
  429. ],
  430. "padding": [
  431. 1,
  432. 10,
  433. 8,
  434. 3
  435. ],
  436. "rotate": false,
  437. "errorReload": true,
  438. "fontSize": 12,
  439. "fontColor": "#696969",
  440. "enableScroll": false,
  441. "touchMoveLimit": 60,
  442. "enableMarkLine": true,
  443. "dataLabel": true,
  444. "dataPointShape": true,
  445. "dataPointShapeType": "solid",
  446. "tapLegend": true,
  447. "xAxis": {
  448. "disabled": false,
  449. "axisLine": true,
  450. "axisLineColor": "#CCCCCC",
  451. "calibration": false,
  452. "fontColor": "#696969",
  453. "fontSize": 12,
  454. "rotateLabel": false,
  455. "labelCount": 6,
  456. "itemCount": 5,
  457. "boundaryGap": "center",
  458. "disableGrid": true,
  459. "gridColor": "#696969",
  460. "gridType": "dash",
  461. "dashLength": 4,
  462. "gridEval": 1,
  463. "scrollShow": false,
  464. "scrollAlign": "left",
  465. "scrollColor": "#F5F5F5",
  466. "scrollBackgroundColor": "#D3D3D3",
  467. "format": ""
  468. },
  469. "yAxis": {
  470. "disabled": false,
  471. "disableGrid": false,
  472. "splitNumber": 5,
  473. "gridType": "dash",
  474. "dashLength": 10,
  475. "gridColor": "#CCCCCC",
  476. "padding": 10,
  477. "showTitle": false,
  478. "data": []
  479. },
  480. "legend": {
  481. "show": true,
  482. "position": "top",
  483. "float": "right",
  484. "padding": 5,
  485. "margin": 15,
  486. "backgroundColor": "rgba(0,0,0,0)",
  487. "borderColor": "rgba(0,0,0,0)",
  488. "borderWidth": 0,
  489. "fontSize": 12,
  490. "fontColor": "#696969",
  491. "lineHeight": 10,
  492. "hiddenColor": "#CECECE",
  493. "itemGap": 10
  494. },
  495. "extra": {
  496. "column": {
  497. "type": "group",
  498. "width": 17,
  499. "seriesGap": 2,
  500. "categoryGap": 3,
  501. "barBorderCircle": false,
  502. "barBorderRadius": [
  503. 5,
  504. 5,
  505. 5,
  506. 5
  507. ],
  508. "linearType": "none",
  509. "linearOpacity": 1,
  510. "customColor": [
  511. "#0052d4",
  512. "#4364f7",
  513. "#6fb1fc",
  514. "#f5f5f5"
  515. ],
  516. "colorStop": 0,
  517. "meterBorder": 1,
  518. "meterFillColor": "#FFFFFF",
  519. "activeBgColor": "#000000",
  520. "activeBgOpacity": 0.05,
  521. "meterBorde": 1
  522. },
  523. "tooltip": {
  524. "showBox": true,
  525. "showArrow": false,
  526. "showCategory": false,
  527. "borderWidth": 0,
  528. "borderRadius": 6,
  529. "borderColor": "#000000",
  530. "borderOpacity": 0.5,
  531. "bgColor": "#000000",
  532. "bgOpacity": 0.5,
  533. "gridType": "dash",
  534. "dashLength": 8,
  535. "gridColor": "#CCCCCC",
  536. "fontColor": "#FFFFFF",
  537. "splitLine": true,
  538. "horizentalLine": false,
  539. "xAxisLabel": false,
  540. "yAxisLabel": false,
  541. "labelBgColor": "#FFFFFF",
  542. "labelBgOpacity": 0.7,
  543. "labelFontColor": "#666666"
  544. },
  545. "markLine": {
  546. "type": "dash",
  547. "dashLength": 8,
  548. "data": []
  549. }
  550. }
  551. },
  552. "bar": {
  553. "type": "bar",
  554. "canvasId": "",
  555. "canvas2d": false,
  556. "background": "none",
  557. "animation": true,
  558. "timing": "easeOut",
  559. "duration": 1000,
  560. "color": [
  561. "#0052d4",
  562. "#20a162"
  563. ],
  564. "padding": [
  565. 1,
  566. 18,
  567. 3,
  568. 3
  569. ],
  570. "rotate": false,
  571. "errorReload": true,
  572. "fontSize": 13,
  573. "fontColor": "#696969",
  574. "enableScroll": false,
  575. "touchMoveLimit": 60,
  576. "enableMarkLine": false,
  577. "dataLabel": false,
  578. "dataPointShape": true,
  579. "dataPointShapeType": "solid",
  580. "tapLegend": true,
  581. "xAxis": {
  582. "disabled": false,
  583. "axisLine": false,
  584. "axisLineColor": "#CCCCCC",
  585. "calibration": false,
  586. "fontColor": "#696969",
  587. "fontSize": 12,
  588. "rotateLabel": false,
  589. "itemCount": 5,
  590. "boundaryGap": "justify",
  591. "disableGrid": false,
  592. "gridColor": "#CCCCCC",
  593. "gridType": "dash",
  594. "dashLength": 8,
  595. "gridEval": 1,
  596. "scrollShow": false,
  597. "scrollAlign": "left",
  598. "scrollColor": "#A6A6A6",
  599. "scrollBackgroundColor": "#EFEBEF",
  600. "min": 0,
  601. "format": ""
  602. },
  603. "yAxis": {
  604. "disabled": false,
  605. "disableGrid": false,
  606. "splitNumber": 5,
  607. "gridType": "dash",
  608. "dashLength": 8,
  609. "gridColor": "#CCCCCC",
  610. "padding": 10,
  611. "showTitle": false,
  612. "data": []
  613. },
  614. "legend": {
  615. "show": true,
  616. "position": "top",
  617. "float": "right",
  618. "padding": 5,
  619. "margin": 5,
  620. "backgroundColor": "rgba(0,0,0,0)",
  621. "borderColor": "rgba(0,0,0,0)",
  622. "borderWidth": 0,
  623. "fontSize": 12,
  624. "fontColor": "#696969",
  625. "lineHeight": 10,
  626. "hiddenColor": "#CECECE",
  627. "itemGap": 10
  628. },
  629. "extra": {
  630. "bar": {
  631. "type": "group",
  632. "width": 14,
  633. "seriesGap": 2,
  634. "categoryGap": 4,
  635. "barBorderCircle": false,
  636. "barBorderRadius": [
  637. 3,
  638. 10,
  639. 3,
  640. 3
  641. ],
  642. "linearType": "none",
  643. "linearOpacity": 1,
  644. "colorStop": 0,
  645. "activeBgColor": "#000000",
  646. "activeBgOpacity": 0.08,
  647. "meterBorde": 1,
  648. "meterFillColor": "#FFFFFF"
  649. },
  650. "tooltip": {
  651. "showBox": true,
  652. "showArrow": false,
  653. "showCategory": false,
  654. "borderWidth": 0,
  655. "borderRadius": 6,
  656. "borderColor": "#000000",
  657. "borderOpacity": 0.5,
  658. "bgColor": "#000000",
  659. "bgOpacity": 0.5,
  660. "gridType": "solid",
  661. "dashLength": 4,
  662. "gridColor": "#CCCCCC",
  663. "fontColor": "#FFFFFF",
  664. "splitLine": true,
  665. "horizentalLine": false,
  666. "xAxisLabel": false,
  667. "yAxisLabel": false,
  668. "labelBgColor": "#FFFFFF",
  669. "labelBgOpacity": 0.7,
  670. "labelFontColor": "#666666"
  671. },
  672. "markLine": {
  673. "type": "solid",
  674. "dashLength": 4,
  675. "data": []
  676. }
  677. }
  678. },
  679. "area": {
  680. "type": "area",
  681. "canvasId": "",
  682. "canvas2d": false,
  683. "background": "none",
  684. "animation": true,
  685. "timing": "easeOut",
  686. "duration": 1000,
  687. "color": [
  688. "#0052d4",
  689. "#ff5959",
  690. "#f9b248"
  691. ],
  692. "padding": [
  693. 1,
  694. 10,
  695. 8,
  696. 3
  697. ],
  698. "rotate": false,
  699. "errorReload": true,
  700. "fontSize": 13,
  701. "fontColor": "#666666",
  702. "enableScroll": false,
  703. "touchMoveLimit": 60,
  704. "enableMarkLine": true,
  705. "dataLabel": true,
  706. "dataPointShape": true,
  707. "dataPointShapeType": "solid",
  708. "tapLegend": true,
  709. "xAxis": {
  710. "disabled": false,
  711. "axisLine": true,
  712. "axisLineColor": "#CCCCCC",
  713. "calibration": false,
  714. "fontColor": "#696969",
  715. "fontSize": 12,
  716. "rotateLabel": false,
  717. "labelCount": 6,
  718. "itemCount": 5,
  719. "boundaryGap": "center",
  720. "disableGrid": true,
  721. "gridColor": "#CCCCCC",
  722. "gridType": "solid",
  723. "dashLength": 4,
  724. "gridEval": 1,
  725. "scrollShow": false,
  726. "scrollAlign": "left",
  727. "scrollColor": "#A6A6A6",
  728. "scrollBackgroundColor": "#EFEBEF",
  729. "format": ""
  730. },
  731. "yAxis": {
  732. "disabled": false,
  733. "disableGrid": false,
  734. "splitNumber": 5,
  735. "gridType": "dash",
  736. "dashLength": 10,
  737. "gridColor": "#CCCCCC",
  738. "padding": 10,
  739. "showTitle": false,
  740. "data": []
  741. },
  742. "legend": {
  743. "show": true,
  744. "position": "top",
  745. "float": "right",
  746. "padding": 5,
  747. "margin": 15,
  748. "backgroundColor": "rgba(0,0,0,0)",
  749. "borderColor": "rgba(0,0,0,0)",
  750. "borderWidth": 0,
  751. "fontSize": 12,
  752. "fontColor": "#696969",
  753. "lineHeight": 10,
  754. "hiddenColor": "#CECECE",
  755. "itemGap": 10
  756. },
  757. "extra": {
  758. "area": {
  759. "type": "straight",
  760. "opacity": 0.5,
  761. "addLine": true,
  762. "width": 2,
  763. "gradient": true
  764. },
  765. "tooltip": {
  766. "showBox": true,
  767. "showArrow": false,
  768. "showCategory": false,
  769. "borderWidth": 0,
  770. "borderRadius": 6,
  771. "borderColor": "#000000",
  772. "borderOpacity": 0.5,
  773. "bgColor": "#000000",
  774. "bgOpacity": 0.5,
  775. "gridType": "dash",
  776. "dashLength": 8,
  777. "gridColor": "#CCCCCC",
  778. "fontColor": "#FFFFFF",
  779. "splitLine": true,
  780. "horizentalLine": true,
  781. "xAxisLabel": false,
  782. "yAxisLabel": false,
  783. "labelBgColor": "#FFFFFF",
  784. "labelBgOpacity": 0.7,
  785. "labelFontColor": "#666666"
  786. },
  787. "markLine": {
  788. "type": "dash",
  789. "dashLength": 8,
  790. "data": []
  791. }
  792. }
  793. },
  794. "radar": {
  795. "type": "radar",
  796. "canvasId": "",
  797. "canvas2d": false,
  798. "background": "none",
  799. "animation": true,
  800. "timing": "easeOut",
  801. "duration": 1000,
  802. "color": [
  803. "#0052d4",
  804. "#ff5959",
  805. "#f9b248"
  806. ],
  807. "padding": [
  808. 1,
  809. 2,
  810. 2,
  811. 2
  812. ],
  813. "rotate": false,
  814. "errorReload": true,
  815. "fontSize": 13,
  816. "fontColor": "#696969",
  817. "enableScroll": false,
  818. "touchMoveLimit": 60,
  819. "enableMarkLine": false,
  820. "dataLabel": false,
  821. "dataPointShape": true,
  822. "dataPointShapeType": "solid",
  823. "tapLegend": true,
  824. "legend": {
  825. "show": true,
  826. "position": "bottom",
  827. "float": "center",
  828. "padding": 5,
  829. "margin": 5,
  830. "backgroundColor": "rgba(0,0,0,0)",
  831. "borderColor": "rgba(0,0,0,0)",
  832. "borderWidth": 0,
  833. "fontSize": 13,
  834. "fontColor": "#696969",
  835. "lineHeight": 10,
  836. "hiddenColor": "#CECECE",
  837. "itemGap": 10
  838. },
  839. "extra": {
  840. "radar": {
  841. "gridType": "circle",
  842. "gridColor": "#CCCCCC",
  843. "gridCount": 2,
  844. "labelColor": "#696969",
  845. "opacity": 0.3,
  846. "border": true,
  847. "borderWidth": 1,
  848. "max": 100
  849. },
  850. "tooltip": {
  851. "showBox": true,
  852. "showArrow": false,
  853. "showCategory": false,
  854. "borderWidth": 0,
  855. "borderRadius": 6,
  856. "borderColor": "#000000",
  857. "borderOpacity": 0.5,
  858. "bgColor": "#000000",
  859. "bgOpacity": 0.5,
  860. "gridType": "dash",
  861. "dashLength": 8,
  862. "gridColor": "#CCCCCC",
  863. "fontColor": "#FFFFFF",
  864. "splitLine": true,
  865. "horizentalLine": false,
  866. "xAxisLabel": false,
  867. "yAxisLabel": false,
  868. "labelBgColor": "#FFFFFF",
  869. "labelBgOpacity": 0.7,
  870. "labelFontColor": "#666666"
  871. }
  872. }
  873. },
  874. "gauge": {
  875. "type": "gauge",
  876. "color": color,
  877. "title": {
  878. "name": "66Km/H",
  879. "fontSize": 25,
  880. "color": "#2fc25b",
  881. "offsetY": 50
  882. },
  883. "subtitle": {
  884. "name": "实时速度",
  885. "fontSize": 15,
  886. "color": "#1890ff",
  887. "offsetY": -50
  888. },
  889. "extra": {
  890. "gauge": {
  891. "type": "default",
  892. "width": 30,
  893. "labelColor": "#666666",
  894. "startAngle": 0.75,
  895. "endAngle": 0.25,
  896. "startNumber": 0,
  897. "endNumber": 100,
  898. "labelFormat": "",
  899. "splitLine": {
  900. "fixRadius": 0,
  901. "splitNumber": 10,
  902. "width": 30,
  903. "color": "#FFFFFF",
  904. "childNumber": 5,
  905. "childWidth": 12
  906. },
  907. "pointer": {
  908. "width": 24,
  909. "color": "auto"
  910. }
  911. }
  912. }
  913. },
  914. "candle": {
  915. "type": "candle",
  916. "color": color,
  917. "padding": [15, 15, 0, 15],
  918. "enableScroll": true,
  919. "enableMarkLine": true,
  920. "dataLabel": false,
  921. "xAxis": {
  922. "labelCount": 4,
  923. "itemCount": 40,
  924. "disableGrid": true,
  925. "gridColor": "#CCCCCC",
  926. "gridType": "solid",
  927. "dashLength": 4,
  928. "scrollShow": true,
  929. "scrollAlign": "left",
  930. "scrollColor": "#A6A6A6",
  931. "scrollBackgroundColor": "#EFEBEF"
  932. },
  933. "yAxis": {},
  934. "legend": {},
  935. "extra": {
  936. "candle": {
  937. "color": {
  938. "upLine": "#f04864",
  939. "upFill": "#f04864",
  940. "downLine": "#2fc25b",
  941. "downFill": "#2fc25b"
  942. },
  943. "average": {
  944. "show": true,
  945. "name": ["MA5", "MA10", "MA30"],
  946. "day": [5, 10, 20],
  947. "color": ["#1890ff", "#2fc25b", "#facc14"]
  948. }
  949. },
  950. "markLine": {
  951. "type": "dash",
  952. "dashLength": 5,
  953. "data": [{
  954. "value": 2150,
  955. "lineColor": "#f04864",
  956. "showLabel": true
  957. },
  958. {
  959. "value": 2350,
  960. "lineColor": "#f04864",
  961. "showLabel": true
  962. }
  963. ]
  964. }
  965. }
  966. },
  967. "mix": {
  968. "type": "mix",
  969. "color": color,
  970. "padding": [15, 15, 0, 15],
  971. "xAxis": {
  972. "disableGrid": true,
  973. },
  974. "yAxis": {
  975. "disabled": false,
  976. "disableGrid": false,
  977. "splitNumber": 5,
  978. "gridType": "dash",
  979. "dashLength": 4,
  980. "gridColor": "#CCCCCC",
  981. "padding": 10,
  982. "showTitle": true,
  983. "data": []
  984. },
  985. "legend": {},
  986. "extra": {
  987. "mix": {
  988. "column": {
  989. "width": 20
  990. }
  991. },
  992. }
  993. },
  994. "scatter": {
  995. "type": "scatter",
  996. "color": color,
  997. "padding": [15, 15, 0, 15],
  998. "dataLabel": false,
  999. "xAxis": {
  1000. "disableGrid": false,
  1001. "gridType": "dash",
  1002. "splitNumber": 5,
  1003. "boundaryGap": "justify",
  1004. "min": 0
  1005. },
  1006. "yAxis": {
  1007. "disableGrid": false,
  1008. "gridType": "dash",
  1009. },
  1010. "legend": {},
  1011. "extra": {
  1012. "scatter": {},
  1013. }
  1014. },
  1015. "bubble": {
  1016. "type": "bubble",
  1017. "color": color,
  1018. "padding": [15, 15, 0, 15],
  1019. "xAxis": {
  1020. "disableGrid": false,
  1021. "gridType": "dash",
  1022. "splitNumber": 5,
  1023. "boundaryGap": "justify",
  1024. "min": 0,
  1025. "max": 250
  1026. },
  1027. "yAxis": {
  1028. "disableGrid": false,
  1029. "gridType": "dash",
  1030. "data": [{
  1031. "min": 0,
  1032. "max": 150
  1033. }]
  1034. },
  1035. "legend": {},
  1036. "extra": {
  1037. "bubble": {
  1038. "border": 2,
  1039. "opacity": 0.5,
  1040. },
  1041. }
  1042. },
  1043. "mainline": {
  1044. "type": "area",
  1045. "canvasId": "",
  1046. "canvas2d": false,
  1047. "background": "none",
  1048. "animation": true,
  1049. "timing": "easeOut",
  1050. "duration": 1000,
  1051. "color": [
  1052. "#6495ed"
  1053. ],
  1054. "padding": [
  1055. 0,
  1056. 0,
  1057. 0,
  1058. 0
  1059. ],
  1060. "rotate": false,
  1061. "errorReload": true,
  1062. "fontSize": 13,
  1063. "fontColor": "#666666",
  1064. "enableScroll": false,
  1065. "touchMoveLimit": 60,
  1066. "enableMarkLine": false,
  1067. "dataLabel": false,
  1068. "dataPointShape": false,
  1069. "dataPointShapeType": "solid",
  1070. "tapLegend": true,
  1071. "xAxis": {
  1072. "disabled": true,
  1073. "axisLine": false,
  1074. "axisLineColor": "#CCCCCC",
  1075. "calibration": false,
  1076. "fontColor": "#666666",
  1077. "fontSize": 13,
  1078. "rotateLabel": false,
  1079. "itemCount": 5,
  1080. "boundaryGap": "center",
  1081. "disableGrid": true,
  1082. "gridColor": "#CCCCCC",
  1083. "gridType": "solid",
  1084. "dashLength": 4,
  1085. "gridEval": 1,
  1086. "scrollShow": false,
  1087. "scrollAlign": "left",
  1088. "scrollColor": "#A6A6A6",
  1089. "scrollBackgroundColor": "#EFEBEF",
  1090. "format": ""
  1091. },
  1092. "yAxis": {
  1093. "disabled": true,
  1094. "disableGrid": true,
  1095. "splitNumber": 5,
  1096. "gridType": "dash",
  1097. "dashLength": 2,
  1098. "gridColor": "#CCCCCC",
  1099. "padding": 10,
  1100. "showTitle": false,
  1101. "data": []
  1102. },
  1103. "legend": {
  1104. "show": false,
  1105. "position": "bottom",
  1106. "float": "center",
  1107. "padding": 10,
  1108. "margin": 0,
  1109. "backgroundColor": "rgba(0,0,0,0)",
  1110. "borderColor": "rgba(0,0,0,0)",
  1111. "borderWidth": 0,
  1112. "fontSize": 13,
  1113. "fontColor": "#666666",
  1114. "lineHeight": 11,
  1115. "hiddenColor": "#CECECE",
  1116. "itemGap": 10
  1117. },
  1118. "extra": {
  1119. "area": {
  1120. "type": "curve",
  1121. "opacity": 1,
  1122. "addLine": true,
  1123. "width": 4,
  1124. "gradient": true
  1125. },
  1126. "tooltip": {
  1127. "showBox": true,
  1128. "showArrow": true,
  1129. "showCategory": false,
  1130. "borderWidth": 0,
  1131. "borderRadius": 5,
  1132. "borderColor": "#000000",
  1133. "borderOpacity": 0.5,
  1134. "bgColor": "#000000",
  1135. "bgOpacity": 0.5,
  1136. "gridType": "solid",
  1137. "dashLength": 4,
  1138. "gridColor": "#CCCCCC",
  1139. "fontColor": "#FFFFFF",
  1140. "splitLine": false,
  1141. "horizentalLine": false,
  1142. "xAxisLabel": false,
  1143. "yAxisLabel": false,
  1144. "labelBgColor": "#FFFFFF",
  1145. "labelBgOpacity": 0.5,
  1146. "labelFontColor": "#666666"
  1147. },
  1148. "markLine": {
  1149. "type": "solid",
  1150. "dashLength": 4,
  1151. "data": []
  1152. }
  1153. }
  1154. },
  1155. "mainradar":{
  1156. "type": "radar",
  1157. "canvasId": "",
  1158. "canvas2d": false,
  1159. "background": "none",
  1160. "animation": true,
  1161. "timing": "easeOut",
  1162. "duration": 1000,
  1163. "color": [
  1164. "#0052d4",
  1165. "#ff5959",
  1166. "#f9b248"
  1167. ],
  1168. "padding": [
  1169. 5,
  1170. 5,
  1171. 5,
  1172. 5
  1173. ],
  1174. "rotate": false,
  1175. "errorReload": true,
  1176. "fontSize": 13,
  1177. "fontColor": "#666666",
  1178. "enableScroll": false,
  1179. "touchMoveLimit": 60,
  1180. "enableMarkLine": false,
  1181. "dataLabel": false,
  1182. "dataPointShape": false,
  1183. "dataPointShapeType": "solid",
  1184. "tapLegend": true,
  1185. "legend": {
  1186. "show": false,
  1187. "position": "right",
  1188. "float": "center",
  1189. "padding": 5,
  1190. "margin": 5,
  1191. "backgroundColor": "rgba(0,0,0,0)",
  1192. "borderColor": "rgba(0,0,0,0)",
  1193. "borderWidth": 0,
  1194. "fontSize": 13,
  1195. "fontColor": "#666666",
  1196. "lineHeight": 25,
  1197. "hiddenColor": "#CECECE",
  1198. "itemGap": 10
  1199. },
  1200. "extra": {
  1201. "radar": {
  1202. "gridType": "radar",
  1203. "gridColor": "#CCCCCC",
  1204. "gridCount": 1,
  1205. "labelColor": "#f1f3f5",
  1206. "opacity": 0.2,
  1207. "border": true,
  1208. "borderWidth": 2,
  1209. "max": 100
  1210. },
  1211. "tooltip": {
  1212. "showBox": true,
  1213. "showArrow": true,
  1214. "showCategory": false,
  1215. "borderWidth": 0,
  1216. "borderRadius": 5,
  1217. "borderColor": "#000000",
  1218. "borderOpacity": 0.5,
  1219. "bgColor": "#000000",
  1220. "bgOpacity": 0.5,
  1221. "gridType": "solid",
  1222. "dashLength": 4,
  1223. "gridColor": "#CCCCCC",
  1224. "fontColor": "#FFFFFF",
  1225. "splitLine": false,
  1226. "horizentalLine": false,
  1227. "xAxisLabel": false,
  1228. "yAxisLabel": false,
  1229. "labelBgColor": "#FFFFFF",
  1230. "labelBgOpacity": 0.5,
  1231. "labelFontColor": "#666666"
  1232. }
  1233. }
  1234. }
  1235. }
  1236. export default cfu;