SliverHorn
4 years ago
9 changed files with 27 additions and 808 deletions
-
8server/api/v1/sys_auto_code.go
-
4server/model/sys_auto_code.go
-
2web/src/utils/request.js
-
120web/src/view/dashboard/component/RaddarChart.vue
-
391web/src/view/dashboard/component/Sunburst.vue
-
93web/src/view/dashboard/component/animition.vue
-
167web/src/view/dashboard/component/stackMap.vue
-
27web/src/view/dashboard/index.vue
-
17web/src/view/systemTools/autoCode/index.vue
@ -1,120 +0,0 @@ |
|||||
<template> |
|
||||
<div :class="className" :style="{height:height,width:width}" /> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
import echarts from 'echarts' |
|
||||
require('echarts/theme/macarons') // echarts theme |
|
||||
|
|
||||
const animationDuration = 3000 |
|
||||
|
|
||||
export default { |
|
||||
name:'RaddarChart', |
|
||||
props: { |
|
||||
className: { |
|
||||
type: String, |
|
||||
default: 'chart' |
|
||||
}, |
|
||||
width: { |
|
||||
type: String, |
|
||||
default: '100%' |
|
||||
}, |
|
||||
height: { |
|
||||
type: String, |
|
||||
default: '300px' |
|
||||
} |
|
||||
}, |
|
||||
data() { |
|
||||
return { |
|
||||
chart: null |
|
||||
} |
|
||||
}, |
|
||||
mounted() { |
|
||||
this.initChart() |
|
||||
/* this.__resizeHandler = debounce(() => { |
|
||||
if (this.chart) { |
|
||||
this.chart.resize() |
|
||||
} |
|
||||
}, 100) |
|
||||
window.addEventListener('resize', this.__resizeHandler)*/ |
|
||||
}, |
|
||||
beforeDestroy() { |
|
||||
if (!this.chart) { |
|
||||
return |
|
||||
} |
|
||||
// window.removeEventListener('resize', this.__resizeHandler) |
|
||||
this.chart.dispose() |
|
||||
this.chart = null |
|
||||
}, |
|
||||
methods: { |
|
||||
initChart() { |
|
||||
this.chart = echarts.init(this.$el, 'light') |
|
||||
|
|
||||
this.chart.setOption({ |
|
||||
tooltip: { |
|
||||
trigger: 'axis', |
|
||||
axisPointer: { // 坐标轴指示器,坐标轴触发有效 |
|
||||
type: 'shadow' // 默认为直线,可选为:'line' | 'shadow' |
|
||||
} |
|
||||
}, |
|
||||
radar: { |
|
||||
radius: '66%', |
|
||||
center: ['50%', '42%'], |
|
||||
splitNumber: 8, |
|
||||
splitArea: { |
|
||||
areaStyle: { |
|
||||
color: 'rgba(255,192,203,.3)', |
|
||||
opacity: 1, |
|
||||
shadowBlur: 45, |
|
||||
shadowColor: 'rgba(0,0,0,.5)', |
|
||||
shadowOffsetX: 0, |
|
||||
shadowOffsetY: 15 |
|
||||
} |
|
||||
}, |
|
||||
indicator: [ |
|
||||
{ name: 'Sales', max: 10000 }, |
|
||||
{ name: 'Administration', max: 20000 }, |
|
||||
{ name: 'Information Techology', max: 20000 }, |
|
||||
{ name: 'Customer Support', max: 20000 }, |
|
||||
{ name: 'Development', max: 20000 }, |
|
||||
{ name: 'Marketing', max: 20000 } |
|
||||
] |
|
||||
}, |
|
||||
legend: { |
|
||||
left: 'center', |
|
||||
bottom: '10', |
|
||||
data: ['Allocated Budget', 'Expected Spending', 'Actual Spending'] |
|
||||
}, |
|
||||
series: [{ |
|
||||
type: 'radar', |
|
||||
symbolSize: 0, |
|
||||
areaStyle: { |
|
||||
normal: { |
|
||||
shadowBlur: 13, |
|
||||
shadowColor: 'rgba(0,0,0,.2)', |
|
||||
shadowOffsetX: 0, |
|
||||
shadowOffsetY: 10, |
|
||||
opacity: 1 |
|
||||
} |
|
||||
}, |
|
||||
data: [ |
|
||||
{ |
|
||||
value: [5000, 7000, 12000, 11000, 15000, 14000], |
|
||||
name: 'Allocated Budget' |
|
||||
}, |
|
||||
{ |
|
||||
value: [4000, 9000, 15000, 15000, 13000, 11000], |
|
||||
name: 'Expected Spending' |
|
||||
}, |
|
||||
{ |
|
||||
value: [5500, 11000, 12000, 15000, 12000, 12000], |
|
||||
name: 'Actual Spending' |
|
||||
} |
|
||||
], |
|
||||
animationDuration: animationDuration |
|
||||
}] |
|
||||
}) |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
@ -1,391 +0,0 @@ |
|||||
<template> |
|
||||
<div :class="className" :style="{height:height,width:width}" /> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
import echarts from 'echarts' |
|
||||
require('echarts/theme/macarons') // echarts theme |
|
||||
|
|
||||
const animationDuration = 3000 |
|
||||
|
|
||||
export default { |
|
||||
name: "Sunburst", |
|
||||
props: { |
|
||||
className: { |
|
||||
type: String, |
|
||||
default: 'chart' |
|
||||
}, |
|
||||
width: { |
|
||||
type: String, |
|
||||
default: '100%' |
|
||||
}, |
|
||||
height: { |
|
||||
type: String, |
|
||||
default: '300px' |
|
||||
} |
|
||||
}, |
|
||||
data() { |
|
||||
return { |
|
||||
chart: null, |
|
||||
datas:[ |
|
||||
{ |
|
||||
name: 'Flora', |
|
||||
itemStyle: { |
|
||||
color: '#da0d68' |
|
||||
}, |
|
||||
children: [{ |
|
||||
name: 'Black Tea', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#975e6d' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Floral', |
|
||||
itemStyle: { |
|
||||
color: '#e0719c' |
|
||||
}, |
|
||||
children: [{ |
|
||||
name: 'Chamomile', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#f99e1c' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Rose', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#ef5a78' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Jasmine', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#f7f1bd' |
|
||||
} |
|
||||
}] |
|
||||
}] |
|
||||
}, |
|
||||
{ |
|
||||
name: 'Fruity', |
|
||||
itemStyle: { |
|
||||
color: '#da1d23' |
|
||||
}, |
|
||||
children: [{ |
|
||||
name: 'Berry', |
|
||||
itemStyle: { |
|
||||
color: '#dd4c51' |
|
||||
}, |
|
||||
children: [{ |
|
||||
name: 'Blackberry', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#3e0317' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Raspberry', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#e62969' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Blueberry', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#6569b0' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Strawberry', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#ef2d36' |
|
||||
} |
|
||||
}] |
|
||||
}, { |
|
||||
name: 'Dried Fruit', |
|
||||
itemStyle: { |
|
||||
color: '#c94a44' |
|
||||
}, |
|
||||
children: [{ |
|
||||
name: 'Raisin', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#b53b54' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Prune', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#a5446f' |
|
||||
} |
|
||||
}] |
|
||||
}, { |
|
||||
name: 'Other Fruit', |
|
||||
itemStyle: { |
|
||||
color: '#dd4c51' |
|
||||
}, |
|
||||
children: [{ |
|
||||
name: 'Coconut', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#f2684b' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Cherry', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#e73451' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Pomegranate', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#e65656' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Pineapple', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#f89a1c' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Grape', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#aeb92c' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Apple', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#4eb849' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Peach', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#f68a5c' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Pear', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#baa635' |
|
||||
} |
|
||||
}] |
|
||||
}, { |
|
||||
name: 'Citrus Fruit', |
|
||||
itemStyle: { |
|
||||
color: '#f7a128' |
|
||||
}, |
|
||||
children: [{ |
|
||||
name: 'Grapefruit', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#f26355' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Orange', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#e2631e' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Lemon', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#fde404' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Lime', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#7eb138' |
|
||||
} |
|
||||
}] |
|
||||
}] |
|
||||
}, |
|
||||
{ |
|
||||
name: 'Other', |
|
||||
itemStyle: { |
|
||||
color: '#0aa3b5' |
|
||||
}, |
|
||||
children: [{ |
|
||||
name: 'Papery/Musty', |
|
||||
itemStyle: { |
|
||||
color: '#9db2b7' |
|
||||
}, |
|
||||
children: [{ |
|
||||
name: 'Stale', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#8b8c90' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Cardboard', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#beb276' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Papery', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#fefef4' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Woody', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#744e03' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Moldy/Damp', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#a3a36f' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Musty/Dusty', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#c9b583' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Musty/Earthy', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#978847' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Animalic', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#9d977f' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Meaty Brothy', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#cc7b6a' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Phenolic', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#db646a' |
|
||||
} |
|
||||
}] |
|
||||
}, { |
|
||||
name: 'Chemical', |
|
||||
itemStyle: { |
|
||||
color: '#76c0cb' |
|
||||
}, |
|
||||
children: [{ |
|
||||
name: 'Bitter', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#80a89d' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Salty', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#def2fd' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Medicinal', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#7a9bae' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Petroleum', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#039fb8' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Skunky', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#5e777b' |
|
||||
} |
|
||||
}, { |
|
||||
name: 'Rubber', |
|
||||
value: 1, |
|
||||
itemStyle: { |
|
||||
color: '#120c0c' |
|
||||
} |
|
||||
}] |
|
||||
}] |
|
||||
}, |
|
||||
] |
|
||||
} |
|
||||
}, |
|
||||
mounted() { |
|
||||
this.initChart() |
|
||||
/* this.__resizeHandler = debounce(() => { |
|
||||
if (this.chart) { |
|
||||
this.chart.resize() |
|
||||
} |
|
||||
}, 100) |
|
||||
window.addEventListener('resize', this.__resizeHandler)*/ |
|
||||
}, |
|
||||
beforeDestroy() { |
|
||||
if (!this.chart) { |
|
||||
return |
|
||||
} |
|
||||
// window.removeEventListener('resize', this.__resizeHandler) |
|
||||
this.chart.dispose() |
|
||||
this.chart = null |
|
||||
}, |
|
||||
methods: { |
|
||||
initChart() { |
|
||||
this.chart = echarts.init(this.$el, 'macarons') |
|
||||
|
|
||||
this.chart.setOption({ |
|
||||
|
|
||||
series: { |
|
||||
type: 'sunburst', |
|
||||
highlightPolicy: 'ancestor', |
|
||||
data: this.datas, |
|
||||
radius: [0, '95%'], |
|
||||
sort: null, |
|
||||
levels: [{}, { |
|
||||
r0: '15%', |
|
||||
r: '35%', |
|
||||
itemStyle: { |
|
||||
borderWidth: 2 |
|
||||
}, |
|
||||
label: { |
|
||||
rotate: 'tangential' |
|
||||
} |
|
||||
}, { |
|
||||
r0: '35%', |
|
||||
r: '70%', |
|
||||
label: { |
|
||||
align: 'right' |
|
||||
} |
|
||||
}, { |
|
||||
r0: '70%', |
|
||||
r: '72%', |
|
||||
label: { |
|
||||
position: 'outside', |
|
||||
padding: 3, |
|
||||
silent: false |
|
||||
}, |
|
||||
itemStyle: { |
|
||||
borderWidth: 3 |
|
||||
} |
|
||||
}] |
|
||||
}, |
|
||||
animationDuration: animationDuration |
|
||||
}) |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style scoped> |
|
||||
|
|
||||
</style> |
|
@ -1,93 +0,0 @@ |
|||||
<template> |
|
||||
<div class="container"> |
|
||||
<ul class="moon"> |
|
||||
<li class="crater"></li> |
|
||||
<li class="crater"></li> |
|
||||
<li class="crater"></li> |
|
||||
</ul> |
|
||||
<ul class="mountain-range"> |
|
||||
<li class="mountain"></li> |
|
||||
<li class="mountain"></li> |
|
||||
<li class="mountain"></li> |
|
||||
<li class="mountain"></li> |
|
||||
<li class="mountain"></li> |
|
||||
<li class="mountain"></li> |
|
||||
<li class="mountain"></li> |
|
||||
<li class="mountain"></li> |
|
||||
<li class="mountain"></li> |
|
||||
<li class="mountain"></li> |
|
||||
<li class="mountain"></li> |
|
||||
</ul> |
|
||||
<div class="mountain-range-mask"></div> |
|
||||
<ul class="forest"> |
|
||||
<li class="hill"></li> |
|
||||
<li class="hill"></li> |
|
||||
<li class="hill"></li> |
|
||||
</ul> |
|
||||
<ul class="sparkles"> |
|
||||
<li class="sparkle one"></li> |
|
||||
<li class="sparkle one"></li> |
|
||||
<li class="sparkle one"></li> |
|
||||
<li class="sparkle one"></li> |
|
||||
<li class="sparkle two"></li> |
|
||||
<li class="sparkle two"></li> |
|
||||
<li class="sparkle two"></li> |
|
||||
<li class="sparkle two"></li> |
|
||||
<li class="sparkle three"></li> |
|
||||
<li class="sparkle three"></li> |
|
||||
<li class="sparkle three"></li> |
|
||||
<li class="sparkle three"></li> |
|
||||
<li class="sparkle four"></li> |
|
||||
<li class="sparkle four"></li> |
|
||||
<li class="sparkle four"></li> |
|
||||
<li class="sparkle four"></li> |
|
||||
<li class="sparkle five"></li> |
|
||||
<li class="sparkle five"></li> |
|
||||
<li class="sparkle five"></li> |
|
||||
<li class="sparkle five"></li> |
|
||||
<li class="sparkle six"></li> |
|
||||
<li class="sparkle six"></li> |
|
||||
<li class="sparkle six"></li> |
|
||||
<li class="sparkle six"></li> |
|
||||
<li class="sparkle seven"></li> |
|
||||
<li class="sparkle seven"></li> |
|
||||
<li class="sparkle seven"></li> |
|
||||
<li class="sparkle seven"></li> |
|
||||
<li class="sparkle eight"></li> |
|
||||
<li class="sparkle eight"></li> |
|
||||
<li class="sparkle eight"></li> |
|
||||
<li class="sparkle eight"></li> |
|
||||
</ul> |
|
||||
<div class="grass"> |
|
||||
<div class="pokemon"> |
|
||||
<div class="poke" id="bulbasaur"> |
|
||||
<div class="ear"></div> |
|
||||
<div class="ear"></div> |
|
||||
<div class="head"></div> |
|
||||
<div class="leg"></div> |
|
||||
<div class="bulba-body"></div> |
|
||||
<div class="bulbs"> |
|
||||
<div class="bulb"></div> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div class="poke" id="pikachu"> |
|
||||
<div class="ear"></div> |
|
||||
<div class="ear"></div> |
|
||||
<div class="hand"></div> |
|
||||
<div class="pika-body"></div> |
|
||||
<div class="head"></div> |
|
||||
<div class="pika-tail"></div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</template> |
|
||||
<script> |
|
||||
export default { |
|
||||
name: 'Animition' |
|
||||
} |
|
||||
</script> |
|
||||
<style lang="scss"> |
|
||||
@import '@/style/animition.scss'; |
|
||||
|
|
||||
</style> |
|
@ -1,167 +0,0 @@ |
|||||
<template> |
|
||||
<div :class="className" :style="{height:height,width:width}" /> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
import echarts from 'echarts' |
|
||||
require('echarts/theme/macarons') // echarts theme |
|
||||
|
|
||||
const animationDuration = 3000 |
|
||||
|
|
||||
export default { |
|
||||
name: "stackMap", |
|
||||
props: { |
|
||||
className: { |
|
||||
type: String, |
|
||||
default: 'chart' |
|
||||
}, |
|
||||
width: { |
|
||||
type: String, |
|
||||
default: '100%' |
|
||||
}, |
|
||||
height: { |
|
||||
type: String, |
|
||||
default: '300px' |
|
||||
} |
|
||||
}, |
|
||||
data() { |
|
||||
return { |
|
||||
chart: null |
|
||||
} |
|
||||
}, |
|
||||
mounted() { |
|
||||
this.initChart() |
|
||||
/* this.__resizeHandler = debounce(() => { |
|
||||
if (this.chart) { |
|
||||
this.chart.resize() |
|
||||
} |
|
||||
}, 100) |
|
||||
window.addEventListener('resize', this.__resizeHandler)*/ |
|
||||
}, |
|
||||
beforeDestroy() { |
|
||||
if (!this.chart) { |
|
||||
return |
|
||||
} |
|
||||
// window.removeEventListener('resize', this.__resizeHandler) |
|
||||
this.chart.dispose() |
|
||||
this.chart = null |
|
||||
}, |
|
||||
methods: { |
|
||||
initChart() { |
|
||||
this.chart = echarts.init(this.$el, 'light') |
|
||||
|
|
||||
this.chart.setOption({ |
|
||||
tooltip: { |
|
||||
trigger: 'axis', |
|
||||
axisPointer: { // 坐标轴指示器,坐标轴触发有效 |
|
||||
type: 'shadow' // 默认为直线,可选为:'line' | 'shadow' |
|
||||
} |
|
||||
}, |
|
||||
legend: { |
|
||||
data: ['Javascript', 'Java', 'Python', 'Ruby', 'PHP'] |
|
||||
}, |
|
||||
grid: { |
|
||||
left: '3%', |
|
||||
right: '4%', |
|
||||
bottom: '3%', |
|
||||
containLabel: true |
|
||||
}, |
|
||||
xAxis: { |
|
||||
type: 'value', |
|
||||
axisLabel: { |
|
||||
show: true, |
|
||||
textStyle: { |
|
||||
color: 'rgb(192,192,192)', //更改坐标轴文字颜色 |
|
||||
fontSize : 12 //更改坐标轴文字大小 |
|
||||
} |
|
||||
}, |
|
||||
axisTick: { |
|
||||
show: false |
|
||||
}, |
|
||||
axisLine:{ |
|
||||
lineStyle:{ |
|
||||
color:'rgb(192,192,192)' //更改坐标轴颜色 |
|
||||
} |
|
||||
}, |
|
||||
}, |
|
||||
yAxis: { |
|
||||
type: 'category', |
|
||||
data: ['Mon', 'Tue', 'Wen', 'Thu', 'Fri', 'Sat', 'Sun'], |
|
||||
axisLabel: { |
|
||||
show: true, |
|
||||
textStyle: { |
|
||||
color: 'rgb(192,192,192)', //更改坐标轴文字颜色 |
|
||||
fontSize: 12 //更改坐标轴文字大小 |
|
||||
} |
|
||||
}, |
|
||||
axisTick: { |
|
||||
show: false |
|
||||
}, |
|
||||
axisLine: { |
|
||||
lineStyle: { |
|
||||
color: 'rgb(192,192,192)' //更改坐标轴颜色 |
|
||||
} |
|
||||
} |
|
||||
}, |
|
||||
series: [ |
|
||||
{ |
|
||||
name: 'Javascript', |
|
||||
type: 'bar', |
|
||||
stack: '总量', |
|
||||
label: { |
|
||||
show: true, |
|
||||
position: 'insideRight' |
|
||||
}, |
|
||||
data: [320, 302, 301, 334, 390, 330, 320] |
|
||||
}, |
|
||||
{ |
|
||||
name: 'Java', |
|
||||
type: 'bar', |
|
||||
stack: '总量', |
|
||||
label: { |
|
||||
show: true, |
|
||||
position: 'insideRight' |
|
||||
}, |
|
||||
data: [120, 132, 101, 134, 90, 230, 210] |
|
||||
}, |
|
||||
{ |
|
||||
name: 'Python', |
|
||||
type: 'bar', |
|
||||
stack: '总量', |
|
||||
label: { |
|
||||
show: true, |
|
||||
position: 'insideRight' |
|
||||
}, |
|
||||
data: [220, 182, 191, 234, 290, 330, 310] |
|
||||
}, |
|
||||
{ |
|
||||
name: 'Ruby', |
|
||||
type: 'bar', |
|
||||
stack: '总量', |
|
||||
label: { |
|
||||
show: true, |
|
||||
position: 'insideRight' |
|
||||
}, |
|
||||
data: [150, 212, 201, 154, 190, 330, 410] |
|
||||
}, |
|
||||
{ |
|
||||
name: 'PHP', |
|
||||
type: 'bar', |
|
||||
stack: '总量', |
|
||||
label: { |
|
||||
show: true, |
|
||||
position: 'insideRight' |
|
||||
}, |
|
||||
data: [820, 832, 901, 934, 1290, 1330, 1320] |
|
||||
} |
|
||||
], |
|
||||
animationDuration: animationDuration |
|
||||
}) |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<style scoped> |
|
||||
|
|
||||
</style> |
|
Write
Preview
Loading…
Cancel
Save
Reference in new issue