mirror of
https://github.com/pure-admin/vue-pure-admin.git
synced 2025-06-06 08:27:54 +08:00
perf: echarts
This commit is contained in:
xiaoxian521
parent
679cfae7fb
commit
488719227a
5
package-lock.json
generated
5
package-lock.json
generated
@ -2025,11 +2025,6 @@
|
||||
"integrity": "sha1-n5VxD1CiZ5R7LMwSR0HBAoQn5xM=",
|
||||
"dev": true
|
||||
},
|
||||
"v-contextmenu": {
|
||||
"version": "3.0.0-alpha.4",
|
||||
"resolved": "https://registry.npm.taobao.org/v-contextmenu/download/v-contextmenu-3.0.0-alpha.4.tgz",
|
||||
"integrity": "sha1-9GWYrJivrF1duMZUDfwSMEztEUA="
|
||||
},
|
||||
"vite": {
|
||||
"version": "2.2.1",
|
||||
"resolved": "https://registry.npmjs.org/vite/-/vite-2.2.1.tgz",
|
||||
|
||||
@ -25,7 +25,6 @@
|
||||
"path": "^0.12.7",
|
||||
"path-to-regexp": "^6.2.0",
|
||||
"resize-observer-polyfill": "^1.5.1",
|
||||
"v-contextmenu": "^3.0.0-alpha.4",
|
||||
"vue": "^3.0.11",
|
||||
"vue-i18n": "^9.1.6",
|
||||
"vue-json-pretty": "^2.0.2",
|
||||
|
||||
@ -67,7 +67,7 @@ export default defineComponent({
|
||||
// 国际化语言切换
|
||||
const toggleLang = (): void => {
|
||||
langs.value = !langs.value;
|
||||
langs.value ? (locale.value = "ch") : (locale.value = "en");
|
||||
langs.value ? (locale.value = "zh") : (locale.value = "en");
|
||||
};
|
||||
|
||||
// 退出登录
|
||||
|
||||
59
src/plugins/echarts/index.ts
Normal file
59
src/plugins/echarts/index.ts
Normal file
@ -0,0 +1,59 @@
|
||||
import * as echarts from "echarts/core";
|
||||
|
||||
import {
|
||||
BarChart,
|
||||
LineChart,
|
||||
PieChart,
|
||||
MapChart,
|
||||
PictorialBarChart,
|
||||
RadarChart,
|
||||
} from "echarts/charts";
|
||||
|
||||
import {
|
||||
TitleComponent,
|
||||
TooltipComponent,
|
||||
GridComponent,
|
||||
PolarComponent,
|
||||
AriaComponent,
|
||||
ParallelComponent,
|
||||
LegendComponent,
|
||||
RadarComponent,
|
||||
ToolboxComponent,
|
||||
DataZoomComponent,
|
||||
VisualMapComponent,
|
||||
TimelineComponent,
|
||||
CalendarComponent,
|
||||
} from "echarts/components";
|
||||
|
||||
import { SVGRenderer } from "echarts/renderers";
|
||||
|
||||
const { use, registerTheme } = echarts;
|
||||
|
||||
use([
|
||||
LegendComponent,
|
||||
TitleComponent,
|
||||
TooltipComponent,
|
||||
GridComponent,
|
||||
PolarComponent,
|
||||
AriaComponent,
|
||||
ParallelComponent,
|
||||
BarChart,
|
||||
LineChart,
|
||||
PieChart,
|
||||
MapChart,
|
||||
RadarChart,
|
||||
SVGRenderer,
|
||||
PictorialBarChart,
|
||||
RadarComponent,
|
||||
ToolboxComponent,
|
||||
DataZoomComponent,
|
||||
VisualMapComponent,
|
||||
TimelineComponent,
|
||||
CalendarComponent,
|
||||
]);
|
||||
|
||||
// 自定义主题
|
||||
import theme from "./theme.json";
|
||||
registerTheme("ovilia-green", theme);
|
||||
|
||||
export default echarts;
|
||||
394
src/plugins/echarts/theme.json
Normal file
394
src/plugins/echarts/theme.json
Normal file
@ -0,0 +1,394 @@
|
||||
{
|
||||
"color": ["#4ea397", "#22c3aa", "#7bd9a5"],
|
||||
"backgroundColor": "rgba(0,0,0,0)",
|
||||
"textStyle": {},
|
||||
"title": {
|
||||
"textStyle": {
|
||||
"color": "#666666"
|
||||
},
|
||||
"subtextStyle": {
|
||||
"color": "#999999"
|
||||
}
|
||||
},
|
||||
"line": {
|
||||
"itemStyle": {
|
||||
"borderWidth": "2"
|
||||
},
|
||||
"lineStyle": {
|
||||
"width": "3"
|
||||
},
|
||||
"symbolSize": "10",
|
||||
"symbol": "emptyCircle",
|
||||
"smooth": true
|
||||
},
|
||||
"radar": {
|
||||
"itemStyle": {
|
||||
"borderWidth": "2"
|
||||
},
|
||||
"lineStyle": {
|
||||
"width": "3"
|
||||
},
|
||||
"symbolSize": "10",
|
||||
"symbol": "emptyCircle",
|
||||
"smooth": true
|
||||
},
|
||||
"bar": {
|
||||
"itemStyle": {
|
||||
"barBorderWidth": "0",
|
||||
"barBorderColor": "#444444"
|
||||
},
|
||||
"emphasis": {
|
||||
"itemStyle": {
|
||||
"barBorderWidth": "0",
|
||||
"barBorderColor": "#444444"
|
||||
}
|
||||
}
|
||||
},
|
||||
"pie": {
|
||||
"itemStyle": {
|
||||
"borderWidth": "0",
|
||||
"borderColor": "#444444"
|
||||
},
|
||||
"emphasis": {
|
||||
"itemStyle": {
|
||||
"borderWidth": "0",
|
||||
"borderColor": "#444444"
|
||||
}
|
||||
}
|
||||
},
|
||||
"scatter": {
|
||||
"itemStyle": {
|
||||
"borderWidth": "0",
|
||||
"borderColor": "#444444"
|
||||
},
|
||||
"emphasis": {
|
||||
"itemStyle": {
|
||||
"borderWidth": "0",
|
||||
"borderColor": "#444444"
|
||||
}
|
||||
}
|
||||
},
|
||||
"boxplot": {
|
||||
"itemStyle": {
|
||||
"borderWidth": "0",
|
||||
"borderColor": "#444444"
|
||||
},
|
||||
"emphasis": {
|
||||
"itemStyle": {
|
||||
"borderWidth": "0",
|
||||
"borderColor": "#444444"
|
||||
}
|
||||
}
|
||||
},
|
||||
"parallel": {
|
||||
"itemStyle": {
|
||||
"borderWidth": "0",
|
||||
"borderColor": "#444444"
|
||||
},
|
||||
"emphasis": {
|
||||
"itemStyle": {
|
||||
"borderWidth": "0",
|
||||
"borderColor": "#444444"
|
||||
}
|
||||
}
|
||||
},
|
||||
"sankey": {
|
||||
"itemStyle": {
|
||||
"borderWidth": "0",
|
||||
"borderColor": "#444444"
|
||||
},
|
||||
"emphasis": {
|
||||
"itemStyle": {
|
||||
"borderWidth": "0",
|
||||
"borderColor": "#444444"
|
||||
}
|
||||
}
|
||||
},
|
||||
"funnel": {
|
||||
"itemStyle": {
|
||||
"borderWidth": "0",
|
||||
"borderColor": "#444444"
|
||||
},
|
||||
"emphasis": {
|
||||
"itemStyle": {
|
||||
"borderWidth": "0",
|
||||
"borderColor": "#444444"
|
||||
}
|
||||
}
|
||||
},
|
||||
"gauge": {
|
||||
"itemStyle": {
|
||||
"borderWidth": "0",
|
||||
"borderColor": "#444444"
|
||||
},
|
||||
"emphasis": {
|
||||
"itemStyle": {
|
||||
"borderWidth": "0",
|
||||
"borderColor": "#444444"
|
||||
}
|
||||
}
|
||||
},
|
||||
"candlestick": {
|
||||
"itemStyle": {
|
||||
"color": "#d0648a",
|
||||
"color0": "#ffffff",
|
||||
"borderColor": "#d0648a",
|
||||
"borderColor0": "#22c3aa",
|
||||
"borderWidth": 1
|
||||
}
|
||||
},
|
||||
"graph": {
|
||||
"itemStyle": {
|
||||
"borderWidth": "0",
|
||||
"borderColor": "#444444"
|
||||
},
|
||||
"lineStyle": {
|
||||
"width": 1,
|
||||
"color": "#aaa"
|
||||
},
|
||||
"symbolSize": "10",
|
||||
"symbol": "emptyCircle",
|
||||
"smooth": true,
|
||||
"color": ["#4ea397", "#22c3aa", "#7bd9a5"],
|
||||
"label": {
|
||||
"color": "#ffffff"
|
||||
}
|
||||
},
|
||||
"map": {
|
||||
"itemStyle": {
|
||||
"areaColor": "#eeeeee",
|
||||
"borderColor": "#999999",
|
||||
"borderWidth": "0.5"
|
||||
},
|
||||
"emphasis": {
|
||||
"itemStyle": {
|
||||
"areaColor": "rgba(34,195,170,0.25)",
|
||||
"borderColor": "#22c3aa",
|
||||
"borderWidth": "0.5"
|
||||
},
|
||||
"label": {
|
||||
"color": "rgb(52,158,142)"
|
||||
}
|
||||
},
|
||||
"label": {
|
||||
"color": "#28544e"
|
||||
}
|
||||
},
|
||||
"geo": {
|
||||
"itemStyle": {
|
||||
"areaColor": "#eeeeee",
|
||||
"borderColor": "#999999",
|
||||
"borderWidth": "0.5"
|
||||
},
|
||||
"emphasis": {
|
||||
"itemStyle": {
|
||||
"areaColor": "rgba(34,195,170,0.25)",
|
||||
"borderColor": "#22c3aa",
|
||||
"borderWidth": "0.5"
|
||||
},
|
||||
"label": {
|
||||
"color": "rgb(52,158,142)"
|
||||
}
|
||||
},
|
||||
"label": {
|
||||
"color": "#28544e"
|
||||
}
|
||||
},
|
||||
"categoryAxis": {
|
||||
"axisLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": "#cccccc"
|
||||
}
|
||||
},
|
||||
"axisTick": {
|
||||
"show": false,
|
||||
"lineStyle": {
|
||||
"color": "#333333"
|
||||
}
|
||||
},
|
||||
"axisLabel": {
|
||||
"show": true,
|
||||
"color": "#999999"
|
||||
},
|
||||
"splitLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": ["#eeeeee"]
|
||||
}
|
||||
},
|
||||
"splitArea": {
|
||||
"show": false,
|
||||
"areaStyle": {
|
||||
"color": ["rgba(250,250,250,0.3)", "rgba(200,200,200,0.3)"]
|
||||
}
|
||||
}
|
||||
},
|
||||
"valueAxis": {
|
||||
"axisLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": "#cccccc"
|
||||
}
|
||||
},
|
||||
"axisTick": {
|
||||
"show": false,
|
||||
"lineStyle": {
|
||||
"color": "#333333"
|
||||
}
|
||||
},
|
||||
"axisLabel": {
|
||||
"show": true,
|
||||
"color": "#999999"
|
||||
},
|
||||
"splitLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": ["#eeeeee"]
|
||||
}
|
||||
},
|
||||
"splitArea": {
|
||||
"show": false,
|
||||
"areaStyle": {
|
||||
"color": ["rgba(250,250,250,0.3)", "rgba(200,200,200,0.3)"]
|
||||
}
|
||||
}
|
||||
},
|
||||
"logAxis": {
|
||||
"axisLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": "#cccccc"
|
||||
}
|
||||
},
|
||||
"axisTick": {
|
||||
"show": false,
|
||||
"lineStyle": {
|
||||
"color": "#333333"
|
||||
}
|
||||
},
|
||||
"axisLabel": {
|
||||
"show": true,
|
||||
"color": "#999999"
|
||||
},
|
||||
"splitLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": ["#eeeeee"]
|
||||
}
|
||||
},
|
||||
"splitArea": {
|
||||
"show": false,
|
||||
"areaStyle": {
|
||||
"color": ["rgba(250,250,250,0.3)", "rgba(200,200,200,0.3)"]
|
||||
}
|
||||
}
|
||||
},
|
||||
"timeAxis": {
|
||||
"axisLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": "#cccccc"
|
||||
}
|
||||
},
|
||||
"axisTick": {
|
||||
"show": false,
|
||||
"lineStyle": {
|
||||
"color": "#333333"
|
||||
}
|
||||
},
|
||||
"axisLabel": {
|
||||
"show": true,
|
||||
"color": "#999999"
|
||||
},
|
||||
"splitLine": {
|
||||
"show": true,
|
||||
"lineStyle": {
|
||||
"color": ["#eeeeee"]
|
||||
}
|
||||
},
|
||||
"splitArea": {
|
||||
"show": false,
|
||||
"areaStyle": {
|
||||
"color": ["rgba(250,250,250,0.3)", "rgba(200,200,200,0.3)"]
|
||||
}
|
||||
}
|
||||
},
|
||||
"toolbox": {
|
||||
"iconStyle": {
|
||||
"borderColor": "#aaaaaa"
|
||||
},
|
||||
"emphasis": {
|
||||
"iconStyle": {
|
||||
"borderColor": "#666"
|
||||
}
|
||||
}
|
||||
},
|
||||
"legend": {
|
||||
"textStyle": {
|
||||
"color": "#999999"
|
||||
}
|
||||
},
|
||||
"tooltip": {
|
||||
"axisPointer": {
|
||||
"lineStyle": {
|
||||
"color": "#ccc",
|
||||
"width": 1
|
||||
},
|
||||
"crossStyle": {
|
||||
"color": "#ccc",
|
||||
"width": 1
|
||||
}
|
||||
}
|
||||
},
|
||||
"timeline": {
|
||||
"lineStyle": {
|
||||
"color": "#349e8e",
|
||||
"width": 1
|
||||
},
|
||||
"itemStyle": {
|
||||
"color": "#349e8e",
|
||||
"borderWidth": "1"
|
||||
},
|
||||
"emphasis": {
|
||||
"itemStyle": {
|
||||
"color": "#57e8d2"
|
||||
}
|
||||
},
|
||||
"controlStyle": {
|
||||
"color": "#349e8e",
|
||||
"borderColor": "#349e8e",
|
||||
"borderWidth": "0"
|
||||
},
|
||||
"checkpointStyle": {
|
||||
"color": "#22c3aa",
|
||||
"borderColor": "rgba(34,195,170,0.25)"
|
||||
},
|
||||
"label": {
|
||||
"color": "#349e8e"
|
||||
}
|
||||
},
|
||||
"visualMap": {
|
||||
"color": ["#d0648a", "#22c3aa", "rgba(123,217,165,0.2)"]
|
||||
},
|
||||
"dataZoom": {
|
||||
"backgroundColor": "#fff",
|
||||
"dataBackgroundColor": "#dedede",
|
||||
"fillerColor": "rgba(34,195,170,0.25)",
|
||||
"handleColor": "#dddddd",
|
||||
"handleSize": "100%",
|
||||
"textStyle": {
|
||||
"color": "#999"
|
||||
}
|
||||
},
|
||||
"markPoint": {
|
||||
"label": {
|
||||
"color": "#ffffff",
|
||||
"emphasis": {
|
||||
"textStyle": {
|
||||
"color": "#ffffff"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user