vue全局引入openlayers_vue+openlayers加载矢量切片显示不完整（图片支零破碎）

您需要贴一下下，您那边对接的代码的，我这边贴我的import Map from 'ol/Map';

import View from 'ol/View';

import proj4 from 'proj4';

import {get} from 'ol/proj';

import VectorTileLayer from 'ol/layer/VectorTile';

import { Logo, TileSuperMapRest } from '@supermap/iclient-ol';

import {VectorTileSuperMapRest} from '@supermap/iclient-ol/overlay/VectorTileSuperMapRest';

import TileGrid from 'ol/tilegrid/TileGrid';

import {MapboxStyles} from '@supermap/iclient-ol/overlay/vectortile/MapboxStyles';

import MVT from 'ol/format/MVT';

import Feature from 'ol/Feature';

import olms from 'ol-mapbox-style';

export default {

mounted(){

var url = (window.isLocal ? window.server : "https://iserver.supermap.io") +

"/iserver/services/map-mvt-California/rest/maps/California";

let  scaleToResolution = function (scale) {

var inchPerMeter = 1 / 0.0254;

var meterPerMapUnitValue = Math.PI * 2 * 6378137 / 360;

return 1 / (scale * 96 * inchPerMeter * meterPerMapUnitValue);

};

let  getResolutions = function (zoom, scale, targetMinZoom, targetMaxZoom) {

var res = scaleToResolution(scale);

var minRes = res * Math.pow(2, zoom - targetMinZoom);

var resolutions = [];

for (var index = 0; index < targetMaxZoom - targetMinZoom + 1; index++) {

resolutions.push(minRes / Math.pow(2, index));

}

return resolutions;

};

var vectorLayer;

//通过缓存sci文件已知第10级的比例尺是0.000003461454994642，计算0到16级的分辨率

var resolutions = getResolutions(10, 0.000003461454994642, 0, 16);

var map = new Map({

target: 'map',

view: new View({

center: [-122.228687503369, 38.1364932162598],

zoom: 10,

minZoom: 10,

maxZoom: 14,

projection: 'EPSG:4326',

resolutions: resolutions

})

});

// var key = 'pk.eyJ1IjoieWFuZ2p1bmxpbiIsImEiOiJjazhpazFsdjQwNnlvM2RwNjl1dngyYmdsIn0.kuycGa4pcXob5ja5aVtgfQ';

// olms('map', 'https://api.mapbox.com/styles/v1/mapbox/bright-v9?access_token=' + key);

var format = new MVT({

featureClass: Feature

});

// format.defaultDataProjection = new ol.proj.Projection({

//     code: 'EPSG:4326',

//     units: ol.proj.Units.TILE_PIXELS

// });

var style = new MapboxStyles({

url: url,

source: 'California',

resolutions: resolutions

});

// console.log(style,'style')

style.on('styleloaded', function () {

vectorLayer = new VectorTileLayer({

//设置避让参数

declutter: true,

source: new VectorTileSuperMapRest({

url: url,

projection: 'EPSG:4326',

tileGrid: new TileGrid({

resolutions: resolutions,

origin: [-180, 90],

tileSize: 512

}),

tileType: 'ScaleXY',

format: format

}),

style: style.getStyleFunction()

});

map.addLayer(vectorLayer);

})

}