Vue+@supermap/iclient-ol加载矢量瓦片报错
hongwei985 opened this issue · 1 comments
One-line summary [问题简述]
工程为新建的vue3.0(脚手架create),只加了3个依赖包("@supermap/iclient-ol": "^11.0.0", "@supermap/babel-plugin-import": "^0.0.1", "node-polyfill-webpack-plugin": "^2.0.1"),加载TileLayer,可以正常显示,加载矢量切片报错,报错如下:(Cannot read properties of undefined (reading 'stylefunction'))。
后来vue2也测试过,报错类似Cannot read property 'applyBackground' of undefined
感觉都是跟mapbox样式有关系(olms),但现在不知道如何解决。
Version [产品及版本]
- Vue+@supermap/iclient-ol [iClient 产品]:^11.0.0
- chrome最新版本 [浏览器类型和版本]:
- windows 10 [操作系统类型和版本]:
Actual Behavior [当前现象]
Expected Behavior [期望现象]
能正常加载矢量切片(如果需要工程文件,可以发给您,vue2和3都有)
Example of reproducing the issue [重现现象的例子]
index.html中加入2条link,
<link href='https://iclient.supermap.io/web/libs/openlayers/6.1.1/ol.css' rel='stylesheet' />
<link href='https://iclient.supermap.io/dist/ol/iclient-ol.min.css' rel='stylesheet' />
主体代码片段如下:
import Map from 'ol/Map';
import View from 'ol/View';
import { MVT } from 'ol/format';
import Feature from 'ol/Feature';
import VectorTileLayer from 'ol/layer/VectorTile';
import TileGrid from 'ol/tilegrid/TileGrid';
import { VectorTileSuperMapRest } from '@supermap/iclient-ol/overlay/VectorTileSuperMapRest';
import { MapboxStyles } from '@supermap/iclient-ol/overlay/vectortile/MapboxStyles';
const initMap = () => {
const url1 = 'https://iserver.supermap.io/iserver/services/map-mvt-California/rest/maps/California';
const format = new MVT({
featureClass: Feature
});
const resolutions = getResolutions(10, 0.000003461454994642, 0, 16);
const map = new Map({
target: mapRef.value || 'map',
view: new View({
center: [116, 39],
zoom: 6,
projection: 'EPSG:4326',
multiWorld: true,
resolutions
})
});
const style = new MapboxStyles({
/* map: map, */
url: url1,
source: 'California',
resolutions: resolutions
});
style.on('styleloaded', function () {
const vectorLayer = new VectorTileLayer({
//设置避让参数
declutter: true,
source: new VectorTileSuperMapRest({
url: url1,
projection: 'EPSG:4326',
tileGrid: new TileGrid({
resolutions: resolutions,
origin: [-180, 90],
tileSize: 512
}),
tileType: 'ScaleXY',
format: format
}),
style: style.getStyleFunction()
});
map.addLayer(vectorLayer);
});
};
What is motivation or use case for changing the behavior? [需求的场景和目的是什么?]
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.