Browse Source

季节图 周度指标的图表坐标轴调整

Karsa 3 years ago
parent
commit
607c9931c0
3 changed files with 17 additions and 4 deletions
  1. 1 0
      src/utils/chartOptions.ts
  2. 12 2
      src/views/chartShow/index.less
  3. 4 2
      src/views/chartShow/index.vue

+ 1 - 0
src/utils/chartOptions.ts

@@ -103,6 +103,7 @@ export const defaultOpts = {
     tickPosition: 'inside',
     endOnTick: false,
     startOnTick: false,
+    showLastLabel: true,
   },
   // responsive: {
   //   rules: [

+ 12 - 2
src/views/chartShow/index.less

@@ -32,8 +32,6 @@
 			flex: 1;
 			position: relative;
 			.mark {
-				width: 242px;
-				height: 25px;
 				position:absolute;
 				left: 50%;
 				top: 50%;
@@ -87,4 +85,16 @@
 			max-height: calc(100vw - 60px);
 			padding: 0 0 5px;
 		}
+	}
+	@media (min-width: 980px) {
+		.mark {
+			width: 580px;
+			height: 60px;
+		}
+	}
+	@media (max-width: 979px) {
+		.mark {
+			width: 242px;
+			height: 25px;
+		}
 	}

+ 4 - 2
src/views/chartShow/index.vue

@@ -153,6 +153,7 @@ export default defineComponent({
             tickPosition: 'inside',
 						endOnTick: false,
 						startOnTick: false,
+            showLastLabel: true
           }
 
           // //拼接标题 判断相同指标名称拼接来源
@@ -317,10 +318,11 @@ export default defineComponent({
             seasonYdata.push(s_yItem);
           }
 
-        // 季节图x轴显示月/日
+
+        // 季节图x轴显示月/日 周度指标额外处理时间轴显示
         const xAxis = {
           ...defaultOpts.xAxis,
-          // tickInterval: 24 * 3600 * 1000 * 30,
+          tickInterval: chartData.Frequency === '周度' ? 24 * 3600 * 1000 : null,
           labels: {
             formatter: function (ctx: any) {
               return Highcharts.dateFormat('%m/%d', ctx.value);