This commit is contained in:
duanxiaohai
parent
e1cb692d68
commit
1645d0ac18
|
|
@ -13,7 +13,7 @@ import * as echarts from "echarts";
|
|||
const chart = ref(null); // 创建DOM引用
|
||||
|
||||
const data = ["大街乡", "社阳乡", "沐尘畲族乡", "庙下乡", "溪口镇", "罗家乡"];
|
||||
const datas = ["2", "4", "7", " 23", "25", "250"];
|
||||
const datas = ["8", "10", "7", " 23", "25", "250"];
|
||||
|
||||
let zoomShow = true;
|
||||
// if (data.length > 7) {
|
||||
|
|
@ -38,37 +38,56 @@ let option = {
|
|||
containLabel: true,
|
||||
color: "#ffffff",
|
||||
},
|
||||
// dataZoom: [
|
||||
// {//在内部可以纵向拖动
|
||||
// show: zoomShow,
|
||||
// type: "inside",
|
||||
// startValue: 0,
|
||||
// endValue: 2,
|
||||
// minValueSpan: 2,
|
||||
// maxValueSpan: 2,
|
||||
// yAxisIndex: [0],
|
||||
// zoomOnMouseWheel: false, // 关闭滚轮缩放
|
||||
// moveOnMouseWheel: true, // 开启滚轮平移
|
||||
// moveOnMouseMove: true, // 鼠标移动能触发数据窗口平移
|
||||
// },
|
||||
// { //纵向使用滚动条
|
||||
// show: zoomShow,
|
||||
// type: "slider",
|
||||
// realtime: true,
|
||||
// startValue: 0,
|
||||
// endValue: 2,
|
||||
// width: "3.5",
|
||||
// height: "80%",
|
||||
// yAxisIndex: [0], // 控制y轴滚动
|
||||
// fillerColor: "rgba(154, 181, 215, 1)", // 滚动条颜色
|
||||
// borderColor: "rgba(17, 100, 210, 0.12)",
|
||||
// backgroundColor: "#cfcfcf", //两边未选中的滑动条区域的颜色
|
||||
// handleSize: 0, // 两边手柄尺寸
|
||||
// showDataShadow: false, //是否显示数据阴影 默认auto
|
||||
// showDetail: false, // 拖拽时是否展示滚动条两侧的文字
|
||||
// top: "1%",
|
||||
// right: "5",//距离右侧的距离
|
||||
// },
|
||||
// ],
|
||||
dataZoom: [
|
||||
{
|
||||
show: zoomShow,
|
||||
type: "inside",
|
||||
startValue: 0,
|
||||
endValue: 2,
|
||||
minValueSpan: 2,
|
||||
maxValueSpan: 2,
|
||||
yAxisIndex: [0],
|
||||
{//纵向使用滚动条
|
||||
id: "dataZoomY",
|
||||
type: "slider",
|
||||
yAxisIndex: [0],// 控制y轴滚动
|
||||
filterMode: "empty",//数据过滤,只改变数轴范围。
|
||||
width: "10",
|
||||
height: "100%",
|
||||
right: "3%",//距离右侧的距离
|
||||
orient: "vertical" ,//布局方式是横还是竖 'horizontal'：水平。'vertical'：竖直。
|
||||
// zoomLock: true, //不能缩放
|
||||
start: 0,//开始 数据窗口范围的,范围是：0 ~ 100
|
||||
end: 70,//结束
|
||||
handleSize: 8,
|
||||
zoomOnMouseWheel: false, // 关闭滚轮缩放
|
||||
moveOnMouseWheel: true, // 开启滚轮平移
|
||||
moveOnMouseMove: true, // 鼠标移动能触发数据窗口平移
|
||||
},
|
||||
{
|
||||
show: zoomShow,
|
||||
type: "slider",
|
||||
realtime: true,
|
||||
startValue: 0,
|
||||
endValue: 2,
|
||||
width: "3.5",
|
||||
height: "80%",
|
||||
yAxisIndex: [0], // 控制y轴滚动
|
||||
fillerColor: "rgba(154, 181, 215, 1)", // 滚动条颜色
|
||||
borderColor: "rgba(17, 100, 210, 0.12)",
|
||||
backgroundColor: "#cfcfcf", //两边未选中的滑动条区域的颜色
|
||||
handleSize: 0, // 两边手柄尺寸
|
||||
showDataShadow: false, //是否显示数据阴影 默认auto
|
||||
showDetail: false, // 拖拽时是否展示滚动条两侧的文字
|
||||
top: "1%",
|
||||
right: "5",
|
||||
},
|
||||
],
|
||||
calculable: true,
|
||||
xAxis: {
|
||||
|
|
@ -98,6 +117,11 @@ let option = {
|
|||
width: 1,
|
||||
},
|
||||
},
|
||||
axisPointer: {
|
||||
label: {
|
||||
autoSplitNumber: 5,
|
||||
},
|
||||
},
|
||||
},
|
||||
yAxis: {
|
||||
type: "category", //横向显示
|
||||
|
|
@ -106,7 +130,7 @@ let option = {
|
|||
//y轴文字的配置
|
||||
axisLabel: {
|
||||
inside: false,
|
||||
bargap: 0.5, // 设置固定的间隔
|
||||
// bargap: 0.5, // 设置固定的间隔
|
||||
textStyle: {
|
||||
color: "#ffffff",
|
||||
},
|
||||
|
|
@ -121,11 +145,11 @@ let option = {
|
|||
},
|
||||
},
|
||||
// 开启滚动
|
||||
scrollbar: {
|
||||
orient: "vertical",
|
||||
// 设置滚动区域的高度
|
||||
height: 100,
|
||||
},
|
||||
// scrollbar: {
|
||||
// orient: "vertical",
|
||||
// // 设置滚动区域的高度
|
||||
// height: 100,
|
||||
// },
|
||||
//分割线配置
|
||||
splitLine: {
|
||||
show: false,
|
||||
|
|
|
|||
|
|
@ -31,8 +31,8 @@
|
|||
<ePie v-if="leftchoose.first == '1'"></ePie>
|
||||
<ePie2 v-else></ePie2>
|
||||
</div>
|
||||
<div class="flex1" style="margin-top:10px;">
|
||||
<div class="yd_title left_2" >
|
||||
<div class="flex1" style="margin-top: 10px">
|
||||
<div class="yd_title left_2">
|
||||
<span class="text">
|
||||
<img
|
||||
v-if="leftchoose.second == '1'"
|
||||
|
|
@ -61,7 +61,7 @@
|
|||
<eP2 v-if="leftchoose.second == '1'"></eP2>
|
||||
<eP2_2 v-else />
|
||||
</div>
|
||||
<div class="flex1" style="margin-top:10px;">
|
||||
<div class="flex1" style="margin-top: 10px">
|
||||
<div class="yd_title left_3">
|
||||
<span class="text">
|
||||
<img
|
||||
|
|
@ -106,10 +106,7 @@
|
|||
</div>
|
||||
<div class="flex1">
|
||||
<div class="yd_title familyPlanning"></div>
|
||||
<!-- 计划生育 -->
|
||||
<!-- <div style="width: 100%; "> -->
|
||||
<ylJHSY></ylJHSY>
|
||||
<!-- </div> -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="displayFlex right_bg">
|
||||
|
|
@ -474,9 +471,10 @@ const change = (name, index) => {
|
|||
}
|
||||
|
||||
.history {
|
||||
padding-top: 12px;
|
||||
height: calc(100% - 36px);
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
.history1 {
|
||||
font-size: 26px;
|
||||
color: #ffffff;
|
||||
|
|
|
|||
Loading…
Reference in New Issue