| | |
| | | }) |
| | | }, |
| | | methods: { |
| | | setFontSize(res){ |
| | | const clientWidth = window.innerWidth||document.documentElement.clientWidth||document.body.clientWidth; |
| | | if (!clientWidth) return; |
| | | let fontSize = clientWidth / 1920; |
| | | return res*fontSize; |
| | | }, |
| | | initializeMap() { |
| | | this.updateMapData() |
| | | this.getChinData('自贡市', chinaJson) |
| | |
| | | left: '-5%', |
| | | top: '20%', |
| | | width: '100%', // 明确指定宽度 |
| | | height: '720px', // 明确指定高度 |
| | | height: '100%', // 明确指定高度 |
| | | // boxWidth: 100, |
| | | regionHeight: 0.8, |
| | | zlevel: 10, |
| | |
| | | left: '-5%', |
| | | top: '20%', |
| | | width: '100%', // 明确指定宽度 |
| | | height: '720px', // 明确指定高度 |
| | | height: '100%', // 明确指定高度 |
| | | zlevel: 5, |
| | | |
| | | // tooltip: { |
| | |
| | | position: 'top', |
| | | textStyle: { |
| | | color: '#c6f4ff', |
| | | fontSize: '16px', |
| | | fontSize: this.setFontSize(16), |
| | | backgroundColor: 'rgba(25,56,97,1)', |
| | | borderColor: '#a4ddee', |
| | | borderWidth: 0.5, |
| | |
| | | }, |
| | | rich: { |
| | | style: { |
| | | fontSize: 16, |
| | | lineHeight: 22 |
| | | fontSize: this.setFontSize(14), |
| | | lineHeight: this.setFontSize(20), |
| | | // 其他需要的样式 |
| | | } |
| | | }, |
| | |
| | | |
| | | .map-main-container { |
| | | width: 100%; |
| | | height: 100%; |
| | | height: 37vw; // 固定高度 |
| | | } |
| | | </style> |