build: 📦 移除图表相关示例
This commit is contained in:
FairyEver
parent
79130e24a3
commit
8119b3312f
|
|
@ -18,8 +18,6 @@ module.exports = [
|
|||
{ name: 'lowdb/adapters/LocalStorage', library: 'LocalStorage', js: 'https://cdn.jsdelivr.net/npm/lowdb@1.0.0/dist/LocalStorage.min.js', css: '' },
|
||||
{ name: 'screenfull', library: 'screenfull', js: 'https://cdn.jsdelivr.net/npm/screenfull@5.0.2/dist/screenfull.min.js', css: '' },
|
||||
{ name: 'sortablejs', library: 'Sortable', js: 'https://cdn.jsdelivr.net/npm/sortablejs@1.10.1/Sortable.min.js', css: '' },
|
||||
{ name: 'echarts', library: 'echarts', js: 'https://cdn.jsdelivr.net/npm/echarts@4.5.0/dist/echarts.min.js' },
|
||||
{ name: 'v-charts', library: 'VeIndex', js: 'https://cdn.jsdelivr.net/npm/v-charts@1.19.0/lib/index.min.js', css: 'https://cdn.jsdelivr.net/npm/v-charts@1.19.0/lib/style.min.css' },
|
||||
{ name: '@d2-projects/vue-table-export', library: 'VueTableExport', js: 'https://cdn.jsdelivr.net/npm/@d2-projects/vue-table-export@1.0.1/dist/vue-table-export.js', css: '' },
|
||||
{ name: '@d2-projects/vue-table-import', library: 'VueTableImport', js: 'https://cdn.jsdelivr.net/npm/@d2-projects/vue-table-import@1.0.0/dist/vue-table-import.js', css: '' },
|
||||
{ name: 'vue-grid-layout', library: 'VueGridLayout', js: 'https://cdn.jsdelivr.net/npm/vue-grid-layout@2.3.7/dist/vue-grid-layout.umd.min.js', css: '' },
|
||||
|
|
|
|||
|
|
@ -1871,9 +1871,9 @@
|
|||
"dev": true
|
||||
},
|
||||
"@types/babel__core": {
|
||||
"version": "7.1.11",
|
||||
"resolved": "https://registry.npm.taobao.org/@types/babel__core/download/@types/babel__core-7.1.11.tgz",
|
||||
"integrity": "sha1-f65GYKAJpAMeKT8lshPxQtgjs8Q=",
|
||||
"version": "7.1.12",
|
||||
"resolved": "https://registry.npm.taobao.org/@types/babel__core/download/@types/babel__core-7.1.12.tgz?cache=0&sync_timestamp=1604360300177&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40types%2Fbabel__core%2Fdownload%2F%40types%2Fbabel__core-7.1.12.tgz",
|
||||
"integrity": "sha1-TY6eUesmVVKn5PH/IhmrYTO9+y0=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@babel/parser": "^7.1.0",
|
||||
|
|
@ -5310,7 +5310,7 @@
|
|||
},
|
||||
"compression-webpack-plugin": {
|
||||
"version": "3.1.0",
|
||||
"resolved": "https://registry.npm.taobao.org/compression-webpack-plugin/download/compression-webpack-plugin-3.1.0.tgz?cache=0&sync_timestamp=1603716704759&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fcompression-webpack-plugin%2Fdownload%2Fcompression-webpack-plugin-3.1.0.tgz",
|
||||
"resolved": "https://registry.npm.taobao.org/compression-webpack-plugin/download/compression-webpack-plugin-3.1.0.tgz",
|
||||
"integrity": "sha1-n1EBcqe1+uWq07ZwZS6L15l67so=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -6691,29 +6691,6 @@
|
|||
"safer-buffer": "^2.1.0"
|
||||
}
|
||||
},
|
||||
"echarts": {
|
||||
"version": "4.9.0",
|
||||
"resolved": "https://registry.npm.taobao.org/echarts/download/echarts-4.9.0.tgz?cache=0&sync_timestamp=1603712830065&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fecharts%2Fdownload%2Fecharts-4.9.0.tgz",
|
||||
"integrity": "sha1-qbm6oD8Doqcx5jQMVb77V6nhNH0=",
|
||||
"requires": {
|
||||
"zrender": "4.3.2"
|
||||
}
|
||||
},
|
||||
"echarts-amap": {
|
||||
"version": "1.0.0-rc.6",
|
||||
"resolved": "https://registry.npm.taobao.org/echarts-amap/download/echarts-amap-1.0.0-rc.6.tgz",
|
||||
"integrity": "sha1-V4KnTa7lLtRM4/j2JXdWF4PwnhY="
|
||||
},
|
||||
"echarts-liquidfill": {
|
||||
"version": "2.0.6",
|
||||
"resolved": "https://registry.npm.taobao.org/echarts-liquidfill/download/echarts-liquidfill-2.0.6.tgz?cache=0&sync_timestamp=1591072510091&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fecharts-liquidfill%2Fdownload%2Fecharts-liquidfill-2.0.6.tgz",
|
||||
"integrity": "sha1-BmjcYdh6YmIAMJC9MsVaqBCMJS4="
|
||||
},
|
||||
"echarts-wordcloud": {
|
||||
"version": "1.1.3",
|
||||
"resolved": "https://registry.npm.taobao.org/echarts-wordcloud/download/echarts-wordcloud-1.1.3.tgz",
|
||||
"integrity": "sha1-B7FAyLp2sZwxe0PDEPPV3Jkon/I="
|
||||
},
|
||||
"editorconfig": {
|
||||
"version": "0.15.3",
|
||||
"resolved": "https://registry.npm.taobao.org/editorconfig/download/editorconfig-0.15.3.tgz",
|
||||
|
|
@ -6763,9 +6740,9 @@
|
|||
"dev": true
|
||||
},
|
||||
"electron-to-chromium": {
|
||||
"version": "1.3.585",
|
||||
"resolved": "https://registry.npm.taobao.org/electron-to-chromium/download/electron-to-chromium-1.3.585.tgz?cache=0&sync_timestamp=1604087108055&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Felectron-to-chromium%2Fdownload%2Felectron-to-chromium-1.3.585.tgz",
|
||||
"integrity": "sha1-cc23Isc0iLlHWtHFcs9Dp2PvkIE=",
|
||||
"version": "1.3.586",
|
||||
"resolved": "https://registry.npm.taobao.org/electron-to-chromium/download/electron-to-chromium-1.3.586.tgz?cache=0&sync_timestamp=1604370872944&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Felectron-to-chromium%2Fdownload%2Felectron-to-chromium-1.3.586.tgz",
|
||||
"integrity": "sha1-FIT1my+CD18yePDG6tcdBbGaExE=",
|
||||
"dev": true
|
||||
},
|
||||
"element-resize-detector": {
|
||||
|
|
@ -11501,11 +11478,6 @@
|
|||
"integrity": "sha1-b2gragJ6Tp3fpFZM0lidHU5mnt4=",
|
||||
"dev": true
|
||||
},
|
||||
"numerify": {
|
||||
"version": "1.2.9",
|
||||
"resolved": "https://registry.npm.taobao.org/numerify/download/numerify-1.2.9.tgz",
|
||||
"integrity": "sha1-r0aWux1X+NOXCmFdiwzVPZMr1Vk="
|
||||
},
|
||||
"nwsapi": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npm.taobao.org/nwsapi/download/nwsapi-2.2.0.tgz?cache=0&sync_timestamp=1572824577484&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fnwsapi%2Fdownload%2Fnwsapi-2.2.0.tgz",
|
||||
|
|
@ -15368,7 +15340,7 @@
|
|||
},
|
||||
"uglify-js": {
|
||||
"version": "3.4.10",
|
||||
"resolved": "https://registry.npm.taobao.org/uglify-js/download/uglify-js-3.4.10.tgz?cache=0&sync_timestamp=1603670295025&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fuglify-js%2Fdownload%2Fuglify-js-3.4.10.tgz",
|
||||
"resolved": "https://registry.npm.taobao.org/uglify-js/download/uglify-js-3.4.10.tgz?cache=0&sync_timestamp=1604365913098&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fuglify-js%2Fdownload%2Fuglify-js-3.4.10.tgz",
|
||||
"integrity": "sha1-mtlWPY6zrN+404WX0q8dgV9qdV8=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
|
|
@ -15667,11 +15639,6 @@
|
|||
"integrity": "sha1-ihagXURWV6Oupe7MWxKk+lN5dyw=",
|
||||
"dev": true
|
||||
},
|
||||
"utils-lite": {
|
||||
"version": "0.1.10",
|
||||
"resolved": "https://registry.npm.taobao.org/utils-lite/download/utils-lite-0.1.10.tgz",
|
||||
"integrity": "sha1-0pCMBILiPDHmsIJVhUDnE0/619c="
|
||||
},
|
||||
"utils-merge": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npm.taobao.org/utils-merge/download/utils-merge-1.0.1.tgz",
|
||||
|
|
@ -15684,18 +15651,6 @@
|
|||
"integrity": "sha1-sj5DWK+oogL+ehAK8fX4g/AgB+4=",
|
||||
"dev": true
|
||||
},
|
||||
"v-charts": {
|
||||
"version": "1.19.0",
|
||||
"resolved": "https://registry.npm.taobao.org/v-charts/download/v-charts-1.19.0.tgz",
|
||||
"integrity": "sha1-B7cBgAsVm9UUJk/8i/ErBAUULaM=",
|
||||
"requires": {
|
||||
"echarts-amap": "1.0.0-rc.6",
|
||||
"echarts-liquidfill": "^2.0.2",
|
||||
"echarts-wordcloud": "^1.1.3",
|
||||
"numerify": "1.2.9",
|
||||
"utils-lite": "0.1.10"
|
||||
}
|
||||
},
|
||||
"v8-compile-cache": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npm.taobao.org/v8-compile-cache/download/v8-compile-cache-2.2.0.tgz?cache=0&sync_timestamp=1603909625582&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fv8-compile-cache%2Fdownload%2Fv8-compile-cache-2.2.0.tgz",
|
||||
|
|
@ -16966,11 +16921,6 @@
|
|||
"dev": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"zrender": {
|
||||
"version": "4.3.2",
|
||||
"resolved": "https://registry.npm.taobao.org/zrender/download/zrender-4.3.2.tgz?cache=0&sync_timestamp=1603693435273&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fzrender%2Fdownload%2Fzrender-4.3.2.tgz",
|
||||
"integrity": "sha1-7HQy+UFcgsc1hLa3uMR+GwFiCcY="
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -20,7 +20,6 @@
|
|||
"core-js": "^3.4.3",
|
||||
"countup.js": "^2.0.4",
|
||||
"dayjs": "^1.8.17",
|
||||
"echarts": "^4.5.0",
|
||||
"element-ui": "^2.13.2",
|
||||
"faker": "^4.1.0",
|
||||
"flex.css": "^1.1.7",
|
||||
|
|
@ -38,7 +37,6 @@
|
|||
"simplemde": "^1.11.2",
|
||||
"sortablejs": "^1.10.1",
|
||||
"ua-parser-js": "^0.7.20",
|
||||
"v-charts": "^1.19.0",
|
||||
"vue": "^2.6.11",
|
||||
"vue-grid-layout": "^2.3.7",
|
||||
"vue-i18n": "^8.15.1",
|
||||
|
|
|
|||
|
|
@ -4,147 +4,6 @@ export default {
|
|||
icon: 'plug',
|
||||
children: (pre => [
|
||||
{ path: `${pre}index`, title: '插件', icon: 'home' },
|
||||
{
|
||||
path: `${pre}charts`,
|
||||
title: '图表',
|
||||
icon: 'bar-chart',
|
||||
children: [
|
||||
{
|
||||
path: `${pre}charts/line`,
|
||||
title: '折线图',
|
||||
children: [
|
||||
{ path: `${pre}charts/line/demo1`, title: '一般' },
|
||||
{ path: `${pre}charts/line/demo2`, title: '横坐标倾斜' },
|
||||
{ path: `${pre}charts/line/demo3`, title: '堆叠面积图' },
|
||||
{ path: `${pre}charts/line/demo4`, title: '显示数值' },
|
||||
{ path: `${pre}charts/line/demo5`, title: '设置别名' }
|
||||
]
|
||||
},
|
||||
{
|
||||
path: `${pre}charts/histogram`,
|
||||
title: '柱状图',
|
||||
children: [
|
||||
{ path: `${pre}charts/histogram/demo1`, title: '一般' },
|
||||
{ path: `${pre}charts/histogram/demo2`, title: '指标维度' },
|
||||
{ path: `${pre}charts/histogram/demo3`, title: '混合图表' },
|
||||
{ path: `${pre}charts/histogram/demo4`, title: '堆叠柱状图' },
|
||||
{ path: `${pre}charts/histogram/demo5`, title: '显示数值' },
|
||||
{ path: `${pre}charts/histogram/demo6`, title: '横轴连续' }
|
||||
]
|
||||
},
|
||||
{
|
||||
path: `${pre}charts/bar`,
|
||||
title: '条形图',
|
||||
children: [
|
||||
{ path: `${pre}charts/bar/demo1`, title: '一般' },
|
||||
{ path: `${pre}charts/bar/demo2`, title: '指标维度' },
|
||||
{ path: `${pre}charts/bar/demo3`, title: '排序条形图' },
|
||||
{ path: `${pre}charts/bar/demo4`, title: '堆叠条形图' },
|
||||
{ path: `${pre}charts/bar/demo5`, title: '纵轴连续' }
|
||||
]
|
||||
},
|
||||
{
|
||||
path: `${pre}charts/pie`,
|
||||
title: '饼图',
|
||||
children: [
|
||||
{ path: `${pre}charts/pie/demo1`, title: '一般' },
|
||||
{ path: `${pre}charts/pie/demo2`, title: '指标维度' },
|
||||
{ path: `${pre}charts/pie/demo3`, title: '玫瑰图' },
|
||||
{ path: `${pre}charts/pie/demo4`, title: '限制条数' },
|
||||
{ path: `${pre}charts/pie/demo5`, title: '多圆饼图' },
|
||||
{ path: `${pre}charts/pie/demo6`, title: '设置半径' }
|
||||
]
|
||||
},
|
||||
{
|
||||
path: `${pre}charts/ring`,
|
||||
title: '环图',
|
||||
children: [
|
||||
{ path: `${pre}charts/ring/demo1`, title: '一般' },
|
||||
{ path: `${pre}charts/ring/demo2`, title: '指标维度' },
|
||||
{ path: `${pre}charts/ring/demo3`, title: '玫瑰图' },
|
||||
{ path: `${pre}charts/ring/demo4`, title: '限制显示条数' },
|
||||
{ path: `${pre}charts/ring/demo5`, title: '设置半径' }
|
||||
]
|
||||
},
|
||||
{
|
||||
path: `${pre}charts/waterfall`,
|
||||
title: '瀑布图',
|
||||
children: [
|
||||
{ path: `${pre}charts/waterfall/demo1`, title: '一般' }
|
||||
]
|
||||
},
|
||||
{
|
||||
path: `${pre}charts/funnel`,
|
||||
title: '漏斗图',
|
||||
children: [
|
||||
{ path: `${pre}charts/funnel/demo1`, title: '一般' },
|
||||
{ path: `${pre}charts/funnel/demo2`, title: '金字塔' }
|
||||
]
|
||||
},
|
||||
{
|
||||
path: `${pre}charts/radar`,
|
||||
title: '雷达图',
|
||||
children: [
|
||||
{ path: `${pre}charts/radar/demo1`, title: '一般' }
|
||||
]
|
||||
},
|
||||
{
|
||||
path: `${pre}charts/map`,
|
||||
title: '地图',
|
||||
children: [
|
||||
{ path: `${pre}charts/map/demo1`, title: '一般' },
|
||||
{ path: `${pre}charts/map/demo2`, title: '设置城市' },
|
||||
{ path: `${pre}charts/map/demo3`, title: '设置样式' }
|
||||
]
|
||||
},
|
||||
{
|
||||
path: `${pre}charts/sankey`,
|
||||
title: '桑基图',
|
||||
children: [
|
||||
{ path: `${pre}charts/sankey/demo1`, title: '一般' }
|
||||
]
|
||||
},
|
||||
{
|
||||
path: `${pre}charts/heatmap`,
|
||||
title: '热力图',
|
||||
children: [
|
||||
{ path: `${pre}charts/heatmap/demo1`, title: '一般' },
|
||||
{ path: `${pre}charts/heatmap/demo2`, title: '地图热力图' }
|
||||
]
|
||||
},
|
||||
{
|
||||
path: `${pre}charts/scatter`,
|
||||
title: '散点图',
|
||||
children: [
|
||||
{ path: `${pre}charts/scatter/demo1`, title: '单维度多指标' },
|
||||
{ path: `${pre}charts/scatter/demo2`, title: '双维度多指标' }
|
||||
]
|
||||
},
|
||||
{
|
||||
path: `${pre}charts/candle`,
|
||||
title: 'K线图',
|
||||
children: [
|
||||
{ path: `${pre}charts/candle/demo1`, title: '一般' },
|
||||
{ path: `${pre}charts/candle/demo2`, title: 'MA VOL' },
|
||||
{ path: `${pre}charts/candle/demo3`, title: '自定义' }
|
||||
]
|
||||
},
|
||||
{
|
||||
path: `${pre}charts/gauge`,
|
||||
title: '仪表盘',
|
||||
children: [
|
||||
{ path: `${pre}charts/gauge/demo1`, title: '一般' }
|
||||
]
|
||||
},
|
||||
{
|
||||
path: `${pre}charts/tree`,
|
||||
title: '树图',
|
||||
children: [
|
||||
{ path: `${pre}charts/tree/demo1`, title: '径向树图' }
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: `${pre}import`,
|
||||
title: '导入',
|
||||
|
|
|
|||
|
|
@ -21,50 +21,6 @@ export default {
|
|||
{ path: 'import/csv', name: `${pre}import-csv`, component: _import('demo/plugins/import/csv.vue'), meta: { ...meta, title: '导入 csv' } },
|
||||
{ path: 'import/xlsx', name: `${pre}import-xlsx`, component: _import('demo/plugins/import/xlsx.vue'), meta: { ...meta, title: '导入 xlsx' } },
|
||||
{ path: 'index', name: `${pre}index`, component: _import('demo/plugins/index'), meta: { ...meta, title: '插件首页' } },
|
||||
{ path: 'js-cookie', name: `${pre}js-cookie`, component: _import('demo/plugins/js-cookie'), meta: { ...meta, title: 'Cookie' } },
|
||||
{ path: 'charts/line/demo1', name: `${pre}charts-line-demo1`, component: _import('demo/plugins/charts/line/demo1/index.vue'), meta: { ...meta, title: '折线图示例 1' } },
|
||||
{ path: 'charts/line/demo2', name: `${pre}charts-line-demo2`, component: _import('demo/plugins/charts/line/demo2/index.vue'), meta: { ...meta, title: '折线图示例 2' } },
|
||||
{ path: 'charts/line/demo3', name: `${pre}charts-line-demo3`, component: _import('demo/plugins/charts/line/demo3/index.vue'), meta: { ...meta, title: '折线图示例 3' } },
|
||||
{ path: 'charts/line/demo4', name: `${pre}charts-line-demo4`, component: _import('demo/plugins/charts/line/demo4/index.vue'), meta: { ...meta, title: '折线图示例 4' } },
|
||||
{ path: 'charts/line/demo5', name: `${pre}charts-line-demo5`, component: _import('demo/plugins/charts/line/demo5/index.vue'), meta: { ...meta, title: '折线图示例 5' } },
|
||||
{ path: 'charts/histogram/demo1', name: `${pre}charts-histogram-demo1`, component: _import('demo/plugins/charts/histogram/demo1/index.vue'), meta: { ...meta, title: '柱状图示例 1' } },
|
||||
{ path: 'charts/histogram/demo2', name: `${pre}charts-histogram-demo2`, component: _import('demo/plugins/charts/histogram/demo2/index.vue'), meta: { ...meta, title: '柱状图示例 2' } },
|
||||
{ path: 'charts/histogram/demo3', name: `${pre}charts-histogram-demo3`, component: _import('demo/plugins/charts/histogram/demo3/index.vue'), meta: { ...meta, title: '柱状图示例 3' } },
|
||||
{ path: 'charts/histogram/demo4', name: `${pre}charts-histogram-demo4`, component: _import('demo/plugins/charts/histogram/demo4/index.vue'), meta: { ...meta, title: '柱状图示例 4' } },
|
||||
{ path: 'charts/histogram/demo5', name: `${pre}charts-histogram-demo5`, component: _import('demo/plugins/charts/histogram/demo5/index.vue'), meta: { ...meta, title: '柱状图示例 5' } },
|
||||
{ path: 'charts/histogram/demo6', name: `${pre}charts-histogram-demo6`, component: _import('demo/plugins/charts/histogram/demo6/index.vue'), meta: { ...meta, title: '柱状图示例 6' } },
|
||||
{ path: 'charts/bar/demo1', name: `${pre}charts-bar-demo1`, component: _import('demo/plugins/charts/bar/demo1/index.vue'), meta: { ...meta, title: '条形图示例 1' } },
|
||||
{ path: 'charts/bar/demo2', name: `${pre}charts-bar-demo2`, component: _import('demo/plugins/charts/bar/demo2/index.vue'), meta: { ...meta, title: '条形图示例 2' } },
|
||||
{ path: 'charts/bar/demo3', name: `${pre}charts-bar-demo3`, component: _import('demo/plugins/charts/bar/demo3/index.vue'), meta: { ...meta, title: '条形图示例 3' } },
|
||||
{ path: 'charts/bar/demo4', name: `${pre}charts-bar-demo4`, component: _import('demo/plugins/charts/bar/demo4/index.vue'), meta: { ...meta, title: '条形图示例 4' } },
|
||||
{ path: 'charts/bar/demo5', name: `${pre}charts-bar-demo5`, component: _import('demo/plugins/charts/bar/demo5/index.vue'), meta: { ...meta, title: '条形图示例 5' } },
|
||||
{ path: 'charts/pie/demo1', name: `${pre}charts-pie-demo1`, component: _import('demo/plugins/charts/pie/demo1/index.vue'), meta: { ...meta, title: '饼图示例 1' } },
|
||||
{ path: 'charts/pie/demo2', name: `${pre}charts-pie-demo2`, component: _import('demo/plugins/charts/pie/demo2/index.vue'), meta: { ...meta, title: '饼图示例 2' } },
|
||||
{ path: 'charts/pie/demo3', name: `${pre}charts-pie-demo3`, component: _import('demo/plugins/charts/pie/demo3/index.vue'), meta: { ...meta, title: '饼图示例 3' } },
|
||||
{ path: 'charts/pie/demo4', name: `${pre}charts-pie-demo4`, component: _import('demo/plugins/charts/pie/demo4/index.vue'), meta: { ...meta, title: '饼图示例 4' } },
|
||||
{ path: 'charts/pie/demo5', name: `${pre}charts-pie-demo5`, component: _import('demo/plugins/charts/pie/demo5/index.vue'), meta: { ...meta, title: '饼图示例 5' } },
|
||||
{ path: 'charts/pie/demo6', name: `${pre}charts-pie-demo6`, component: _import('demo/plugins/charts/pie/demo6/index.vue'), meta: { ...meta, title: '饼图示例 6' } },
|
||||
{ path: 'charts/ring/demo1', name: `${pre}charts-ring-demo1`, component: _import('demo/plugins/charts/ring/demo1/index.vue'), meta: { ...meta, title: '环图示例 1' } },
|
||||
{ path: 'charts/ring/demo2', name: `${pre}charts-ring-demo2`, component: _import('demo/plugins/charts/ring/demo2/index.vue'), meta: { ...meta, title: '环图示例 2' } },
|
||||
{ path: 'charts/ring/demo3', name: `${pre}charts-ring-demo3`, component: _import('demo/plugins/charts/ring/demo3/index.vue'), meta: { ...meta, title: '环图示例 3' } },
|
||||
{ path: 'charts/ring/demo4', name: `${pre}charts-ring-demo4`, component: _import('demo/plugins/charts/ring/demo4/index.vue'), meta: { ...meta, title: '环图示例 4' } },
|
||||
{ path: 'charts/ring/demo5', name: `${pre}charts-ring-demo5`, component: _import('demo/plugins/charts/ring/demo5/index.vue'), meta: { ...meta, title: '环图示例 5' } },
|
||||
{ path: 'charts/waterfall/demo1', name: `${pre}charts-waterfall-demo1`, component: _import('demo/plugins/charts/waterfall/demo1/index.vue'), meta: { ...meta, title: '瀑布图示例 1' } },
|
||||
{ path: 'charts/funnel/demo1', name: `${pre}charts-funnel-demo1`, component: _import('demo/plugins/charts/funnel/demo1/index.vue'), meta: { ...meta, title: '漏斗图示例 1' } },
|
||||
{ path: 'charts/funnel/demo2', name: `${pre}charts-funnel-demo2`, component: _import('demo/plugins/charts/funnel/demo2/index.vue'), meta: { ...meta, title: '漏斗图示例 2' } },
|
||||
{ path: 'charts/radar/demo1', name: `${pre}charts-radar-demo1`, component: _import('demo/plugins/charts/radar/demo1/index.vue'), meta: { ...meta, title: '雷达图示例 1' } },
|
||||
{ path: 'charts/map/demo1', name: `${pre}charts-map-demo1`, component: _import('demo/plugins/charts/map/demo1/index.vue'), meta: { ...meta, title: '地图示例 1' } },
|
||||
{ path: 'charts/map/demo2', name: `${pre}charts-map-demo2`, component: _import('demo/plugins/charts/map/demo2/index.vue'), meta: { ...meta, title: '地图示例 2' } },
|
||||
{ path: 'charts/map/demo3', name: `${pre}charts-map-demo3`, component: _import('demo/plugins/charts/map/demo3/index.vue'), meta: { ...meta, title: '地图示例 3' } },
|
||||
{ path: 'charts/sankey/demo1', name: `${pre}charts-sankey-demo1`, component: _import('demo/plugins/charts/sankey/demo1/index.vue'), meta: { ...meta, title: '桑基图示例 1' } },
|
||||
{ path: 'charts/heatmap/demo1', name: `${pre}charts-heatmap-demo1`, component: _import('demo/plugins/charts/heatmap/demo1/index.vue'), meta: { ...meta, title: '热力图示例 1' } },
|
||||
{ path: 'charts/heatmap/demo2', name: `${pre}charts-heatmap-demo2`, component: _import('demo/plugins/charts/heatmap/demo2/index.vue'), meta: { ...meta, title: '热力图示例 2' } },
|
||||
{ path: 'charts/scatter/demo1', name: `${pre}charts-scatter-demo1`, component: _import('demo/plugins/charts/scatter/demo1/index.vue'), meta: { ...meta, title: '散点图示例 1' } },
|
||||
{ path: 'charts/scatter/demo2', name: `${pre}charts-scatter-demo2`, component: _import('demo/plugins/charts/scatter/demo2/index.vue'), meta: { ...meta, title: '散点图示例 2' } },
|
||||
{ path: 'charts/candle/demo1', name: `${pre}charts-candle-demo1`, component: _import('demo/plugins/charts/candle/demo1/index.vue'), meta: { ...meta, title: 'K线图示例 1' } },
|
||||
{ path: 'charts/candle/demo2', name: `${pre}charts-candle-demo2`, component: _import('demo/plugins/charts/candle/demo2/index.vue'), meta: { ...meta, title: 'K线图示例 2' } },
|
||||
{ path: 'charts/candle/demo3', name: `${pre}charts-candle-demo3`, component: _import('demo/plugins/charts/candle/demo3/index.vue'), meta: { ...meta, title: 'K线图示例 3' } },
|
||||
{ path: 'charts/gauge/demo1', name: `${pre}charts-gauge-demo1`, component: _import('demo/plugins/charts/gauge/demo1/index.vue'), meta: { ...meta, title: '仪表盘示例 1' } },
|
||||
{ path: 'charts/tree/demo1', name: `${pre}charts-tree-demo1`, component: _import('demo/plugins/charts/tree/demo1/index.vue'), meta: { ...meta, title: '树图示例 1' } }
|
||||
{ path: 'js-cookie', name: `${pre}js-cookie`, component: _import('demo/plugins/js-cookie'), meta: { ...meta, title: 'Cookie' } }
|
||||
])('demo-plugins-')
|
||||
}
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1,13 +0,0 @@
|
|||
import Vue from 'vue'
|
||||
import VCharts from 'v-charts'
|
||||
Vue.use(VCharts)
|
||||
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
pubSetting: {
|
||||
height: '100%'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">一般</template>
|
||||
<div class="inner">
|
||||
<ve-bar :data="chartData" v-bind="pubSetting"></ve-bar>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户', '下单用户', '下单率'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393, 下单用户: 1093, 下单率: 0.32 },
|
||||
{ 日期: '1/2', 访问用户: 3530, 下单用户: 3230, 下单率: 0.26 },
|
||||
{ 日期: '1/3', 访问用户: 2923, 下单用户: 2623, 下单率: 0.76 },
|
||||
{ 日期: '1/4', 访问用户: 1723, 下单用户: 1423, 下单率: 0.49 },
|
||||
{ 日期: '1/5', 访问用户: 3792, 下单用户: 3492, 下单率: 0.323 },
|
||||
{ 日期: '1/6', 访问用户: 4593, 下单用户: 4293, 下单率: 0.78 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">指定指标维度</template>
|
||||
<div class="inner">
|
||||
<ve-bar :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-bar>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
dimension: ['日期'],
|
||||
metrics: ['访问用户']
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户', '下单用户', '下单率'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393, 下单用户: 1093, 下单率: 0.32 },
|
||||
{ 日期: '1/2', 访问用户: 3530, 下单用户: 3230, 下单率: 0.26 },
|
||||
{ 日期: '1/3', 访问用户: 2923, 下单用户: 2623, 下单率: 0.76 },
|
||||
{ 日期: '1/4', 访问用户: 1723, 下单用户: 1423, 下单率: 0.49 },
|
||||
{ 日期: '1/5', 访问用户: 3792, 下单用户: 3492, 下单率: 0.323 },
|
||||
{ 日期: '1/6', 访问用户: 4593, 下单用户: 4293, 下单率: 0.78 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,53 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">排序条形图</template>
|
||||
<div class="inner">
|
||||
<ve-bar :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-bar>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
metrics: ['访问用户'],
|
||||
dataOrder: {
|
||||
label: '访问用户',
|
||||
order: 'desc'
|
||||
}
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户', '下单用户', '下单率'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393, 下单用户: 1093, 下单率: 0.32 },
|
||||
{ 日期: '1/2', 访问用户: 3530, 下单用户: 3230, 下单率: 0.26 },
|
||||
{ 日期: '1/3', 访问用户: 2923, 下单用户: 2623, 下单率: 0.76 },
|
||||
{ 日期: '1/4', 访问用户: 1723, 下单用户: 1423, 下单率: 0.49 },
|
||||
{ 日期: '1/5', 访问用户: 3792, 下单用户: 3492, 下单率: 0.323 },
|
||||
{ 日期: '1/6', 访问用户: 4593, 下单用户: 4293, 下单率: 0.78 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,51 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">堆叠条形图</template>
|
||||
<div class="inner">
|
||||
<ve-bar :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-bar>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
stack: {
|
||||
xxx: ['访问用户', '下单用户']
|
||||
}
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户', '下单用户', '下单率'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393, 下单用户: 1093, 下单率: 0.32 },
|
||||
{ 日期: '1/2', 访问用户: 3530, 下单用户: 3230, 下单率: 0.26 },
|
||||
{ 日期: '1/3', 访问用户: 2923, 下单用户: 2623, 下单率: 0.76 },
|
||||
{ 日期: '1/4', 访问用户: 1723, 下单用户: 1423, 下单率: 0.49 },
|
||||
{ 日期: '1/5', 访问用户: 3792, 下单用户: 3492, 下单率: 0.323 },
|
||||
{ 日期: '1/6', 访问用户: 4593, 下单用户: 4293, 下单率: 0.78 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,49 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">纵轴为连续的数值轴</template>
|
||||
<div class="inner">
|
||||
<ve-bar :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-bar>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
yAxisType: 'value'
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户'],
|
||||
rows: [
|
||||
{ 日期: 1, 访问用户: 1393 },
|
||||
{ 日期: 2, 访问用户: 3530 },
|
||||
{ 日期: 5, 访问用户: 2923 },
|
||||
{ 日期: 10, 访问用户: 1723 },
|
||||
{ 日期: 15, 访问用户: 3792 },
|
||||
{ 日期: 36, 访问用户: 4593 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,78 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">一般</template>
|
||||
<div class="inner">
|
||||
<ve-candle :data="chartData" v-bind="pubSetting"></ve-candle>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', 'open', 'close', 'lowest', 'highest', 'vol'],
|
||||
rows: [
|
||||
{ 日期: '2004-01-05', open: 10411.85, close: 10544.07, lowest: 10411.85, highest: 10575.92, vol: 221290000 },
|
||||
{ 日期: '2004-01-06', open: 10543.85, close: 10538.66, lowest: 10454.37, highest: 10584.07, vol: 191460000 },
|
||||
{ 日期: '2004-01-07', open: 10535.46, close: 10529.03, lowest: 10432.12, highest: 10587.55, vol: 225490000 },
|
||||
{ 日期: '2004-01-08', open: 10530.07, close: 10592.44, lowest: 10480.59, highest: 10651.99, vol: 237770000 },
|
||||
{ 日期: '2004-01-09', open: 10589.25, close: 10458.89, lowest: 10420.52, highest: 10603.48, vol: 223250000 },
|
||||
{ 日期: '2004-01-12', open: 10461.55, close: 10485.18, lowest: 10389.85, highest: 10543.03, vol: 197960000 },
|
||||
{ 日期: '2004-01-13', open: 10485.18, close: 10427.18, lowest: 10341.19, highest: 10539.25, vol: 197310000 },
|
||||
{ 日期: '2004-01-14', open: 10428.67, close: 10538.37, lowest: 10426.89, highest: 10573.85, vol: 186280000 },
|
||||
{ 日期: '2004-01-15', open: 10534.52, close: 10553.85, lowest: 10454.52, highest: 10639.03, vol: 260090000 },
|
||||
{ 日期: '2004-01-16', open: 10556.37, close: 10600.51, lowest: 10503.71, highest: 10666.88, vol: 254170000 },
|
||||
{ 日期: '2004-01-20', open: 10601.42, close: 10528.66, lowest: 10447.92, highest: 10676.96, vol: 224300000 },
|
||||
{ 日期: '2004-01-21', open: 10522.77, close: 10623.62, lowest: 10453.11, highest: 10665.72, vol: 214920000 },
|
||||
{ 日期: '2004-01-22', open: 10624.22, close: 10623.18, lowest: 10545.03, highest: 10717.41, vol: 219720000 },
|
||||
{ 日期: '2004-01-23', open: 10625.25, close: 10568.29, lowest: 10490.14, highest: 10691.77, vol: 234260000 },
|
||||
{ 日期: '2004-01-26', open: 10568.12, close: 10702.51, lowest: 10510.44, highest: 10725.18, vol: 186170000 },
|
||||
{ 日期: '2004-01-27', open: 10701.11, close: 10609.92, lowest: 10579.33, highest: 10748.81, vol: 206560000 },
|
||||
{ 日期: '2004-01-28', open: 10610.07, close: 10468.37, lowest: 10412.44, highest: 10703.25, vol: 247660000 },
|
||||
{ 日期: '2004-01-29', open: 10467.41, close: 10510.29, lowest: 10369.92, highest: 10611.56, vol: 273970000 },
|
||||
{ 日期: '2004-01-30', open: 10510.22, close: 10488.07, lowest: 10385.56, highest: 10551.03, vol: 208990000 },
|
||||
{ 日期: '2004-02-02', open: 10487.78, close: 10499.18, lowest: 10395.55, highest: 10614.44, vol: 224800000 },
|
||||
{ 日期: '2004-02-03', open: 10499.48, close: 10505.18, lowest: 10414.15, highest: 10571.48, vol: 183810000 },
|
||||
{ 日期: '2004-02-04', open: 10503.11, close: 10470.74, lowest: 10394.81, highest: 10567.85, vol: 227760000 },
|
||||
{ 日期: '2004-02-05', open: 10469.33, close: 10495.55, lowest: 10399.92, highest: 10566.37, vol: 187810000 },
|
||||
{ 日期: '2004-02-06', open: 10494.89, close: 10593.03, lowest: 10433.74, highest: 10634.81, vol: 182880000 },
|
||||
{ 日期: '2004-02-09', open: 10592.41, close: 10579.03, lowest: 10433.72, highest: 10634.81, vol: 160720000 },
|
||||
{ 日期: '2004-02-10', open: 10578.74, close: 10613.85, lowest: 10511.18, highest: 10667.03, vol: 160590000 },
|
||||
{ 日期: '2004-02-11', open: 10605.48, close: 10737.72, lowest: 10561.55, highest: 10779.41, vol: 277850000 },
|
||||
{ 日期: '2004-02-12', open: 10735.18, close: 10694.07, lowest: 10636.44, highest: 10775.03, vol: 197560000 },
|
||||
{ 日期: '2004-02-13', open: 10696.22, close: 10627.85, lowest: 10578.66, highest: 10755.47, vol: 208340000 },
|
||||
{ 日期: '2004-02-17', open: 10628.88, close: 10714.88, lowest: 10628.88, highest: 10762.07, vol: 169730000 },
|
||||
{ 日期: '2004-02-18', open: 10706.68, close: 10671.99, lowest: 10623.62, highest: 10764.36, vol: 164370000 },
|
||||
{ 日期: '2004-02-19', open: 10674.59, close: 10664.73, lowest: 10626.44, highest: 10794.95, vol: 219890000 },
|
||||
{ 日期: '2004-02-20', open: 10666.29, close: 10619.03, lowest: 10559.11, highest: 10722.77, vol: 220560000 },
|
||||
{ 日期: '2004-02-23', open: 10619.55, close: 10609.62, lowest: 10508.89, highest: 10711.84, vol: 229950000 },
|
||||
{ 日期: '2004-02-24', open: 10609.55, close: 10566.37, lowest: 10479.33, highest: 10681.41, vol: 225670000 },
|
||||
{ 日期: '2004-02-25', open: 10566.59, close: 10601.62, lowest: 10509.42, highest: 10660.73, vol: 192420000 },
|
||||
{ 日期: '2004-02-26', open: 10598.14, close: 10580.14, lowest: 10493.71, highest: 10652.96, vol: 223230000 },
|
||||
{ 日期: '2004-02-27', open: 10581.55, close: 10583.92, lowest: 10519.03, highest: 10689.55, vol: 200050000 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,82 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">显示 MA VOL</template>
|
||||
<div class="inner">
|
||||
<ve-candle :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-candle>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
showMA: true,
|
||||
showVol: true
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', 'open', 'close', 'lowest', 'highest', 'vol'],
|
||||
rows: [
|
||||
{ 日期: '2004-01-05', open: 10411.85, close: 10544.07, lowest: 10411.85, highest: 10575.92, vol: 221290000 },
|
||||
{ 日期: '2004-01-06', open: 10543.85, close: 10538.66, lowest: 10454.37, highest: 10584.07, vol: 191460000 },
|
||||
{ 日期: '2004-01-07', open: 10535.46, close: 10529.03, lowest: 10432.12, highest: 10587.55, vol: 225490000 },
|
||||
{ 日期: '2004-01-08', open: 10530.07, close: 10592.44, lowest: 10480.59, highest: 10651.99, vol: 237770000 },
|
||||
{ 日期: '2004-01-09', open: 10589.25, close: 10458.89, lowest: 10420.52, highest: 10603.48, vol: 223250000 },
|
||||
{ 日期: '2004-01-12', open: 10461.55, close: 10485.18, lowest: 10389.85, highest: 10543.03, vol: 197960000 },
|
||||
{ 日期: '2004-01-13', open: 10485.18, close: 10427.18, lowest: 10341.19, highest: 10539.25, vol: 197310000 },
|
||||
{ 日期: '2004-01-14', open: 10428.67, close: 10538.37, lowest: 10426.89, highest: 10573.85, vol: 186280000 },
|
||||
{ 日期: '2004-01-15', open: 10534.52, close: 10553.85, lowest: 10454.52, highest: 10639.03, vol: 260090000 },
|
||||
{ 日期: '2004-01-16', open: 10556.37, close: 10600.51, lowest: 10503.71, highest: 10666.88, vol: 254170000 },
|
||||
{ 日期: '2004-01-20', open: 10601.42, close: 10528.66, lowest: 10447.92, highest: 10676.96, vol: 224300000 },
|
||||
{ 日期: '2004-01-21', open: 10522.77, close: 10623.62, lowest: 10453.11, highest: 10665.72, vol: 214920000 },
|
||||
{ 日期: '2004-01-22', open: 10624.22, close: 10623.18, lowest: 10545.03, highest: 10717.41, vol: 219720000 },
|
||||
{ 日期: '2004-01-23', open: 10625.25, close: 10568.29, lowest: 10490.14, highest: 10691.77, vol: 234260000 },
|
||||
{ 日期: '2004-01-26', open: 10568.12, close: 10702.51, lowest: 10510.44, highest: 10725.18, vol: 186170000 },
|
||||
{ 日期: '2004-01-27', open: 10701.11, close: 10609.92, lowest: 10579.33, highest: 10748.81, vol: 206560000 },
|
||||
{ 日期: '2004-01-28', open: 10610.07, close: 10468.37, lowest: 10412.44, highest: 10703.25, vol: 247660000 },
|
||||
{ 日期: '2004-01-29', open: 10467.41, close: 10510.29, lowest: 10369.92, highest: 10611.56, vol: 273970000 },
|
||||
{ 日期: '2004-01-30', open: 10510.22, close: 10488.07, lowest: 10385.56, highest: 10551.03, vol: 208990000 },
|
||||
{ 日期: '2004-02-02', open: 10487.78, close: 10499.18, lowest: 10395.55, highest: 10614.44, vol: 224800000 },
|
||||
{ 日期: '2004-02-03', open: 10499.48, close: 10505.18, lowest: 10414.15, highest: 10571.48, vol: 183810000 },
|
||||
{ 日期: '2004-02-04', open: 10503.11, close: 10470.74, lowest: 10394.81, highest: 10567.85, vol: 227760000 },
|
||||
{ 日期: '2004-02-05', open: 10469.33, close: 10495.55, lowest: 10399.92, highest: 10566.37, vol: 187810000 },
|
||||
{ 日期: '2004-02-06', open: 10494.89, close: 10593.03, lowest: 10433.74, highest: 10634.81, vol: 182880000 },
|
||||
{ 日期: '2004-02-09', open: 10592.41, close: 10579.03, lowest: 10433.72, highest: 10634.81, vol: 160720000 },
|
||||
{ 日期: '2004-02-10', open: 10578.74, close: 10613.85, lowest: 10511.18, highest: 10667.03, vol: 160590000 },
|
||||
{ 日期: '2004-02-11', open: 10605.48, close: 10737.72, lowest: 10561.55, highest: 10779.41, vol: 277850000 },
|
||||
{ 日期: '2004-02-12', open: 10735.18, close: 10694.07, lowest: 10636.44, highest: 10775.03, vol: 197560000 },
|
||||
{ 日期: '2004-02-13', open: 10696.22, close: 10627.85, lowest: 10578.66, highest: 10755.47, vol: 208340000 },
|
||||
{ 日期: '2004-02-17', open: 10628.88, close: 10714.88, lowest: 10628.88, highest: 10762.07, vol: 169730000 },
|
||||
{ 日期: '2004-02-18', open: 10706.68, close: 10671.99, lowest: 10623.62, highest: 10764.36, vol: 164370000 },
|
||||
{ 日期: '2004-02-19', open: 10674.59, close: 10664.73, lowest: 10626.44, highest: 10794.95, vol: 219890000 },
|
||||
{ 日期: '2004-02-20', open: 10666.29, close: 10619.03, lowest: 10559.11, highest: 10722.77, vol: 220560000 },
|
||||
{ 日期: '2004-02-23', open: 10619.55, close: 10609.62, lowest: 10508.89, highest: 10711.84, vol: 229950000 },
|
||||
{ 日期: '2004-02-24', open: 10609.55, close: 10566.37, lowest: 10479.33, highest: 10681.41, vol: 225670000 },
|
||||
{ 日期: '2004-02-25', open: 10566.59, close: 10601.62, lowest: 10509.42, highest: 10660.73, vol: 192420000 },
|
||||
{ 日期: '2004-02-26', open: 10598.14, close: 10580.14, lowest: 10493.71, highest: 10652.96, vol: 223230000 },
|
||||
{ 日期: '2004-02-27', open: 10581.55, close: 10583.92, lowest: 10519.03, highest: 10689.55, vol: 200050000 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,89 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">修改指标名和图例文字</template>
|
||||
<div class="inner">
|
||||
<ve-candle :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-candle>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
showMA: true,
|
||||
showVol: true,
|
||||
labelMap: {
|
||||
MA5: 'ma5'
|
||||
},
|
||||
legendName: {
|
||||
日K: 'day k'
|
||||
},
|
||||
showDataZoom: true
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', 'open', 'close', 'lowest', 'highest', 'vol'],
|
||||
rows: [
|
||||
{ 日期: '2004-01-05', open: 10411.85, close: 10544.07, lowest: 10411.85, highest: 10575.92, vol: 221290000 },
|
||||
{ 日期: '2004-01-06', open: 10543.85, close: 10538.66, lowest: 10454.37, highest: 10584.07, vol: 191460000 },
|
||||
{ 日期: '2004-01-07', open: 10535.46, close: 10529.03, lowest: 10432.12, highest: 10587.55, vol: 225490000 },
|
||||
{ 日期: '2004-01-08', open: 10530.07, close: 10592.44, lowest: 10480.59, highest: 10651.99, vol: 237770000 },
|
||||
{ 日期: '2004-01-09', open: 10589.25, close: 10458.89, lowest: 10420.52, highest: 10603.48, vol: 223250000 },
|
||||
{ 日期: '2004-01-12', open: 10461.55, close: 10485.18, lowest: 10389.85, highest: 10543.03, vol: 197960000 },
|
||||
{ 日期: '2004-01-13', open: 10485.18, close: 10427.18, lowest: 10341.19, highest: 10539.25, vol: 197310000 },
|
||||
{ 日期: '2004-01-14', open: 10428.67, close: 10538.37, lowest: 10426.89, highest: 10573.85, vol: 186280000 },
|
||||
{ 日期: '2004-01-15', open: 10534.52, close: 10553.85, lowest: 10454.52, highest: 10639.03, vol: 260090000 },
|
||||
{ 日期: '2004-01-16', open: 10556.37, close: 10600.51, lowest: 10503.71, highest: 10666.88, vol: 254170000 },
|
||||
{ 日期: '2004-01-20', open: 10601.42, close: 10528.66, lowest: 10447.92, highest: 10676.96, vol: 224300000 },
|
||||
{ 日期: '2004-01-21', open: 10522.77, close: 10623.62, lowest: 10453.11, highest: 10665.72, vol: 214920000 },
|
||||
{ 日期: '2004-01-22', open: 10624.22, close: 10623.18, lowest: 10545.03, highest: 10717.41, vol: 219720000 },
|
||||
{ 日期: '2004-01-23', open: 10625.25, close: 10568.29, lowest: 10490.14, highest: 10691.77, vol: 234260000 },
|
||||
{ 日期: '2004-01-26', open: 10568.12, close: 10702.51, lowest: 10510.44, highest: 10725.18, vol: 186170000 },
|
||||
{ 日期: '2004-01-27', open: 10701.11, close: 10609.92, lowest: 10579.33, highest: 10748.81, vol: 206560000 },
|
||||
{ 日期: '2004-01-28', open: 10610.07, close: 10468.37, lowest: 10412.44, highest: 10703.25, vol: 247660000 },
|
||||
{ 日期: '2004-01-29', open: 10467.41, close: 10510.29, lowest: 10369.92, highest: 10611.56, vol: 273970000 },
|
||||
{ 日期: '2004-01-30', open: 10510.22, close: 10488.07, lowest: 10385.56, highest: 10551.03, vol: 208990000 },
|
||||
{ 日期: '2004-02-02', open: 10487.78, close: 10499.18, lowest: 10395.55, highest: 10614.44, vol: 224800000 },
|
||||
{ 日期: '2004-02-03', open: 10499.48, close: 10505.18, lowest: 10414.15, highest: 10571.48, vol: 183810000 },
|
||||
{ 日期: '2004-02-04', open: 10503.11, close: 10470.74, lowest: 10394.81, highest: 10567.85, vol: 227760000 },
|
||||
{ 日期: '2004-02-05', open: 10469.33, close: 10495.55, lowest: 10399.92, highest: 10566.37, vol: 187810000 },
|
||||
{ 日期: '2004-02-06', open: 10494.89, close: 10593.03, lowest: 10433.74, highest: 10634.81, vol: 182880000 },
|
||||
{ 日期: '2004-02-09', open: 10592.41, close: 10579.03, lowest: 10433.72, highest: 10634.81, vol: 160720000 },
|
||||
{ 日期: '2004-02-10', open: 10578.74, close: 10613.85, lowest: 10511.18, highest: 10667.03, vol: 160590000 },
|
||||
{ 日期: '2004-02-11', open: 10605.48, close: 10737.72, lowest: 10561.55, highest: 10779.41, vol: 277850000 },
|
||||
{ 日期: '2004-02-12', open: 10735.18, close: 10694.07, lowest: 10636.44, highest: 10775.03, vol: 197560000 },
|
||||
{ 日期: '2004-02-13', open: 10696.22, close: 10627.85, lowest: 10578.66, highest: 10755.47, vol: 208340000 },
|
||||
{ 日期: '2004-02-17', open: 10628.88, close: 10714.88, lowest: 10628.88, highest: 10762.07, vol: 169730000 },
|
||||
{ 日期: '2004-02-18', open: 10706.68, close: 10671.99, lowest: 10623.62, highest: 10764.36, vol: 164370000 },
|
||||
{ 日期: '2004-02-19', open: 10674.59, close: 10664.73, lowest: 10626.44, highest: 10794.95, vol: 219890000 },
|
||||
{ 日期: '2004-02-20', open: 10666.29, close: 10619.03, lowest: 10559.11, highest: 10722.77, vol: 220560000 },
|
||||
{ 日期: '2004-02-23', open: 10619.55, close: 10609.62, lowest: 10508.89, highest: 10711.84, vol: 229950000 },
|
||||
{ 日期: '2004-02-24', open: 10609.55, close: 10566.37, lowest: 10479.33, highest: 10681.41, vol: 225670000 },
|
||||
{ 日期: '2004-02-25', open: 10566.59, close: 10601.62, lowest: 10509.42, highest: 10660.73, vol: 192420000 },
|
||||
{ 日期: '2004-02-26', open: 10598.14, close: 10580.14, lowest: 10493.71, highest: 10652.96, vol: 223230000 },
|
||||
{ 日期: '2004-02-27', open: 10581.55, close: 10583.92, lowest: 10519.03, highest: 10689.55, vol: 200050000 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,44 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">一般</template>
|
||||
<div class="inner">
|
||||
<ve-funnel :data="chartData" v-bind="pubSetting"></ve-funnel>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['状态', '数值'],
|
||||
rows: [
|
||||
{ 状态: '展示', 数值: 900 },
|
||||
{ 状态: '访问', 数值: 600 },
|
||||
{ 状态: '点击', 数值: 300 },
|
||||
{ 状态: '订单', 数值: 100 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,47 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">金字塔</template>
|
||||
<div class="inner">
|
||||
<ve-funnel :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-funnel>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
ascending: true
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['状态', '数值'],
|
||||
rows: [
|
||||
{ 状态: '展示', 数值: 900 },
|
||||
{ 状态: '访问', 数值: 600 },
|
||||
{ 状态: '点击', 数值: 300 },
|
||||
{ 状态: '订单', 数值: 100 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,41 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">一般</template>
|
||||
<div class="inner">
|
||||
<ve-gauge :data="chartData" v-bind="pubSetting"></ve-gauge>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['type', 'a', 'b', 'value'],
|
||||
rows: [
|
||||
{ type: '速度', value: 80, a: 1, b: 2 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">一般</template>
|
||||
<div class="inner">
|
||||
<ve-heatmap :data="chartData" v-bind="pubSetting"></ve-heatmap>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['时间', '地点', '人数'],
|
||||
rows: [
|
||||
{ 时间: '星期一', 地点: '北京', 人数: 1000 },
|
||||
{ 时间: '星期二', 地点: '上海', 人数: 400 },
|
||||
{ 时间: '星期三', 地点: '杭州', 人数: 800 },
|
||||
{ 时间: '星期二', 地点: '深圳', 人数: 200 },
|
||||
{ 时间: '星期三', 地点: '长春', 人数: 100 },
|
||||
{ 时间: '星期五', 地点: '南京', 人数: 300 },
|
||||
{ 时间: '星期四', 地点: '江苏', 人数: 800 },
|
||||
{ 时间: '星期一', 地点: '北京', 人数: 700 },
|
||||
{ 时间: '星期三', 地点: '上海', 人数: 300 },
|
||||
{ 时间: '星期二', 地点: '杭州', 人数: 500 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,70 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">地图热力图</template>
|
||||
<div class="inner">
|
||||
<ve-heatmap :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-heatmap>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
position: 'china',
|
||||
type: 'map',
|
||||
geo: {
|
||||
label: {
|
||||
emphasis: {
|
||||
show: false
|
||||
}
|
||||
},
|
||||
itemStyle: {
|
||||
normal: {
|
||||
areaColor: '#323c48',
|
||||
borderColor: '#111'
|
||||
},
|
||||
emphasis: {
|
||||
areaColor: '#2a333d'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['lat', 'lng', '人数'],
|
||||
rows: [
|
||||
{ lat: 115.892151, lng: 28.676493, 人数: 1000 },
|
||||
{ lat: 117.000923, lng: 36.675807, 人数: 400 },
|
||||
{ lat: 113.665412, lng: 34.757975, 人数: 800 },
|
||||
{ lat: 114.298572, lng: 30.584355, 人数: 200 },
|
||||
{ lat: 112.982279, lng: 28.19409, 人数: 100 },
|
||||
{ lat: 113.280637, lng: 23.125178, 人数: 300 },
|
||||
{ lat: 110.33119, lng: 20.031971, 人数: 800 },
|
||||
{ lat: 104.065735, lng: 30.659462, 人数: 700 },
|
||||
{ lat: 108.948024, lng: 34.263161, 人数: 300 },
|
||||
{ lat: 103.823557, lng: 36.058039, 人数: 500 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">一般</template>
|
||||
<div class="inner">
|
||||
<ve-histogram :data="chartData" v-bind="pubSetting"></ve-histogram>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户', '下单用户', '下单率'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393, 下单用户: 1093, 下单率: 0.32 },
|
||||
{ 日期: '1/2', 访问用户: 3530, 下单用户: 3230, 下单率: 0.26 },
|
||||
{ 日期: '1/3', 访问用户: 2923, 下单用户: 2623, 下单率: 0.76 },
|
||||
{ 日期: '1/4', 访问用户: 1723, 下单用户: 1423, 下单率: 0.49 },
|
||||
{ 日期: '1/5', 访问用户: 3792, 下单用户: 3492, 下单率: 0.323 },
|
||||
{ 日期: '1/6', 访问用户: 4593, 下单用户: 4293, 下单率: 0.78 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">设置显示的指标维度</template>
|
||||
<div class="inner">
|
||||
<ve-histogram :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-histogram>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
metrics: ['访问用户', '下单用户'],
|
||||
dimension: ['日期']
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户', '下单用户', '下单率'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393, 下单用户: 1093, 下单率: 0.32 },
|
||||
{ 日期: '1/2', 访问用户: 3530, 下单用户: 3230, 下单率: 0.26 },
|
||||
{ 日期: '1/3', 访问用户: 2923, 下单用户: 2623, 下单率: 0.76 },
|
||||
{ 日期: '1/4', 访问用户: 1723, 下单用户: 1423, 下单率: 0.49 },
|
||||
{ 日期: '1/5', 访问用户: 3792, 下单用户: 3492, 下单率: 0.323 },
|
||||
{ 日期: '1/6', 访问用户: 4593, 下单用户: 4293, 下单率: 0.78 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,49 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">柱状图+折线图</template>
|
||||
<div class="inner">
|
||||
<ve-histogram :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-histogram>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
showLine: ['下单用户']
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户', '下单用户', '下单率'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393, 下单用户: 1093, 下单率: 0.32 },
|
||||
{ 日期: '1/2', 访问用户: 3530, 下单用户: 3230, 下单率: 0.26 },
|
||||
{ 日期: '1/3', 访问用户: 2923, 下单用户: 2623, 下单率: 0.76 },
|
||||
{ 日期: '1/4', 访问用户: 1723, 下单用户: 1423, 下单率: 0.49 },
|
||||
{ 日期: '1/5', 访问用户: 3792, 下单用户: 3492, 下单率: 0.323 },
|
||||
{ 日期: '1/6', 访问用户: 4593, 下单用户: 4293, 下单率: 0.78 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,49 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">堆叠柱状图</template>
|
||||
<div class="inner">
|
||||
<ve-histogram :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-histogram>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
stack: { 用户: ['访问用户', '下单用户'] }
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户', '下单用户', '下单率'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393, 下单用户: 1093, 下单率: 0.32 },
|
||||
{ 日期: '1/2', 访问用户: 3530, 下单用户: 3230, 下单率: 0.26 },
|
||||
{ 日期: '1/3', 访问用户: 2923, 下单用户: 2623, 下单率: 0.76 },
|
||||
{ 日期: '1/4', 访问用户: 1723, 下单用户: 1423, 下单率: 0.49 },
|
||||
{ 日期: '1/5', 访问用户: 3792, 下单用户: 3492, 下单率: 0.323 },
|
||||
{ 日期: '1/6', 访问用户: 4593, 下单用户: 4293, 下单率: 0.78 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,51 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">默认显示柱状图数据</template>
|
||||
<div class="inner">
|
||||
<ve-histogram :data="chartData" :extend="extend" v-bind="pubSetting"></ve-histogram>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
extend: {
|
||||
series: {
|
||||
label: { show: true, position: 'top' }
|
||||
}
|
||||
},
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户', '下单用户', '下单率'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393, 下单用户: 1093, 下单率: 0.32 },
|
||||
{ 日期: '1/2', 访问用户: 3530, 下单用户: 3230, 下单率: 0.26 },
|
||||
{ 日期: '1/3', 访问用户: 2923, 下单用户: 2623, 下单率: 0.76 },
|
||||
{ 日期: '1/4', 访问用户: 1723, 下单用户: 1423, 下单率: 0.49 },
|
||||
{ 日期: '1/5', 访问用户: 3792, 下单用户: 3492, 下单率: 0.323 },
|
||||
{ 日期: '1/6', 访问用户: 4593, 下单用户: 4293, 下单率: 0.78 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,49 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">横轴为连续的数值轴</template>
|
||||
<div class="inner">
|
||||
<ve-histogram :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-histogram>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
xAxisType: 'value'
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户', '下单用户', '下单率'],
|
||||
rows: [
|
||||
{ 日期: 1, 访问用户: 1393, 下单用户: 1093, 下单率: 0.32 },
|
||||
{ 日期: 2, 访问用户: 3530, 下单用户: 3230, 下单率: 0.26 },
|
||||
{ 日期: 5, 访问用户: 2923, 下单用户: 2623, 下单率: 0.76 },
|
||||
{ 日期: 10, 访问用户: 1723, 下单用户: 1423, 下单率: 0.49 },
|
||||
{ 日期: 20, 访问用户: 3792, 下单用户: 3492, 下单率: 0.323 },
|
||||
{ 日期: 22, 访问用户: 4593, 下单用户: 4293, 下单率: 0.78 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">一般</template>
|
||||
<div class="inner">
|
||||
<ve-line :data="chartData" v-bind="pubSetting"></ve-line>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户', '下单用户', '下单率'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393, 下单用户: 1093, 下单率: 0.32 },
|
||||
{ 日期: '1/2', 访问用户: 3530, 下单用户: 3230, 下单率: 0.26 },
|
||||
{ 日期: '1/3', 访问用户: 2923, 下单用户: 2623, 下单率: 0.76 },
|
||||
{ 日期: '1/4', 访问用户: 1723, 下单用户: 1423, 下单率: 0.49 },
|
||||
{ 日期: '1/5', 访问用户: 3792, 下单用户: 3492, 下单率: 0.323 },
|
||||
{ 日期: '1/6', 访问用户: 4593, 下单用户: 4293, 下单率: 0.78 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,55 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">横坐标的倾斜</template>
|
||||
<div class="inner">
|
||||
<ve-line :data="chartData" :extend="extend" v-bind="pubSetting"></ve-line>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
extend: {
|
||||
'xAxis.0.axisLabel.rotate': 45
|
||||
},
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户', '下单用户', '下单率'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393, 下单用户: 1093, 下单率: 0.32 },
|
||||
{ 日期: '1/2', 访问用户: 3530, 下单用户: 3230, 下单率: 0.26 },
|
||||
{ 日期: '1/3', 访问用户: 2923, 下单用户: 2623, 下单率: 0.76 },
|
||||
{ 日期: '1/4', 访问用户: 1723, 下单用户: 1423, 下单率: 0.49 },
|
||||
{ 日期: '1/5', 访问用户: 3792, 下单用户: 3492, 下单率: 0.323 },
|
||||
{ 日期: '1/6', 访问用户: 4593, 下单用户: 4293, 下单率: 0.78 },
|
||||
{ 日期: '1/7', 访问用户: 1393, 下单用户: 1093, 下单率: 0.32 },
|
||||
{ 日期: '1/8', 访问用户: 3530, 下单用户: 3230, 下单率: 0.26 },
|
||||
{ 日期: '1/9', 访问用户: 2923, 下单用户: 2623, 下单率: 0.76 },
|
||||
{ 日期: '1/10', 访问用户: 1723, 下单用户: 1423, 下单率: 0.49 },
|
||||
{ 日期: '1/11', 访问用户: 3792, 下单用户: 3492, 下单率: 0.323 },
|
||||
{ 日期: '1/12', 访问用户: 4593, 下单用户: 4293, 下单率: 0.78 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">堆叠面积图</template>
|
||||
<div class="inner">
|
||||
<ve-line :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-line>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
stack: { 用户: ['访问用户', '下单用户'] },
|
||||
area: true
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户', '下单用户', '下单率'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393, 下单用户: 1093, 下单率: 0.32 },
|
||||
{ 日期: '1/2', 访问用户: 3530, 下单用户: 3230, 下单率: 0.26 },
|
||||
{ 日期: '1/3', 访问用户: 2923, 下单用户: 2623, 下单率: 0.76 },
|
||||
{ 日期: '1/4', 访问用户: 1723, 下单用户: 1423, 下单率: 0.49 },
|
||||
{ 日期: '1/5', 访问用户: 3792, 下单用户: 3492, 下单率: 0.323 },
|
||||
{ 日期: '1/6', 访问用户: 4593, 下单用户: 4293, 下单率: 0.78 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,55 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">显示指标数值</template>
|
||||
<div class="inner">
|
||||
<ve-line :data="chartData" :extend="extend" v-bind="pubSetting"></ve-line>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
extend: {
|
||||
series: {
|
||||
label: {
|
||||
normal: {
|
||||
show: true
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户', '下单用户', '下单率'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393, 下单用户: 1093, 下单率: 0.32 },
|
||||
{ 日期: '1/2', 访问用户: 3530, 下单用户: 3230, 下单率: 0.26 },
|
||||
{ 日期: '1/3', 访问用户: 2923, 下单用户: 2623, 下单率: 0.76 },
|
||||
{ 日期: '1/4', 访问用户: 1723, 下单用户: 1423, 下单率: 0.49 },
|
||||
{ 日期: '1/5', 访问用户: 3792, 下单用户: 3492, 下单率: 0.323 },
|
||||
{ 日期: '1/6', 访问用户: 4593, 下单用户: 4293, 下单率: 0.78 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,55 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">设置别名</template>
|
||||
<div class="inner">
|
||||
<ve-line :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-line>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
labelMap: {
|
||||
PV: '访问用户',
|
||||
Order: '下单用户'
|
||||
},
|
||||
legendName: {
|
||||
访问用户: '访问用户 total: 10000'
|
||||
}
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['date', 'PV', 'Order', 'OrderRate'],
|
||||
rows: [
|
||||
{ date: '1/1', PV: 1393, Order: 1093, OrderRate: 0.32 },
|
||||
{ date: '1/2', PV: 3530, Order: 3230, OrderRate: 0.26 },
|
||||
{ date: '1/3', PV: 2923, Order: 2623, OrderRate: 0.76 },
|
||||
{ date: '1/4', PV: 1723, Order: 1423, OrderRate: 0.49 },
|
||||
{ date: '1/5', PV: 3792, Order: 3492, OrderRate: 0.323 },
|
||||
{ date: '1/6', PV: 4593, Order: 4293, OrderRate: 0.78 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">一般</template>
|
||||
<div class="inner">
|
||||
<ve-map :data="chartData" v-bind="pubSetting" :settings="chartSettings"></ve-map>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
import mapOrigin from '@/views/demo/plugins/charts/_data/china'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
chartSettings: {
|
||||
mapOrigin
|
||||
},
|
||||
chartData: {
|
||||
columns: ['位置', '税收', '人口', '面积'],
|
||||
rows: [
|
||||
{ 位置: '吉林', 税收: 123, 人口: 123, 面积: 92134 },
|
||||
{ 位置: '北京', 税收: 1223, 人口: 2123, 面积: 29234 },
|
||||
{ 位置: '上海', 税收: 2123, 人口: 1243, 面积: 94234 },
|
||||
{ 位置: '浙江', 税收: 4123, 人口: 5123, 面积: 29234 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,49 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">设置城市</template>
|
||||
<div class="inner">
|
||||
<ve-map :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-map>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
import mapOrigin from '@/views/demo/plugins/charts/_data/beijing'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
chartSettings: {
|
||||
position: 'province/beijing',
|
||||
mapOrigin
|
||||
},
|
||||
chartData: {
|
||||
columns: ['位置', '人口'],
|
||||
rows: [
|
||||
{ 位置: '延庆区', 人口: 123 },
|
||||
{ 位置: '密云区', 人口: 1223 },
|
||||
{ 位置: '平谷区', 人口: 2123 },
|
||||
{ 位置: '海淀区', 人口: 4123 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,56 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">设置样式</template>
|
||||
<div class="inner">
|
||||
<ve-map :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-map>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
import mapOrigin from '@/views/demo/plugins/charts/_data/china'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
chartSettings: {
|
||||
position: 'china',
|
||||
mapOrigin,
|
||||
label: false,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
borderColor: '#00f'
|
||||
}
|
||||
},
|
||||
zoom: 1.2
|
||||
},
|
||||
chartData: {
|
||||
columns: ['位置', '人口'],
|
||||
rows: [
|
||||
{ 位置: '吉林', ' 人口': 123 },
|
||||
{ 位置: '北京', ' 人口': 1223 },
|
||||
{ 位置: '上海', ' 人口': 2123 },
|
||||
{ 位置: '浙江', ' 人口': 4123 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">一般</template>
|
||||
<div class="inner">
|
||||
<ve-pie :data="chartData" v-bind="pubSetting"></ve-pie>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393 },
|
||||
{ 日期: '1/2', 访问用户: 3530 },
|
||||
{ 日期: '1/3', 访问用户: 2923 },
|
||||
{ 日期: '1/4', 访问用户: 1723 },
|
||||
{ 日期: '1/5', 访问用户: 3792 },
|
||||
{ 日期: '1/6', 访问用户: 4593 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">设置指标维度</template>
|
||||
<div class="inner">
|
||||
<ve-pie :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-pie>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
dimension: '日期',
|
||||
metrics: '访问用户'
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393 },
|
||||
{ 日期: '1/2', 访问用户: 3530 },
|
||||
{ 日期: '1/3', 访问用户: 2923 },
|
||||
{ 日期: '1/4', 访问用户: 1723 },
|
||||
{ 日期: '1/5', 访问用户: 3792 },
|
||||
{ 日期: '1/6', 访问用户: 4593 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,49 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">玫瑰图</template>
|
||||
<div class="inner">
|
||||
<ve-pie :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-pie>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
roseType: 'radius'
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393 },
|
||||
{ 日期: '1/2', 访问用户: 3530 },
|
||||
{ 日期: '1/3', 访问用户: 2923 },
|
||||
{ 日期: '1/4', 访问用户: 1723 },
|
||||
{ 日期: '1/5', 访问用户: 3792 },
|
||||
{ 日期: '1/6', 访问用户: 4593 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,49 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">限制显示条数饼图</template>
|
||||
<div class="inner">
|
||||
<ve-pie :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-pie>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
limitShowNum: 5
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393 },
|
||||
{ 日期: '1/2', 访问用户: 3530 },
|
||||
{ 日期: '1/3', 访问用户: 2923 },
|
||||
{ 日期: '1/4', 访问用户: 1723 },
|
||||
{ 日期: '1/5', 访问用户: 3792 },
|
||||
{ 日期: '1/6', 访问用户: 4593 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,52 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">多圆饼图</template>
|
||||
<div class="inner">
|
||||
<ve-pie :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-pie>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
level: [
|
||||
['1/1', '1/2', '1/3'],
|
||||
['1/4', '1/5']
|
||||
]
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393 },
|
||||
{ 日期: '1/2', 访问用户: 3530 },
|
||||
{ 日期: '1/3', 访问用户: 2923 },
|
||||
{ 日期: '1/4', 访问用户: 1723 },
|
||||
{ 日期: '1/5', 访问用户: 3792 },
|
||||
{ 日期: '1/6', 访问用户: 4593 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">设置饼图半径边距</template>
|
||||
<div class="inner">
|
||||
<ve-pie :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-pie>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
radius: 150,
|
||||
offsetY: 250
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393 },
|
||||
{ 日期: '1/2', 访问用户: 3530 },
|
||||
{ 日期: '1/3', 访问用户: 2923 },
|
||||
{ 日期: '1/4', 访问用户: 1723 },
|
||||
{ 日期: '1/5', 访问用户: 3792 },
|
||||
{ 日期: '1/6', 访问用户: 4593 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">一般</template>
|
||||
<div class="inner">
|
||||
<ve-radar :data="chartData" v-bind="pubSetting"></ve-radar>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户', '下单用户', '下单率'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393, 下单用户: 1093, 下单率: 0.32 },
|
||||
{ 日期: '1/2', 访问用户: 3530, 下单用户: 3230, 下单率: 0.26 },
|
||||
{ 日期: '1/3', 访问用户: 2923, 下单用户: 2623, 下单率: 0.76 },
|
||||
{ 日期: '1/4', 访问用户: 1723, 下单用户: 1423, 下单率: 0.49 },
|
||||
{ 日期: '1/5', 访问用户: 3792, 下单用户: 3492, 下单率: 0.323 },
|
||||
{ 日期: '1/6', 访问用户: 4593, 下单用户: 4293, 下单率: 0.78 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">一般</template>
|
||||
<div class="inner">
|
||||
<ve-ring :data="chartData" v-bind="pubSetting"></ve-ring>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393 },
|
||||
{ 日期: '1/2', 访问用户: 3530 },
|
||||
{ 日期: '1/3', 访问用户: 2923 },
|
||||
{ 日期: '1/4', 访问用户: 1723 },
|
||||
{ 日期: '1/5', 访问用户: 3792 },
|
||||
{ 日期: '1/6', 访问用户: 4593 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">指定指标维度</template>
|
||||
<div class="inner">
|
||||
<ve-ring :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-ring>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
dimension: '日期',
|
||||
metrics: '访问用户'
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393 },
|
||||
{ 日期: '1/2', 访问用户: 3530 },
|
||||
{ 日期: '1/3', 访问用户: 2923 },
|
||||
{ 日期: '1/4', 访问用户: 1723 },
|
||||
{ 日期: '1/5', 访问用户: 3792 },
|
||||
{ 日期: '1/6', 访问用户: 4593 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,49 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">玫瑰图</template>
|
||||
<div class="inner">
|
||||
<ve-ring :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-ring>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
roseType: 'radius'
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393 },
|
||||
{ 日期: '1/2', 访问用户: 3530 },
|
||||
{ 日期: '1/3', 访问用户: 2923 },
|
||||
{ 日期: '1/4', 访问用户: 1723 },
|
||||
{ 日期: '1/5', 访问用户: 3792 },
|
||||
{ 日期: '1/6', 访问用户: 4593 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,49 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">限制显示条数环图</template>
|
||||
<div class="inner">
|
||||
<ve-ring :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-ring>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
limitShowNum: 3
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393 },
|
||||
{ 日期: '1/2', 访问用户: 3530 },
|
||||
{ 日期: '1/3', 访问用户: 2923 },
|
||||
{ 日期: '1/4', 访问用户: 1723 },
|
||||
{ 日期: '1/5', 访问用户: 3792 },
|
||||
{ 日期: '1/6', 访问用户: 4593 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">设置环图半径</template>
|
||||
<div class="inner">
|
||||
<ve-ring :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-ring>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
radius: [30, 100],
|
||||
offsetY: 250
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 1393 },
|
||||
{ 日期: '1/2', 访问用户: 3530 },
|
||||
{ 日期: '1/3', 访问用户: 2923 },
|
||||
{ 日期: '1/4', 访问用户: 1723 },
|
||||
{ 日期: '1/5', 访问用户: 3792 },
|
||||
{ 日期: '1/6', 访问用户: 4593 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,57 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">一般</template>
|
||||
<div class="inner">
|
||||
<ve-sankey :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-sankey>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
links: [
|
||||
{ source: '首页', target: '列表页a', value: 0.5 },
|
||||
{ source: '首页', target: '列表页b', value: 0.5 },
|
||||
{ source: '列表页a', target: '内容页a-1', value: 0.1 },
|
||||
{ source: '列表页a', target: '内容页a-2', value: 0.4 },
|
||||
{ source: '列表页b', target: '内容页b-1', value: 0.2 },
|
||||
{ source: '列表页b', target: '内容页b-2', value: 0.3 }
|
||||
]
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['页面', '访问量'],
|
||||
rows: [
|
||||
{ 页面: '首页', 访问量: 100000 },
|
||||
{ 页面: '列表页a', 访问量: 20000 },
|
||||
{ 页面: '列表页b', 访问量: 80000 },
|
||||
{ 页面: '内容页a-1', 访问量: 10000 },
|
||||
{ 页面: '内容页a-2', 访问量: 10000 },
|
||||
{ 页面: '内容页b-1', 访问量: 60000 },
|
||||
{ 页面: '内容页b-2', 访问量: 20000 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">单维度多指标</template>
|
||||
<div class="inner">
|
||||
<ve-scatter :data="chartData" v-bind="pubSetting"></ve-scatter>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户', '下单用户', '年龄'],
|
||||
rows: [
|
||||
{ 日期: '1/1', 访问用户: 123, 年龄: 3, 下单用户: 1244 },
|
||||
{ 日期: '1/2', 访问用户: 1223, 年龄: 6, 下单用户: 2344 },
|
||||
{ 日期: '1/3', 访问用户: 7123, 年龄: 9, 下单用户: 3245 },
|
||||
{ 日期: '1/4', 访问用户: 4123, 年龄: 12, 下单用户: 4355 },
|
||||
{ 日期: '1/5', 访问用户: 3123, 年龄: 15, 下单用户: 4564 },
|
||||
{ 日期: '1/6', 访问用户: 2323, 年龄: 20, 下单用户: 6537 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,64 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">双维度多指标</template>
|
||||
<div class="inner">
|
||||
<ve-scatter :data="chartData" v-bind="pubSetting"></ve-scatter>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['日期', '访问用户', '下单用户', '年龄'],
|
||||
rows: {
|
||||
上海: [
|
||||
{ 日期: '1/1', 访问用户: 123, 年龄: 3, 下单用户: 1244 },
|
||||
{ 日期: '1/2', 访问用户: 1223, 年龄: 6, 下单用户: 2344 },
|
||||
{ 日期: '1/3', 访问用户: 7123, 年龄: 9, 下单用户: 3245 },
|
||||
{ 日期: '1/4', 访问用户: 4123, 年龄: 12, 下单用户: 4355 },
|
||||
{ 日期: '1/5', 访问用户: 3123, 年龄: 15, 下单用户: 4564 },
|
||||
{ 日期: '1/6', 访问用户: 2323, 年龄: 20, 下单用户: 6537 }
|
||||
],
|
||||
北京: [
|
||||
{ 日期: '1/1', 访问用户: 123, 年龄: 3, 下单用户: 1244 },
|
||||
{ 日期: '1/2', 访问用户: 1273, 年龄: 6, 下单用户: 2344 },
|
||||
{ 日期: '1/3', 访问用户: 3123, 年龄: 15, 下单用户: 4564 },
|
||||
{ 日期: '1/4', 访问用户: 2123, 年龄: 9, 下单用户: 3245 },
|
||||
{ 日期: '1/5', 访问用户: 4103, 年龄: 12, 下单用户: 4355 },
|
||||
{ 日期: '1/6', 访问用户: 7123, 年龄: 10, 下单用户: 3567 }
|
||||
],
|
||||
广州: [
|
||||
{ 日期: '1/1', 访问用户: 123, 年龄: 3, 下单用户: 1244 },
|
||||
{ 日期: '1/2', 访问用户: 1223, 年龄: 6, 下单用户: 2344 },
|
||||
{ 日期: '1/3', 访问用户: 2123, 年龄: 30, 下单用户: 3245 },
|
||||
{ 日期: '1/5', 访问用户: 4123, 年龄: 12, 下单用户: 4355 },
|
||||
{ 日期: '1/4', 访问用户: 5123, 年龄: 18, 下单用户: 4564 },
|
||||
{ 日期: '1/6', 访问用户: 3843, 年龄: 30, 下单用户: 4850 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,127 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">径向树图</template>
|
||||
<div class="inner">
|
||||
<ve-tree :data="chartData" :settings="chartSettings" v-bind="pubSetting"></ve-tree>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
this.chartSettings = {
|
||||
seriesMap: {
|
||||
tree1: {
|
||||
layout: 'radial'
|
||||
}
|
||||
}
|
||||
}
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['name', 'value'],
|
||||
rows: [
|
||||
{
|
||||
name: 'tree1',
|
||||
value: [
|
||||
{
|
||||
name: 'f',
|
||||
value: 1,
|
||||
link: 'https://ele.me',
|
||||
children: [
|
||||
{
|
||||
name: 'a',
|
||||
value: 1,
|
||||
link: 'https://ele.me',
|
||||
children: [
|
||||
{
|
||||
name: 'a-a',
|
||||
link: 'https://ele.me',
|
||||
value: 2
|
||||
},
|
||||
{
|
||||
name: 'a-b',
|
||||
link: 'https://ele.me',
|
||||
value: 2
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'b',
|
||||
value: 1,
|
||||
link: 'https://ele.me',
|
||||
children: [
|
||||
{
|
||||
name: 'b-a',
|
||||
link: 'https://ele.me',
|
||||
value: 2
|
||||
},
|
||||
{
|
||||
name: 'b-b',
|
||||
link: 'https://ele.me',
|
||||
value: 2
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'c',
|
||||
value: 3,
|
||||
link: 'https://ele.me',
|
||||
children: [
|
||||
{
|
||||
name: 'c-a',
|
||||
link: 'https://ele.me',
|
||||
value: 4
|
||||
},
|
||||
{
|
||||
name: 'c-b',
|
||||
link: 'https://ele.me',
|
||||
value: 2
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'd',
|
||||
value: 3,
|
||||
link: 'https://ele.me',
|
||||
children: [
|
||||
{
|
||||
name: 'd-a',
|
||||
link: 'https://ele.me',
|
||||
value: 4
|
||||
},
|
||||
{
|
||||
name: 'd-b',
|
||||
link: 'https://ele.me',
|
||||
value: 2
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,43 +0,0 @@
|
|||
<template>
|
||||
<d2-container>
|
||||
<template slot="header">一般</template>
|
||||
<div class="inner">
|
||||
<ve-waterfall :data="chartData" v-bind="pubSetting"></ve-waterfall>
|
||||
</div>
|
||||
<d2-link-btn
|
||||
slot="footer"
|
||||
title="更多示例和文档"
|
||||
link="https://v-charts.js.org"/>
|
||||
</d2-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import list from '@/views/demo/plugins/charts/_mixin/list.js'
|
||||
export default {
|
||||
mixins: [
|
||||
list
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
chartData: {
|
||||
columns: ['活动', '时间'],
|
||||
rows: [
|
||||
{ 活动: '吃饭', 时间: 4 },
|
||||
{ 活动: '睡觉', 时间: 10 },
|
||||
{ 活动: '打豆豆', 时间: 5 }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.inner {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
bottom: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue