You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
62 lines
1.1 KiB
62 lines
1.1 KiB
<template>
|
|
<view class="lineChart">
|
|
<qiun-data-charts type="area" :opts="opts" :chartData="chartData" />
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import qiunDataCharts from "../qiun-data-charts/components/qiun-data-charts/qiun-data-charts.vue"
|
|
export default {
|
|
name: "lineChart",
|
|
components: {
|
|
qiunDataCharts
|
|
},
|
|
data() {
|
|
return {
|
|
chartData: {
|
|
categories: ["1月", "2月", "3月", "4月", "5月", "6月"],
|
|
series: [{
|
|
name: "成交量",
|
|
data: [10, 128, 25, 137, 40, 210]
|
|
}, ]
|
|
},
|
|
opts: {
|
|
color: ["#21BBF3", "#91CB74", "#FAC858", "#EE6666", "#73C0DE", "#3CA272", "#FC8452", "#9A60B4",
|
|
"#ea7ccc"
|
|
],
|
|
padding: [5, 10, 0, 5],
|
|
enableScroll: false,
|
|
dataLabel: false,
|
|
legend: {
|
|
show: false
|
|
},
|
|
xAxis: {
|
|
disableGrid: true,
|
|
boundaryGap: 'justify'
|
|
},
|
|
yAxis: {
|
|
gridType: "dash",
|
|
dashLength: 2
|
|
},
|
|
extra: {
|
|
area: {
|
|
type: "curve",
|
|
width: 2,
|
|
activeType: "none"
|
|
}
|
|
}
|
|
}
|
|
};
|
|
},
|
|
methods:{
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.lineChart {
|
|
width: 100%;
|
|
min-height: 400rpx;
|
|
}
|
|
</style>
|
|
|