window.$website = { isDemo: false, isDemoTip: '演示环境不允许操作', title: '数据大屏', name: 'WELCOME TO DATAV', subName: '可视化数据大屏(演示环境-请勿放生产数据)', url: '', autoSave: false, autoSaveTime: 60000, tabsList: [0, 1, 2, 3, 4, 5, 6], componentsList: [{ name: 'test', component: 'testComponents', option: 'testOption', data: true }], baseList: [{ label: '图表', icon: 'icon-bar', children: [{ label: '通用型', option: { name: '通用型', title: '通用型', icon: 'icon-bar', img: '/datav/img/assets/text5.png', dataType: 1, 'dataMethod': 'get', data: { 'categories': [ '苹果', '三星', '小米', 'oppo', 'vivo' ], 'series': [{ name: '手机品牌', data: [ 1000879, 3400879, 2300879, 5400879, 3400879 ] }] }, echartFormatter: "(data,params)=>{\nconsole.log(data);\nreturn {\n title: {\n\t\t\t\t textStyle: {\n\t\t\t\t\tfontWeight: 'normal', \n\t\t\t\t\tcolor: '#fff'\n\t\t\t\t},\n text: 'ECharts 入门示例'\n },\n tooltip: {},\n legend: {\n data:['销量'],\n\t\t\t\ttextStyle: {\n\t\t\t\t\tfontWeight: 'normal', \n\t\t\t\t\tcolor: '#fff'\n\t\t\t\t},\n },\n xAxis: {\n data: [\'衬衫\',\'羊毛衫\',\'雪纺衫\',\'裤子\',\'高跟鞋\',\'袜子\']\n },\n yAxis: {},\n series: [{\n name: '销量',\n type: 'bar',\n data: [5, 20, 36, 10, 10, 20]\n }]\n };\n}", dataFormatter: '', stylesFormatter: '', 'url': '/bar', component: { width: 600, height: 300, name: 'common', prop: 'common' } } }, { label: 'datav', option: { name: 'datav', title: 'datav', icon: 'icon-datav', img: '/datav/img/assets/text6.png', dataType: 0, 'dataMethod': 'get', data: { value: 66 }, dataFormatter: '', echartFormatter: '(data,params)=>{\n console.log(data);\n return {\n config:{\n\t data: [66] \n\t }\n }\n}', component: { width: 150, height: 200, name: 'datav', prop: 'datav' }, option: { is: 'dv-water-level-pond' } } }, { label: '柱形图', option: { name: '柱状图', title: '柱状图', icon: 'icon-bar', img: '/datav/img/assets/bar.png', data: { categories: [ '苹果', '三星', '小米', 'oppo', 'vivo' ], series: [{ name: '手机品牌', data: [ 1000879, 3400879, 2300879, 5400879, 3400879 ] }] }, dataType: 0, dataFormatter: '', stylesFormatter: '', component: { width: 600, height: 300, name: 'bar', prop: 'bar' }, option: { gridX: 90, gridY: 47, gridX2: 43, gridY2: 25, legend: true, tipShow: true, xAxisShow: true, yAxisShow: true, barWidth: 30, barRadius: 8, barColor: [{ color1: '#83bff6', color2: '#188df0', postion: 90 }, { color1: '#23B7E5', color2: '#564AA3', postion: 50 }], barMinHeight: 2 } } }, { label: '折线图', option: { name: '折线图', title: '折线图', icon: 'icon-line', img: '/datav/img/assets/line.png', data: { categories: [ '苹果', '三星', '小米', 'oppo', 'vivo' ], series: [{ name: '手机品牌', data: [ 1000879, 3400879, 2300879, 5400879, 3400879 ] }] }, dataType: 0, dataFormatter: '', stylesFormatter: '', component: { width: 600, height: 300, name: 'line', prop: 'line' }, option: { gridX: 84, gridY: 35, gridX2: 26, gridY2: 31, legend: true, tipShow: true, xAxisShow: true, yAxisShow: true, barColor: [{ color1: '#83bff6', color2: '#188df0', postion: 90 }, { color1: '#23B7E5', color2: '#564AA3', postion: 50 }], symbolShow: true, symbolSize: 6, smooth: true } } }, { label: '饼图', option: { name: '饼图', title: '饼图', icon: 'icon-pie', img: '/datav/img/assets/pie.png', data: [{ name: '苹果', value: 1000879, url: 'http://www.baidu.com' }, { name: '三星', value: 3400879, url: 'http://www.baidu.com' }, { name: '小米', value: 2300879, url: 'http://www.baidu.com' }, { name: 'oppo', value: 5400879, url: 'http://www.baidu.com' }, { name: '大疆', value: 3000, url: 'http://www.baidu.com' }], dataType: 0, dataFormatter: '', stylesFormatter: '', component: { width: 600, height: 300, name: 'pie', prop: 'pie' }, option: { legend: true, labelShow: true, barColor: [ { color1: '#83bff6' }, { color1: '#23B7E5' }, { color1: 'rgba(154, 168, 212, 1)' }, { color1: '#188df0' }, { color1: '#564AA3' } ] } } }, { label: '象形图', option: { title: '象形图', name: '象形图', icon: 'icon-pictorialBar', img: '/datav/img/assets/bar2.png', data: [{ name: '苹果', value: 1000879 }, { name: '三星', value: 3400879 }, { name: '小米', value: 2300879 }, { name: 'oppo', value: 5400879 }, { name: '大疆', value: 3000 }, { name: '抖音', value: 2000 }], dataType: 0, dataFormatter: '', stylesFormatter: '', component: { width: 600, height: 300, name: 'pictorialbar', prop: 'pictorialbar' }, option: { symbolSize: 30, split: 30, symbol: '/datav/img/source/source256.png', labelFontSize: '24', labelColor: '#4dffff', fontSize: 20, color: '#fff', gridX: 76, gridY: 4, gridX2: 127, gridY2: 0 } } }, { label: '雷达图', option: { title: '雷达图', name: '雷达图', icon: 'icon-radar', img: '/datav/img/assets/radar.png', dataType: 0, data: { indicator: [{ name: '销售', max: 6500 }, { name: '管理', max: 16000 }, { name: '信息技术', max: 30000 }, { name: '客服', max: 38000 }, { name: '研发', max: 52000 }, { name: '市场', max: 25000 } ], series: [{ data: [{ value: [4300, 10000, 28000, 35000, 50000, 19000], name: '预算分配(Allocated Budget)' }, { value: [5000, 14000, 28000, 31000, 42000, 21000], name: '实际开销(Actual Spending)' } ] }] }, dataFormatter: '', stylesFormatter: '', component: { width: 970, height: 400, name: 'radar', prop: 'radar' }, option: { width: '100%', height: 600, color: '#fff', fontSize: 18, areaOpacity: 0.3, legend: true, tipShow: true, barColor: [{ color1: '#564AA3' }, { color1: '#188df0' }] } } }, { label: '散点图', option: { title: '散点图', name: '散点图', icon: 'icon-scatter', img: '/datav/img/assets/scatter.png', dataType: 0, data: [{ data: [ [1, 8.04], [2, 6.95] ] }, { data: [ [1, 4.04], [2, 3.95] ] }], dataFormatter: '', stylesFormatter: '', component: { width: 600, height: 300, name: 'scatter', prop: 'scatter' }, option: { gridX: 26, gridY: 12, gridX2: 14, gridY2: 30, lineSize: 25, tipShow: true, labelShow: true, legend: true, xAxisSplitLineShow: true, yAxisSplitLineShow: true, barColor: [{ postion: 0.2, color1: '#91c7ae' }, { postion: 0.8, color1: '#63869e' }, { postion: 1, color1: '#c23531' }] } } }, { label: '漏斗图', option: { title: '漏斗图', name: '漏斗图', icon: 'icon-funnel', img: '/datav/img/assets/funnel.png', dataType: 0, data: [ { value: 60, name: 'Visit' }, { value: 40, name: 'Inquiry' }, { value: 20, name: 'Order' }, { value: 80, name: 'Click' }, { value: 100, name: 'Show' } ], dataFormatter: '', stylesFormatter: '', component: { width: 450, height: 350, name: 'funnel', prop: 'funnel' }, option: { legend: true, labelShow: true, tipShow: true, barColor: [{ color1: '#83bff6' }, { color1: '#23B7E5' }, { color1: 'rgba(154, 168, 212, 1)' }, { color1: '#188df0' }, { color1: '#564AA3' }] } } }, { label: '地图', option: { name: '地图', title: '地图', icon: 'icon-map', img: '/datav/img/assets/map.png', dataType: 0, data: [ { name: '测试坐标1', value: 1, lng: 118.30078125, lat: 36.91915611148194, zoom: 1 }, { name: '测试坐标2', value: 1, lng: 112.21435546875, lat: 37.965854128749434, zoom: 1 } ], formatter: "(name,data)=>{\n return '名称:'+name.data.name+name.data.value\n}", dataFormatter: '', stylesFormatter: '', component: { width: 800, height: 607, name: 'map', prop: 'map' }, option: { tipBackgroundColor: 'rgba(13, 255, 255, .5)', tipColor: 'rgba(217, 38, 10, 1)', tipFontSize: '30', borderWidth: 1, scale: 87, type: 0, borderColor: '#0dffff', areaColor: 'rgba(6, 29, 51, 0.59)', banner: true, bannerTime: 3000, fontSize: 14, zoom: 0.5, roam: true, empAreaColor: 'rgba(35, 183, 229, 0.42)', empColor: 'rgba(217, 38, 10, 1)', index: '894edc1d-d2f0-4616-962c-8e61083ada71', mapData: '', color: 'rgba(13, 255, 255, 1)' } } }, { label: '矩形图', option: { name: '矩形图', title: '矩形图', icon: 'icon-juxing', img: '/datav/img/assets/rectangle.png', data: [ { name: '分类 1', value: 560 }, { name: '分类 2', value: 500 }, { name: '分类 3', value: 150 }, { name: '分类 4', value: 140 }, { name: '分类 5', value: 115 }, { name: '分类 6', value: 95 }, { name: '分类 7', value: 90 }, { name: '分类 8', value: 75 }, { name: '分类 9', value: 98 }, { name: '分类 10', value: 60 }, { name: '分类 11', value: 45 }, { name: '分类 12', value: 40 }, { name: '分类 13', value: 40 }, { name: '分类 14', value: 35 }, { name: '分类 15', value: 40 }, { name: '分类 16', value: 40 }, { name: '分类 17', value: 40 }, { name: '分类 18', value: 30 }, { name: '分类 19', value: 28 }, { name: '分类 20', value: 16 } ], dataType: 0, component: { width: 754, height: 377, name: 'rectangle', prop: 'rectangle' }, option: { tipShow: true, labelShow: true, labelShowColor: '#fff', labelShowFontSize: 14 } } }, { label: '定时器', option: { name: '定时器', title: '定时器', icon: 'icon-datetime', img: '/datav/img/assets/time.png', echartFormatter: '(refs)=>{\n console.log(refs)\n}', component: { width: 100, height: 100, name: 'time', prop: 'time' }, option: { time: 0 } } }, { label: '自定义Vue组件', option: { name: '自定义Vue组件', title: '自定义Vue组件', icon: 'icon-bar', img: '/datav/img/assets/text4.png', dataType: 0, data: { name: 'avue' }, dataFormatter: '', stylesFormatter: '', component: { width: 800, height: 500, name: 'vue', prop: 'vue' }, option: { content: '\n\n' } } }] }, { label: '文字', icon: 'icon-text', children: [{ label: '文本框', option: { title: '文本框', name: '文本框', icon: 'icon-text', img: '/datav/img/assets/text.png', dataType: 0, dataFormatter: '', stylesFormatter: '', child: { index: [], paramName: '' }, data: { value: '文本框' }, component: { width: 100, height: 40, name: 'text', prop: 'text' }, option: { textAlign: 'center', fontSize: 26, fontWeight: 'normal', color: '#fff' } } }, { label: '跑马灯', option: { title: '跑马灯', name: '跑马灯', icon: 'icon-scroll', img: '/datav/img/assets/text2.png', top: 0, left: 0, dataType: 0, data: { value: '跑马灯' }, dataFormatter: '', stylesFormatter: '', component: { width: 100, height: 50, name: 'text', prop: 'text' }, option: { scroll: true, speed: 70, textAlign: 'center', fontSize: 26, fontWeight: 'normal', color: '#fff' } } }, { label: '超链接', option: { title: '超链接', name: '超链接', icon: 'icon-link', img: '/datav/img/assets/text3.png', top: 0, left: 0, data: { value: '超链接' }, dataType: 0, dataFormatter: '', stylesFormatter: '', component: { width: 100, height: 50, name: 'text', prop: 'text' }, option: { link: true, linkHref: 'http://avue.top', linkTarget: '_self', textAlign: 'center', fontSize: 26, fontWeight: 'normal', color: '#fff' } } }, { label: '实时时间', option: { name: '实时时间', title: '实时时间', icon: 'icon-datetime', img: '/datav/img/assets/datetime.png', top: 78, left: 1604, component: { width: 250, height: 50, name: 'datetime', prop: 'datetime' }, option: { format: 'yyyy-MM-dd hh:mm:ss', color: '#fff', textAlign: 'left', fontSize: 24, fontWeight: 'normal' } } }] }, { label: '媒体', icon: 'icon-img', children: [{ label: '图片', option: { title: '图片', name: '图片', icon: 'icon-img', img: '/datav/img/assets/img.png', top: 0, left: 0, dataType: 0, data: { value: '/datav/img/img-default.png' }, dataFormatter: '', stylesFormatter: '', component: { width: 180, height: 120, name: 'img', prop: 'img' }, option: { duration: '1000' } } }, { label: '图片框', option: { title: '图片框', name: '图片框', icon: 'icon-img', img: '/datav/img/assets/imgborder.png', top: 0, left: 0, dataType: 0, data: '/datav/img/border/border1.png', component: { width: 140, height: 140, name: 'imgborder', prop: 'imgborder' }, option: { backgroundColor: 'rgba(180, 181, 198, 0.1)' } } }, { label: '轮播图', option: { title: '轮播图', name: '轮播图', icon: 'icon-banner', img: '/datav/img/assets/swiper.png', top: 0, left: 0, dataType: 0, data: [{ value: 'https://datav/img.alicdn.com/tfs/TB1v28TC8v0gK0jSZKbXXbK2FXa-1880-640.jpg' }, { value: 'https://datav/img.alicdn.com/tfs/TB1uevcCrj1gK0jSZFuXXcrHpXa-1880-640.jpg' }, { value: 'http://www.w3school.com.cn/i/movie.ogg' }], dataFormatter: '', stylesFormatter: '', component: { width: 670, height: 370, name: 'swiper', prop: 'swiper' }, option: { type: '', interval: 5000, opacity: 100, indicator: 'none', autoplay: true, controls: true, loop: true } } }, { label: 'iframe', option: { title: 'iframe', name: 'iframe', icon: 'icon-iframe', img: '/datav/img/assets/iframe.png', top: 0, left: 0, component: { width: 670, height: 370, option: {}, name: 'iframe', prop: 'iframe' }, dataType: 0, data: { value: 'https://avuejs.com' }, dataFormatter: '', stylesFormatter: '', option: {} } }, { label: 'video播放器', option: { title: 'video', name: 'video', icon: 'icon-video', img: '/datav/img/assets/video.png', top: 0, left: 0, dataType: 0, data: { value: 'http://www.w3school.com.cn/i/movie.ogg' }, option: { autoplay: false, controls: true, loop: true, poster: '' }, dataFormatter: '', stylesFormatter: '', component: { width: 670, height: 370, name: 'video', prop: 'video' } } }, { label: 'hls播放器', option: { title: 'hls', name: 'hls', icon: 'icon-video', img: '/datav/img/assets/video.png', top: 0, left: 0, dataType: 0, data: { value: 'https://open.ys7.com/v3/openlive/E10668433_1_1.m3u8?expire=1664027961&id=363444666731335680&t=346b970f0d5cb5d5b5e4734d966275a61fb9efd5038c7a75b7435423c5716908&ev=100' }, option: { autoplay: true }, dataFormatter: '', stylesFormatter: '', component: { width: 670, height: 370, option: {}, name: 'clapper', prop: 'clapper' } } }] }, { label: '指标', icon: 'icon-flop', children: [{ label: '翻牌器', option: { title: '翻牌器', name: '翻牌器', icon: 'icon-flop', img: '/datav/img/assets/flop.png', top: 0, left: 0, dataType: 0, child: { index: [], paramName: '' }, data: { value: '12345' }, dataFormatter: '', stylesFormatter: '', component: { width: 445.6, height: 86.56, name: 'flop', prop: 'flop' }, option: { textAlign: 'center', paddingLeft: 10, marginLeft: 10, border: true, borderColor: '#fff', borderWidth: 10, backgroundBorder: '/datav/img/border/border1.png', fontSize: 50, color: '#afdef2', backgroundColor: '#132d4f' } } }, { label: '颜色块', option: { title: '颜色块', name: '颜色块', icon: 'icon-flop', img: '/datav/img/assets/flop2.png', 'child': { 'index': [], 'paramName': '' }, top: 0, left: 0, dataType: 0, data: [{ backgroundColor: '#67C23A', prefixText: '某某某总人数', value: '12345', suffixText: '人' }, { backgroundColor: '#409EFF', prefixText: '某某某总人数', value: '12345', suffixText: '人' }, { backgroundColor: '#E6A23C', prefixText: '某某某总人数', value: '12345', suffixText: '人' }, { backgroundColor: '#F56C6C', prefixText: '某某某总人数', value: '12345', suffixText: '人' }, { backgroundColor: '#7232dd', prefixText: '某某某总人数', value: '12345', suffixText: '人' }, { backgroundColor: 'blue', prefixText: '某某某总人数', value: '12345', suffixText: '人' }], dataFormatter: '', stylesFormatter: '', component: { width: 543.04, height: 196.28, name: 'flop', prop: 'flop' }, option: { width: 180, whole: true, fontSize: 28, prefixFontSize: 13, backgroundColor: '#F56C6C', suffixFontSize: 18, marginTop: 10, marginLeft: 5, paddingTop: 10, paddingLeft: 30, color: '#fff', suffixInline: true, fontWeight: 'bolder' } } }, { label: '环形图', option: { title: '环形图', name: '环形图', icon: 'icon-circle', img: '/datav/img/assets/progress.png', top: 0, left: 0, dataType: 0, data: { label: '人数增涨', value: 40, data: 80 }, dataFormatter: '', stylesFormatter: '', component: { width: 300, height: 300, name: 'progress', prop: 'progress' }, option: { type: 'circle', color: '#60d3da', fontSize: 25, suffixColor: '#60d3da', strokeWidth: 20, fontWeight: 'normal', borderColor: '#60d3da', suffixFontSize: 30, FontWeight: 'normal' } } }, { label: '进度条', option: { title: '进度条', name: '进度条', icon: 'icon-progress', img: '/datav/img/assets/progress2.png', top: 0, left: 0, data: { label: '人数增涨', value: 40, data: 80 }, dataType: 0, dataFormatter: '', stylesFormatter: '', component: { width: 500, height: 100, name: 'progress', prop: 'progress' }, option: { type: 'line', color: '#60d3da', fontSize: 25, suffixColor: '#60d3da', strokeWidth: 10, fontWeight: 'normal', borderColor: '#60d3da', suffixFontSize: 30, FontWeight: 'normal' } } }, { label: '仪表盘', option: { title: '仪表盘', icon: 'icon-gauge', img: '/datav/img/assets/gauge.png', name: '仪表盘', dataType: 0, data: { value: 4 }, dataFormatter: '', stylesFormatter: '', component: { width: 390, height: 314, name: 'gauge', prop: 'gauge' }, option: { lineSize: 15, axisLabelShow: true, axisLabelFontSize: 15, nameFontSize: 40, lineColor: '#eee', barColor: [ { color1: 'rgba(154, 168, 212, 1)', postion: '0.2' }, { color1: '#23B7E5', postion: '0.8' }, { color1: '#564AA3', postion: '1' } ] } } }, { label: '字符云', option: { title: '字符云', name: '字符云', icon: 'icon-wordCloud', img: '/datav/img/assets/wordcloud.png', top: 0, left: 0, dataType: 0, data: [{ name: '三星', value: '1' }, { name: '小米', value: '10' }, { name: '华为', value: '20' }, { name: 'oppo', value: '30' }, { name: '抖音', value: '40' }, { name: '快手', value: '50' }, { name: '淘宝', value: '60' }, { name: '百度', value: '70' }, { name: '京东', value: '80' }, { name: '天猫', value: '100' }, { name: '字符1', value: '110' }, { name: '字符1', value: '200', textStyle: { color: 'red' } }], dataFormatter: '', stylesFormatter: '', component: { name: 'wordcloud', prop: 'wordcloud', width: 600, height: 300 }, option: { minFontSize: 30, maxFontSize: 80, split: 30, rotate: true } } }] }, { label: '表格', icon: 'icon-table', children: [{ label: '表格', option: { title: '表格', name: '表格', icon: 'icon-table', img: '/datav/img/assets/table.png', top: 0, left: 0, dataType: 0, data: [{ type1: '数据1', type2: '数据1' }, { type1: '数据2', type2: '数据2' }, { type1: '数据3', type2: '数据3' }, { type1: '数据4', type2: '数据4' }], dataFormatter: '', stylesFormatter: '', component: { width: 700, height: 350, name: 'table', prop: 'table' }, option: { showHeader: true, columnShow: true, columnViews: true, headerBackground: '#050e18', headerColor: '#69bfe7', headerTextAlign: 'center', nthColor: '#09192c', bodyBackground: 'rgba(0, 0, 0, 0.01)', bodyColor: '#69bfe7', bodyTextAlign: 'center', align: 'center', headerAlign: 'center', header: false, scrollSpeed: 1, fontSize: 15, count: 4, index: true, column: [ { label: '列1', prop: 'type1', $index: 0 }, { label: '列2', prop: 'type2', $index: 1 }, { label: '列3', prop: 'type3', $index: 2 }, { label: '列4', prop: 'type4', $index: 3 } ], othColor: '#142a40', headerFontSize: 20, bodyFontSize: 18 } } }, { label: '选项卡', option: { title: '选项卡', name: '选项卡', icon: 'icon-tabs', img: '/datav/img/assets/tabs.png', child: { index: [], paramName: '' }, dataFormatter: '', stylesFormatter: '', dataType: 0, data: [ { label: '选项卡1', value: '1' }, { label: '选项卡2', value: '2' } ], component: { width: 356, height: 46, name: 'tabs', prop: 'tabs' }, option: { type: 'tabs', color: '#eee', empColor: '#4dffff', fontSize: 20, split: 8, empBackgroundImage: '/datav/img/banner/banner5.png', backgroundImage: '/datav/img/banner/banner4.png' } } } ] }, { label: '边框', icon: 'icon-biankuang', children: [{ label: '边框1', option: { title: '边框1', name: 'datav', icon: 'icon-biankuang', img: '/datav/img/assets/borderBox/borderBox_01.gif', top: 0, left: 0, data: {}, component: { width: 300, height: 150, name: 'borderBox', prop: 'borderBox' }, option: { type: 1, color1: '#83bff6', color2: '#00CED1', dur: undefined } } }, { label: '边框2', option: { title: '边框2', name: 'datav', icon: 'icon-biankuang', img: '/datav/img/assets/borderBox/borderBox_02.png', top: 0, left: 0, data: {}, component: { width: 300, height: 150, name: 'borderBox', prop: 'borderBox' }, option: { type: 2, color1: '#83bff6', color2: '#00CED1', dur: undefined } } }, { label: '边框3', option: { title: '边框3', name: 'datav', icon: 'icon-biankuang', img: '/datav/img/assets/borderBox/borderBox_03.png', top: 0, left: 0, data: {}, component: { width: 300, height: 150, name: 'borderBox', prop: 'borderBox' }, option: { type: 3, color1: '#83bff6', color2: '#00CED1', dur: undefined } } }, { label: '边框4', option: { title: '边框4', name: 'datav', icon: 'icon-biankuang', img: '/datav/img/assets/borderBox/borderBox_04.png', top: 0, left: 0, component: { width: 300, height: 150, name: 'borderBox', prop: 'borderBox' }, option: { type: 4, color1: '#83bff6', color2: '#00CED1', dur: undefined } } }, { label: '边框5', option: { title: '边框5', name: 'datav', icon: 'icon-biankuang', img: '/datav/img/assets/borderBox/borderBox_05.png', top: 0, left: 0, data: {}, component: { width: 300, height: 150, name: 'borderBox', prop: 'borderBox' }, option: { type: 5, color1: '#83bff6', color2: '#00CED1', dur: undefined } } }, { label: '边框6', option: { title: '边框6', name: 'datav', icon: 'icon-biankuang', img: '/datav/img/assets/borderBox/borderBox_06.png', top: 0, left: 0, data: {}, component: { width: 300, height: 150, name: 'borderBox', prop: 'borderBox' }, option: { type: 6, color1: '#83bff6', color2: '#00CED1', dur: undefined } } }, { label: '边框7', option: { title: '边框7', name: 'datav', icon: 'icon-biankuang', img: '/datav/img/assets/borderBox/borderBox_07.png', top: 0, left: 0, data: {}, component: { width: 300, height: 150, name: 'borderBox', prop: 'borderBox' }, option: { type: 7, color1: '#83bff6', color2: '#00CED1', dur: undefined } } }, { label: '边框8', option: { title: '边框8', name: 'datav', icon: 'icon-biankuang', img: '/datav/img/assets/borderBox/borderBox_08.gif', top: 0, left: 0, data: {}, component: { width: 300, height: 150, name: 'borderBox', prop: 'borderBox' }, option: { type: 8, color1: '#83bff6', color2: '#00CED1', dur: undefined } } }, { label: '边框9', option: { title: '边框9', name: 'datav', icon: 'icon-biankuang', img: '/datav/img/assets/borderBox/borderBox_09.png', top: 0, left: 0, data: {}, component: { width: 300, height: 150, name: 'borderBox', prop: 'borderBox' }, option: { type: 9, color1: '#83bff6', color2: '#00CED1', dur: undefined } } }, { label: '边框10', option: { title: '边框10', name: 'datav', icon: 'icon-biankuang', img: '/datav/img/assets/borderBox/borderBox_10.png', top: 0, left: 0, data: {}, component: { width: 300, height: 150, name: 'borderBox', prop: 'borderBox' }, option: { type: 10, color1: '#83bff6', color2: '#00CED1', dur: undefined } } }, { label: '边框11', option: { title: '边框11', name: 'datav', icon: 'icon-biankuang', img: '/datav/img/assets/borderBox/borderBox_11.png', top: 0, left: 0, data: {}, component: { width: 300, height: 150, name: 'borderBox', prop: 'borderBox' }, option: { type: 11, color1: '#83bff6', color2: '#00CED1', dur: undefined } } }, { label: '边框12', option: { title: '边框12', name: 'datav', icon: 'icon-biankuang', img: '/datav/img/assets/borderBox/borderBox_12.png', top: 0, left: 0, data: {}, component: { width: 300, height: 150, name: 'borderBox', prop: 'borderBox' }, option: { type: 12, color1: '#83bff6', color2: '#00CED1', dur: undefined } } }] }, { label: 'datav例子', icon: 'icon-datav', children: [ { label: '滚动排名', option: { name: '滚动排名', title: '滚动排名', icon: 'icon-datav', img: '/datav/img/assets/table1.gif', dataType: 0, data: [ { name: '周口', value: 55 }, { name: '南阳', value: 120 }, { name: '西峡', value: 78 }, { name: '驻马店', value: 66 }, { name: '新乡', value: 80 }, { name: '信阳', value: 45 }, { name: '漯河', value: 29 } ], dataFormatter: '', echartFormatter: "(data)=>{\n return {\n config:{\n\t data: data,\n //carousel: 'page',\n valueFormatter ({ value }) {\n return value+'单位'\n }\n\t }\n }\n}", component: { width: 652.35, height: 248.45, name: 'datav', prop: 'datav' }, option: { is: 'dv-scroll-ranking-board' } } }, { label: '胶囊排名', option: { name: '胶囊排名', title: '胶囊排名', icon: 'icon-datav', img: '/datav/img/assets/table3.png', dataType: 0, data: [ { name: '周口', value: 55 }, { name: '南阳', value: 120 }, { name: '西峡', value: 78 }, { name: '驻马店', value: 66 }, { name: '新乡', value: 80 }, { name: '信阳', value: 45 }, { name: '漯河', value: 29 } ], dataFormatter: '', echartFormatter: "(data)=>{\n return {\n config:{\n\t data: data,\n colors: ['#e062ae', '#fb7293', '#e690d1', '#32c5e9', '#96bfff'],\n unit: '单位',\n showValue: true\n\t }\n }\n}", component: { width: 652.35, height: 248.45, name: 'datav', prop: 'datav' }, option: { is: 'dv-capsule-chart' } } }, { label: '水位图', option: { name: '水位图', title: 'datav', icon: 'icon-datav', img: '/datav/img/assets/datav/datav1.png', dataType: 0, data: { value: 66 }, dataFormatter: '', echartFormatter: "(data)=>{\n return {\n config:{\n\t data: [data.value],\n shape: 'roundRect'\n\t }\n }\n}", component: { width: 150, height: 200, name: 'datav', prop: 'datav' }, option: { is: 'dv-water-level-pond' } } }, { label: '进度池', option: { name: '进度池', title: 'datav', icon: 'icon-datav', img: '/datav/img/assets/datav/datav2.png', dataType: 0, data: { value: 66 }, dataFormatter: '', echartFormatter: '(data)=>{\n return {\n config:{\n value: data.value,\n borderWidth: 5,\n borderRadius: 10,\n borderGap: 5,\n lineDash: [10, 2],\n localGradient: true\n }\n }\n}', component: { width: 369, height: 153, name: 'datav', prop: 'datav' }, option: { is: 'dv-percent-pond' } } }, { label: '锥形柱图', option: { name: '锥形柱图', title: 'datav', icon: 'icon-datav', img: '/datav/img/assets/datav/datav3.png', dataType: 0, data: [ { name: '周口', value: 55 }, { name: '南阳', value: 120 }, { name: '西峡', value: 71 }, { name: '驻马店', value: 66 }, { name: '新乡', value: 80 }, { name: '信阳', value: 35 }, { name: '漯河', value: 15 } ], dataFormatter: '', echartFormatter: "(data)=>{\n return {\n config:{\n data:data,\n img: [\n '/datav/img/conicalColumnChart/1st.png',\n '/datav/img/conicalColumnChart/2st.png',\n '/datav/img/conicalColumnChart/3st.png',\n '/datav/img/conicalColumnChart/4st.png',\n '/datav/img/conicalColumnChart/5st.png',\n '/datav/img/conicalColumnChart/6st.png',\n '/datav/img/conicalColumnChart/7st.png'\n ],\n showValue: true\n }\n }\n}", component: { width: 549.18, height: 262.98, name: 'datav', prop: 'datav' }, option: { is: 'dv-conical-column-chart' } } }, { label: '飞线图', option: { name: '飞线图', title: 'datav', icon: 'icon-datav', img: '/datav/img/assets/datav/datav4.png', dataType: 0, data: { 'points': [ { name: '郑州', 'coordinate': [ 0.48, 0.35 ], 'halo': { 'show': true }, icon: { 'src': '/datav/img/flylineChart/mapCenterPoint.png', width: 30, height: 30 }, 'text': { 'show': false } }, { name: '新乡', 'coordinate': [ 0.52, 0.23 ] }, { name: '焦作', 'coordinate': [ 0.43, 0.29 ] }, { name: '开封', 'coordinate': [ 0.59, 0.35 ] }, { name: '许昌', 'coordinate': [ 0.53, 0.47 ] }, { name: '平顶山', 'coordinate': [ 0.45, 0.54 ] }, { name: '洛阳', 'coordinate': [ 0.36, 0.38 ] }, { name: '周口', 'coordinate': [ 0.62, 0.55 ], 'halo': { 'show': true, 'color': '#8378ea' } }, { name: '漯河', 'coordinate': [ 0.56, 0.56 ] }, { name: '南阳', 'coordinate': [ 0.37, 0.66 ], 'halo': { 'show': true, 'color': '#37a2da' } }, { name: '信阳', 'coordinate': [ 0.55, 0.81 ] }, { name: '驻马店', 'coordinate': [ 0.55, 0.67 ] }, { name: '济源', 'coordinate': [ 0.37, 0.29 ] }, { name: '三门峡', 'coordinate': [ 0.2, 0.36 ] }, { name: '商丘', 'coordinate': [ 0.76, 0.41 ] }, { name: '鹤壁', 'coordinate': [ 0.59, 0.18 ] }, { name: '濮阳', 'coordinate': [ 0.68, 0.17 ] }, { name: '安阳', 'coordinate': [ 0.59, 0.1 ] } ], 'lines': [ { 'source': '新乡', 'target': '郑州' }, { 'source': '焦作', 'target': '郑州' }, { 'source': '开封', 'target': '郑州' }, { 'source': '周口', 'target': '郑州', 'color': '#fb7293', width: 2 }, { 'source': '南阳', 'target': '郑州', 'color': '#fb7293', width: 2 }, { 'source': '济源', 'target': '郑州' }, { 'source': '三门峡', 'target': '郑州' }, { 'source': '商丘', 'target': '郑州' }, { 'source': '鹤壁', 'target': '郑州' }, { 'source': '濮阳', 'target': '郑州' }, { 'source': '安阳', 'target': '郑州' }, { 'source': '许昌', 'target': '南阳', 'color': '#37a2da' }, { 'source': '平顶山', 'target': '南阳', 'color': '#37a2da' }, { 'source': '洛阳', 'target': '南阳', 'color': '#37a2da' }, { 'source': '驻马店', 'target': '周口', 'color': '#8378ea' }, { 'source': '信阳', 'target': '周口', 'color': '#8378ea' }, { 'source': '漯河', 'target': '周口', 'color': '#8378ea' } ] }, 'lines': [ { 'source': '新乡', 'target': '郑州' }, { 'source': '焦作', 'target': '郑州' }, { 'source': '开封', 'target': '郑州' }, { 'source': '周口', 'target': '郑州', 'color': '#fb7293', width: 2 }, { 'source': '南阳', 'target': '郑州', 'color': '#fb7293', width: 2 }, { 'source': '济源', 'target': '郑州' }, { 'source': '三门峡', 'target': '郑州' }, { 'source': '商丘', 'target': '郑州' }, { 'source': '鹤壁', 'target': '郑州' }, { 'source': '濮阳', 'target': '郑州' }, { 'source': '安阳', 'target': '郑州' }, { 'source': '许昌', 'target': '南阳', 'color': '#37a2da' }, { 'source': '平顶山', 'target': '南阳', 'color': '#37a2da' }, { 'source': '洛阳', 'target': '南阳', 'color': '#37a2da' }, { 'source': '驻马店', 'target': '周口', 'color': '#8378ea' }, { 'source': '信阳', 'target': '周口', 'color': '#8378ea' }, { 'source': '漯河', 'target': '周口', 'color': '#8378ea' } ], dataFormatter: '', echartFormatter: "(data)=>{\n return {\n config:{\n points:data.points,\n lines:data.lines,\n icon: {\n show: true,\n src: '/datav/img/flylineChart/mapPoint.png'\n },\n text: {\n show: true,\n },\n k: 0.5,\n bgImgSrc: '/datav/img/flylineChart/map.jpg'\n }\n }\n}", component: { width: 949.32, height: 515.7, name: 'datav', prop: 'datav' }, option: { is: 'dv-flyline-chart-enhanced' } } }, { label: '动态环图', option: { name: '动态环图', title: 'datav', icon: 'icon-datav', img: '/datav/img/assets/datav/datav5.png', dataType: 0, data: [ { name: '周口', value: 55 }, { name: '南阳', value: 120 }, { name: '西峡', value: 78 }, { name: '驻马店', value: 66 }, { name: '新乡', value: 80 } ], dataFormatter: '', echartFormatter: "(data)=>{\n return {\n config:{\n radius: '40%',\n activeRadius: '45%',\n data: data,\n digitalFlopStyle: {\n fontSize: 20\n },\n showOriginValue: true\n }\n }\n}", component: { width: 949.32, height: 515.7, name: 'datav', prop: 'datav' }, option: { is: 'dv-active-ring-chart' } } }] }, { label: '装饰', icon: 'icon-jianzhuzhuangshi', children: [{ label: '装饰1', option: { title: '装饰1', name: 'datav', icon: 'icon-jianzhuzhuangshi', img: '/datav/img/assets/decorate/decorate_01.gif', top: 0, left: 0, data: {}, component: { width: 670, height: 370, name: 'decoration', prop: 'decoration' }, option: { type: 1, color1: '#00CED1', color2: '#FAD400', dur: undefined } } }, { label: '装饰2', option: { title: '装饰2', name: 'datav', icon: 'icon-jianzhuzhuangshi', img: '/datav/img/assets/decorate/decorate_02.gif', top: 0, left: 0, data: {}, component: { width: 670, height: 370, name: 'decoration', prop: 'decoration' }, option: { type: 2, color1: '#00CED1', color2: '#FAD400', dur: undefined } } }, { label: '装饰3', option: { title: '装饰3', name: 'datav', icon: 'icon-jianzhuzhuangshi', img: '/datav/img/assets/decorate/decorate_03.gif', top: 0, left: 0, data: {}, component: { width: 670, height: 370, name: 'decoration', prop: 'decoration' }, option: { type: 3, color1: '#00CED1', color2: '#FAD400', dur: undefined } } }, { label: '装饰4', option: { title: '装饰4', name: 'datav', icon: 'icon-jianzhuzhuangshi', img: '/datav/img/assets/decorate/decorate_04.gif', top: 0, left: 0, data: {}, component: { width: 670, height: 370, name: 'decoration', prop: 'decoration' }, option: { type: 4, color1: '#00CED1', color2: '#FAD400', dur: undefined } } }, { label: '装饰5', option: { title: '装饰5', name: 'datav', icon: 'icon-jianzhuzhuangshi', img: '/datav/img/assets/decorate/decorate_05.png', top: 0, left: 0, data: {}, component: { width: 670, height: 370, name: 'decoration', prop: 'decoration' }, option: { type: 5, color1: '#00CED1', color2: '#FAD400', dur: undefined } } }, { label: '装饰6', option: { title: '装饰6', name: 'datav', icon: 'icon-jianzhuzhuangshi', img: '/datav/img/assets/decorate/decorate_06.gif', top: 0, left: 0, data: {}, component: { width: 670, height: 370, name: 'decoration', prop: 'decoration' }, option: { type: 6, color1: '#00CED1', color2: '#FAD400', dur: undefined } } }, { label: '装饰7', option: { title: '装饰7', name: 'datav', icon: 'icon-jianzhuzhuangshi', img: '/datav/img/assets/decorate/decorate_07.png', top: 0, left: 0, data: {}, component: { width: 670, height: 370, name: 'decoration', prop: 'decoration' }, option: { type: 7, color1: '#00CED1', color2: '#FAD400', dur: undefined } } }, { label: '装饰8', option: { title: '装饰8', name: 'datav', icon: 'icon-jianzhuzhuangshi', img: '/datav/img/assets/decorate/decorate_08.png', top: 0, left: 0, data: {}, component: { width: 670, height: 370, name: 'decoration', prop: 'decoration' }, option: { type: 8, color1: '#00CED1', color2: '#FAD400', dur: undefined } } }, { label: '装饰9', option: { title: '装饰9', name: 'datav', icon: 'icon-jianzhuzhuangshi', img: '/datav/img/assets/decorate/decorate_09.gif', top: 0, left: 0, data: {}, component: { width: 440.5, height: 377.65, name: 'decoration', prop: 'decoration' }, option: { type: 9, color1: '#00CED1', color2: '#FAD400', dur: undefined } } }, { label: '装饰10', option: { title: '装饰10', name: 'datav', icon: 'icon-jianzhuzhuangshi', img: '/datav/img/assets/decorate/decorate_10.png', top: 0, left: 0, data: {}, component: { width: 670, height: 370, name: 'decoration', prop: 'decoration' }, option: { type: 10, color1: '#00CED1', color2: '#FAD400', dur: undefined } } }, { label: '装饰11', option: { title: '装饰11', name: 'datav', icon: 'icon-jianzhuzhuangshi', img: '/datav/img/assets/decorate/decorate_11.png', top: 0, left: 0, data: {}, component: { width: 670, height: 370, name: 'decoration', prop: 'decoration' }, option: { type: 11, color1: '#00CED1', color2: '#FAD400', dur: undefined } } }, { label: '装饰12', option: { title: '装饰12', name: 'datav', icon: 'icon-jianzhuzhuangshi', img: '/datav/img/assets/decorate/decorate_12.gif', top: 0, left: 0, data: {}, component: { width: 430, height: 430, name: 'decoration', prop: 'decoration' }, option: { type: 12, color1: '#00CED1', color2: '#FAD400', dur: undefined } } }] }, { label: '二次开发', icon: 'el-icon-info', children: [{ label: '自定义组件', option: { name: '自定义组件', title: '自定义组件', ico: 'icon-bar', img: '/datav/img/assets/text4.png', dataType: 0, data: [], dataFormatter: '', stylesFormatter: '', component: { width: 800, height: 500, name: 'test', prop: 'test' }, option: { fontSize: 20 } } }, { label: '滚动选项卡', option: { name: '滚动选项卡', title: '滚动选项卡', icon: 'icon-bar', img: '/datav/img/assets/text4.png', dataType: 0, data: [{ text: '领导调研', list: [ 'https://datav/img.alicdn.com/tfs/TB1v28TC8v0gK0jSZKbXXbK2FXa-1880-640.jpg', 'https://datav/img.alicdn.com/tfs/TB1uevcCrj1gK0jSZFuXXcrHpXa-1880-640.jpg' ] }, { text: '先进事件', list: [ 'https://datav/img.alicdn.com/datav/imgextra/i1/O1CN01NAnI6W1Vf1kZScscd_!!6000000002679-0-tps-2880-1070.jpg', 'https://datav/img.alicdn.com/datav/imgextra/i2/O1CN011FMQT21RF8u1nHsem_!!6000000002081-0-tps-2880-1070.jpg' ] }], dataFormatter: '', stylesFormatter: '', component: { width: 800, height: 400, name: 'imgTabs', prop: 'imgTabs' }, option: { direction: 'horizontal', interval: 3000, time: 3000, autoplay: true } } }, { label: '滚动列表', option: { name: '滚动列表', title: '滚动列表', icon: 'icon-bar', img: '/datav/img/assets/text4.png', dataType: 0, data: [ { name: 'smallwei', time: '11:26', color: '#7c324c', date: '2022-05-22', dept: '设计部', img: 'https://img.alicdn.com/tfs/TB1v28TC8v0gK0jSZKbXXbK2FXa-1880-640.jpg' }, { name: 'smallwei', time: '11:26', color: '#6b6230', date: '2022-05-22', dept: '设计部', img: 'https://img.alicdn.com/tfs/TB1v28TC8v0gK0jSZKbXXbK2FXa-1880-640.jpg' }, { name: 'smallwei', time: '11:26', date: '2022-05-22', color: '#274d86', dept: '设计部', img: 'https://img.alicdn.com/tfs/TB1v28TC8v0gK0jSZKbXXbK2FXa-1880-640.jpg' } ], dataFormatter: '', stylesFormatter: '', component: { width: 800, height: 500, name: 'imgList', prop: 'imgList' }, option: { step: 1, direction: 1, hoverStop: true } } }] }] }