Question

App.vue代码如下，浏览器页面无报错但地图无法显示，请问是什么问题

<template>
  <div>
    <h1>测试标题</h1>
    <router-view />
  </div>
    <div id="map" class="map" ></div>
    <Showmap />
</template>
  
<script setup>
  import Showmap from './function/showmap.vue';

  import { ref } from 'vue'
  import Map from '../node_modules/ol/Map';
  import View from '../node_modules/ol/View.js';
  import TileLayer from '../node_modules/ol/layer/Tile.js';
  import { LayerInfoService } from '../node_modules/@supermapgis/iclient-ol';
  import { TileSuperMapRest } from '../node_modules/@supermapgis/iclient-ol'


  
  const url ="http://localhost:8090/iserver/services/map-chengdu/rest/maps/chengdu_sheng%40chengdu";
  const createMap = () => {
          const map = new Map({
          target: "map",
          view: new View ({
          center: [102.95 , 30.18],
          zoom: 2,
          projection: "EPSG:4326",
        }),
          layers:[
          new TileLayer({
          source: new TileSuperMapRest({
          url: url,
          wrapX: true,
          }),
          projection: "EPSG:4326",
          }),
          ],
          target:'map'
      });

        map.addLayer(layers);
  }

  
</script>

<style>
 #map {
    width: 100vm;
    height: 100vh;
}
</style>

Answer 1

您这边没有报错，不确定什么位置有问题

1、检查“http://localhost:8090/iserver/services/map-chengdu/rest/maps/chengdu_sheng%40chengdu”服务在iServer上预览是否有图——服务本身问题

2、您的项目是否联网，更换服务为在线示例服务“https://iserver.supermap.io/iserver/services/map-world/rest/maps/World”是否能正常出图——OpenLayers项目的问题