增加运行图客流量配置

src/jmapNew/theme/race_01/planConvert.js

@@ -2,10 +2,10 @@ import { createMartPoint, createSeriesModel, createMarkLineModels, hexColor, con
 import store from '@/store/index_APP_TARGET';
 export default {
     /** 边缘高度*/
-    EdgeHeight: 600,
+    EdgeHeight: 600 / 3,
 
     /** 间隔高度*/
-    CoordMultiple: 1,
+    CoordMultiple: 1 / 3,
 
     /** 偏移时间*/
     TranslationTime: 60 * 60 * 2,
@@ -131,7 +131,6 @@ export default {
                             if (index == 0 && train.stationTimeList[index].stationCode != train.stationTimeList[index + 1].stationCode ||
 								index == train.stationTimeList.length - 2 && train.stationTimeList[index].secondTime != train.stationTimeList[index + 1].secondTime ||
 								index > 0 && index < train.stationTimeList.length - 1) {
-                                // ${train.directionCode}
                                 const aa = `${train.tripNumber}`;
                                 opt.data.push([elem.secondTime, this.getCoordYByElem(stations, kmRangeCoordMap, elem, elem.right, false), elem.stationCode, aa]);
                             }
@@ -142,7 +141,6 @@ export default {
                             lastPoint = train.stationTimeList[idx - 1];
                             nextPoint = service.tripNumberDataList[j + 1].stationTimeList[1];
                             num = this.computedReentryNumber(train.tripNumber);
-                            // ${train.directionCode}
                             const aa = `${train.tripNumber}`;
                             opt.data.push([lastPoint.secondTime, this.getCoordYByElem(stations, kmRangeCoordMap, lastPoint, train.right, true, num), lastPoint.stationCode, aa]);
                             opt.data.push([nextPoint.secondTime, this.getCoordYByElem(stations, kmRangeCoordMap, nextPoint, train.right, true, num), nextPoint.stationCode, aa]);
@@ -259,7 +257,7 @@ export default {
     initializeYaxis(stations) {
         return createMarkLineModels(stations, (elem) => {
             return this.EdgeHeight + elem.kmRange * this.CoordMultiple;
-        });
+        }, {yAxisIndex:0});
     },
 
     /** 将后台数据转换为试图序列模型*/

src/utils/runPlan.js

@@ -60,7 +60,7 @@ export function createSeriesModel(opt, lineStyle) {
 }
 
 /** 创建标记横线*/
-export function createMarkLineModels(stations, computedYaxis) {
+export function createMarkLineModels(stations, computedYaxis, opt = {}) {
     const markLineModel = {};
     if (stations && stations.length) {
         markLineModel.type = 'line';
@@ -71,6 +71,7 @@ export function createMarkLineModels(stations, computedYaxis) {
         markLineModel.markLine.lineStyle = { color: '#B0C4DE', width: 0.5 };
         markLineModel.markLine.symbol = 'none';
         markLineModel.elements = [];
+        Object.assign(markLineModel, opt);
         stations.forEach((elem, index) => {
             markLineModel.markLine.data.push(
                 {

src/views/newMap/displayNew/demon/runPlanView.vue

@@ -245,6 +245,22 @@ export default {
                 this.runPlanData, this.runSeries, { color: '#FF00DE', width: 2 }
             );
             const series = [...this.staticSeries, ...this.runSeries, ... this.selectSeries];
+            // let index = 0;
+            // this.stations.forEach((station, ii) => {
+            //     if (station.visible) {
+            //         index++;
+            //         series.push({
+            //             type: 'bar',
+            //             barGap: '-100%',
+            //             yAxisIndex: index,
+            //             barWidth: '3000%',
+            //             itemStyle: {
+            //                 color: 'red'
+            //             },
+            //             data: [[29030, 50], [29060, 60], [29090, 20], [29120, 60], [29150, 80], [29180, 160], [29210, 50], [29240, 80], [29270, 30]]
+            //         });
+            //     }
+            // });
             this.myChart && this.myChart.setOption({series: series});
         },
         async loadChartPage() {
@@ -268,20 +284,6 @@ export default {
         async loadInitData() {
             this.myChart && this.myChart.showLoading();
             const option = {
-                title: {
-                    text: '',
-                    left: 'center'
-                },
-                grid: {
-                    top: '30px',
-                    left: '120px',
-                    right: '40px',
-                    bottom: '65px',
-                    containLabel: true,
-                    backgroundColor: 'floralwhite'
-                },
-                toolbox: {
-                },
                 tooltip: {
                     axisPointer: {
                         trigger: 'item',
@@ -290,10 +292,14 @@ export default {
                     formatter: this.axisTooltip,
                     borderWidth: 1
                 },
+                grid: {
+                    right: '40px',
+                    left: '120px',
+                    height: '85%'
+                },
                 xAxis: [
                     {
                         type: 'category',
-                        boundaryGap: false,
                         data: [],
                         axisLine: {
                             onZero: false,
@@ -318,54 +324,55 @@ export default {
                         }
                     }
                 ],
-                yAxis: {
+                yAxis: [
-                    type: 'value',
-                    splitLine: {
-                        show: false
-                    },
-                    axisTick: {
-                        show: false
-                    },
-                    axisLine: {
-                        onZero: false,
-                        lineStyle: {
-                            width: 2,
-                            color: '#d14a61'
-                        }
-                    },
-                    axisLabel: {
-                        interval: 'auto',
-                        formatter: this.yAxisLableFormat
-                    },
-                    axisPointer: {
-                        xAxisIndex: 'all',
-                        label: {
-                            formatter: this.yAxisPointFormat,
-                            backgroundColor: 'rgb(0,100,0,0.5)',
-                            color: 'white'
-                        }
-                    },
-                    min: 0,
-                    max: 0
-                },
-                series: [],
-                dataZoom: [
                     {
-                        type: 'inside'
+                        type: 'value',
-                    },
+                        yAxisIndex: 0,
-                    {
+                        splitLine: {
-                        fiterMode: 'filter',
+                            show: false
-                        handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
-                        handleSize: '80%',
-                        handleStyle: {
-                            color: '#fff',
-                            shadowBlur: 3,
-                            shadowColor: 'rgba(0, 0, 0, 0.6)',
-                            shadowOffsetX: 2,
-                            shadowOffsetY: 2
                         },
-                        bottom: '20px'
+                        axisTick: {
+                            show: false
+                        },
+                        axisLine: {
+                            onZero: false,
+                            lineStyle: {
+                                width: 2,
+                                color: '#d14a61'
+                            }
+                        },
+                        axisLabel: {
+                            interval: 'auto',
+                            formatter: this.yAxisLableFormat
+                        },
+                        axisPointer: {
+                            xAxisIndex: 'all',
+                            label: {
+                                formatter: this.yAxisPointFormat,
+                                backgroundColor: 'rgb(0,100,0,0.5)',
+                                color: 'white'
+                            }
+                        }
                     }
+                ],
+                dataZoom: [{
+                    type: 'inside'
+                },
+                {
+                    fiterMode: 'filter',
+                    handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
+                    handleSize: '80%',
+                    handleStyle: {
+                        color: '#fff',
+                        shadowBlur: 3,
+                        shadowColor: 'rgba(0, 0, 0, 0.6)',
+                        shadowOffsetX: 2,
+                        shadowOffsetY: 2
+                    },
+                    bottom: '20px'
+                }],
+                series: [
+
                 ]
             };
             await this.xAxisInit(option);
@@ -394,6 +401,23 @@ export default {
                     option.dataZoom[0].startValue = option.dataZoom[1].startValue = startValue - offsetTime;
                     option.dataZoom[0].endValue = option.dataZoom[1].endValue = startValue + offsetTime;
                     option.series = [...this.staticSeries, ...this.runSeries, ...this.selectSeries];
+                    // let index = 0;
+                    // this.stations.forEach((station, ii) => {
+                    //     if (station.visible) {
+                    //         index++;
+                    //         option.series.push({
+                    //             type: 'bar',
+                    //             barGap: '-100%',
+                    //             yAxisIndex: index,
+                    //             barWidth: '3000%',
+                    //             itemStyle: {
+                    //                 color: 'red'
+                    //             },
+                    //             data: [[29030, 50], [29060, 60], [29090, 20], [29120, 60], [29150, 80], [29180, 160], [29210, 50], [29240, 80], [29270, 30]]
+                    //         });
+                    //     }
+                    // });
+
                     this.myChart = echarts.init(document.getElementById(this.runPlanId));
                     if (this.myChart) {
                         this.myChart.setOption(option);
@@ -440,8 +464,20 @@ export default {
         },
         yAxisInit(option) {
             if (Object.keys(this.PlanConvert).length) {
-                option.yAxis.min = this.PlanConvert.computedYaxisMinValue(this.stations);
+                option.yAxis[0].min = this.PlanConvert.computedYaxisMinValue(this.stations);
-                option.yAxis.max = this.PlanConvert.computedYaxisMaxValue(this.stations);
+                option.yAxis[0].max = this.PlanConvert.computedYaxisMaxValue(this.stations);
+                let index = 1;
+                this.stations.forEach((station, ii) => {
+                    if (station.visible) {
+                        option.yAxis.push({
+                            type: 'value',
+                            min: option.yAxis[0].min - Math.floor(station.kmRange * this.PlanConvert.CoordMultiple + this.PlanConvert.EdgeHeight),
+                            max: Math.floor(option.yAxis[0].max - station.kmRange * this.PlanConvert.CoordMultiple) - this.PlanConvert.EdgeHeight,
+                            show: false,
+                            yAxisIndex : index++
+                        });
+                    }
+                });
             }
         },
         axisTooltip(param) {

src/views/newMap/newMapdraft/mapoperate/section/index.vue

@@ -507,8 +507,8 @@ export default {
                     this.$emit('updateMapModel', models);
                     this.oldPoint = JSON.parse(JSON.stringify(model.points));
                     this.oldLeftSectionCode = model.leftSectionCode;
-					this.oldRightSectionCode = model.rightSectionCode;
+                    this.oldRightSectionCode = model.rightSectionCode;
-					this.field = '';
+                    this.field = '';
                 } else {
                     this.$message('还有属性未填写，修改未生效！');
                 }