Browse Source

fix: 修复折线图层级问题

leap 3 years ago
parent
commit
0c291b0f45
3 changed files with 13 additions and 14 deletions
  1. 5 5
      pages/chart/index.vue
  2. 3 2
      pages/chart/methods.js
  3. 5 7
      pages/chart/style.scss

+ 5 - 5
pages/chart/index.vue

@@ -1,26 +1,26 @@
 <template>
 	<div class="container">
-		<div class="chart-1">
+		<div class="chart-box">
 			<div class="chart-title"><span>裸眼数据</span></div>
 			<qiun-data-charts type="line" :chartData="chartsDataA" :opts="chartsOpts" :inScrollView="true" />
 		</div>
 		<div class="line"></div>
-		<div class="chart-1">
+		<div class="chart-box">
 			<div class="chart-title"><span>戴镜数据</span></div>
 			<qiun-data-charts type="line" :chartData="chartsDataB" :opts="chartsOpts" :inScrollView="true" />
 		</div>
 		<div class="line"></div>
-		<div class="chart-1">
+		<div class="chart-box">
 			<div class="chart-title"><span>屈光数据-球镜</span></div>
 			<qiun-data-charts type="line" :chartData="chartsDataC" :opts="chartsOpts1" :inScrollView="true" />
 		</div>
 		<div class="line"></div>
-		<div class="chart-1">
+		<div class="chart-box">
 			<div class="chart-title"><span>屈光数据-柱镜</span></div>
 			<qiun-data-charts type="line" :chartData="chartsDataD" :opts="chartsOpts2" :inScrollView="true" />
 		</div>
 		<div class="line"></div>
-		<div class="chart-1">
+		<div class="chart-box">
 			<div class="chart-title"><span>屈光数据-轴位</span></div>
 			<qiun-data-charts type="line" :chartData="chartsDataE" :opts="chartsOpts3" :inScrollView="true" />
 		</div>

+ 3 - 2
pages/chart/methods.js

@@ -19,7 +19,7 @@ let chartsLine = {
 	"errorReload": true,
 	"fontSize": 12,
 	"fontColor": "#666666",
-	"enableScroll": false,
+	"enableScroll": true,
 	"touchMoveLimit": 60,
 	"enableMarkLine": false,
 	"dataLabel": false,
@@ -34,7 +34,8 @@ let chartsLine = {
 		"fontColor": "#666666",
 		"fontSize": 13,
 		"rotateLabel": false,
-		"itemCount": 5,
+        "labelCount": 5,
+        "itemCount": 5,
 		"boundaryGap": "center",
 		"disableGrid": true,
 		"gridColor": "#CCCCCC",

+ 5 - 7
pages/chart/style.scss

@@ -1,26 +1,24 @@
 .container {
-	width: 100%;
 	position: fixed;
+	right: 0;
+	left: 0;
 	top: 0;
 	bottom: 0;
 	overflow-y: scroll;
 }
-.charts {
-	width: 750upx;
-	height: 500upx;
-	background-color: #ffffff;
-}
+
 .line {
 	width: 100%;
 	height: 10px;
 	background: #f5f5f5;
 }
 
-.chart-1 {
+.chart-box {
 	position: relative;
 	padding: 10px 0;
 	.chart-title {
 		position: absolute;
+		top: 10px;
 		left: 10px;
 		z-index: 1;
 		span {