修复FlatGeobuf example/config 大小写, 修复 ol webmap 拼接.json错误 review by luox

Author: xilanhuaweidapao

CHANGELOG.md

@@ -2,7 +2,7 @@
 
 ## 新特性
 
-### 新增支持云原生矢量交换格式（FlatGeoBuf），支持直接访问云存储和SuperMap iServer服务返回的FlatGeoBuf格式文件，并支持流式传输和渲染
+### 新增支持云原生矢量交换格式（FlatGeobuf），支持直接访问云存储和SuperMap iServer服务返回的FlatGeobuf格式文件，并支持流式传输和渲染
 
  - 新增 L.supermap.FGBLayer、mapboxgl.supermap.FGBLayer 、ol.source.FGB，支持全量或按需渲染FlatGeobuf格式数据
 

examples/leaflet/config.js

@@ -1106,9 +1106,9 @@ var exampleConfig = {
  }
  ]
  },
- "FlatGeoBuf": {
- name: 'FlatGeoBuf',
- name_en: 'FlatGeoBuf',
+ "FlatGeobuf": {
+ name: 'FlatGeobuf',
+ name_en: 'FlatGeobuf',
  version: '11.1.0',
  content: [
  {

examples/mapboxgl/config.js

@@ -1118,9 +1118,9 @@ var exampleConfig = {
  }
  ]
  },
- FlatGeoBuf: {
- name: 'FlatGeoBuf',
- name_en: 'FlatGeoBuf',
+ FlatGeobuf: {
+ name: 'FlatGeobuf',
+ name_en: 'FlatGeobuf',
  version: '11.0.1',
  content: [
  {

examples/maplibregl/config.js

@@ -876,9 +876,9 @@ var exampleConfig = {
  }
  ]
  },
- FlatGeoBuf: {
- name: 'FlatGeoBuf',
- name_en: 'FlatGeoBuf',
+ FlatGeobuf: {
+ name: 'FlatGeobuf',
+ name_en: 'FlatGeobuf',
  content: [
  {
  name: 'FGB 全量加载（2500万点数据量）',

examples/maplibregl/examples.html

@@ -37,7 +37,7 @@
  $body.append("<script type='text/javascript' src='../openlayers/config.js'><\/script>");
  $body.append("<script type='text/javascript' src='../leaflet/config.js'><\/script>");
  $body.append("<script type='text/javascript' src='../classic/config.js'><\/script>");
- $body.append("<script type='text/javascript' src='../maplibregl/config.js'><\/script>");
+ $body.append("<script type='text/javascript' src='../mpaboxgl/config.js'><\/script>");
  $body.append("<script type='text/javascript' src='../component/config.js'><\/script>");
  $body.append("<script type='text/javascript' src='./config.js'><\/script>");
  $body.append("<script type='text/javascript' src='../js/localization.js'><\/script>");

examples/openlayers/config.js

@@ -1075,9 +1075,9 @@ var exampleConfig = {
  fileName: "mask"
  }]
  },
- FlatGeoBuf: {
- name: 'FlatGeoBuf',
- name_en: 'FlatGeoBuf',
+ FlatGeobuf: {
+ name: 'FlatGeobuf',
+ name_en: 'FlatGeobuf',
  version: '11.1.0',
  content: [
  {

src/openlayers/core/StyleUtils.js

@@ -1205,7 +1205,7 @@ export class StyleUtils {
  let outlineColorArray = this.hexToRgb(outlineColor);
  // opacity使用style的透明度。保持两根线透明度一致
  outlineColorArray && outlineColorArray.push(strokeOpacity);
- let outlineWidth = strokeWidth === 0 ? ZERO : strokeWidth + 2; //外部宽度=内部样式宽度 + 2
+ let outlineWidth = outlineStyle.strokeWidth || (strokeWidth === 0 ? ZERO : strokeWidth + 2); //外部宽度=内部样式宽度 + 2
  var outlineStroke = new Style({
  stroke: new StrokeStyle({
  width: outlineWidth, //外部宽度=内部样式宽度 + 2

src/openlayers/mapping/WebMap.js

@@ -287,8 +287,9 @@ export class WebMap extends Observable {
  let that = this,
  mapUrl = url;
  if (url.indexOf('.json') === -1) {
+ url = this.handleJSONSuffix(url);
  //传递过来的url,没有包括.json,在这里加上。
- mapUrl = `${url}.json`
+ mapUrl = url;
  }
  FetchRequest.get(that.getRequestUrl(mapUrl), null, {
  withCredentials: this.withCredentials
@@ -543,7 +544,8 @@ export class WebMap extends Observable {
 
  let source;
  if (baseLayerType === "TILE") {
- FetchRequest.get(me.getRequestUrl(`${url}.json`), null, {
+ url = this.handleJSONSuffix(url);
+ FetchRequest.get(me.getRequestUrl(url), null, {
  withCredentials: this.withCredentials
  }).then(function (response) {
  return response.json();
@@ -1354,7 +1356,8 @@ export class WebMap extends Observable {
  url = `${url}&token=${encodeURI(credential.token)}`;
  token = credential.token;
  }
- return FetchRequest.get(that.getRequestUrl(`${url}.json`), null, options).then(function (response) {
+ url = this.handleJSONSuffix(url);
+ return FetchRequest.get(that.getRequestUrl(url), null, options).then(function (response) {
  return response.json();
  }).then(async (result) => {
  if (result.succeed === false) {
@@ -1399,7 +1402,8 @@ export class WebMap extends Observable {
  that.credentialValue = layerInfo.credential = layerInfo.url.split("?token=")[1];
  layerInfo.url = layerInfo.url.split("?token=")[0];
  }
- return FetchRequest.get(that.getRequestUrl(`${layerInfo.url}.json`), null, options).then(function (response) {
+ let url = this.handleJSONSuffix(layerInfo.url);
+ return FetchRequest.get(that.getRequestUrl(url), null, options).then(function (response) {
  return response.json();
  }).then(async function (result) {
  // layerInfo.projection = mapInfo.projection;
@@ -2104,7 +2108,8 @@ export class WebMap extends Observable {
  getDataflowInfo(layerInfo, success, faild) {
  let that = this;
  let url = layerInfo.url, token;
- let requestUrl = that.getRequestUrl(`${url}.json`, false);
+ url = this.handleJSONSuffix(url);
+ let requestUrl = that.getRequestUrl(url, false);
  if (layerInfo.credential && layerInfo.credential.token) {
  token = layerInfo.credential.token;
  requestUrl += `?token=${token}`;
@@ -2984,11 +2989,14 @@ export class WebMap extends Observable {
  async createVectorLayer(layerInfo, features) {
  const {featureType, style} = layerInfo;
  let newStyle;
- if (featureType === 'LINE' && Util.isArray(style)) {
+ if (featureType === 'LINE' && Util.isArray(style) && style.length === 2) {
  const [outlineStyle, strokeStyle] = style;
- newStyle = strokeStyle.lineDash === 'solid' ? StyleUtils.getRoadPath(strokeStyle, outlineStyle)
+ newStyle = (!strokeStyle.lineDash || strokeStyle.lineDash === 'solid') ? StyleUtils.getRoadPath(strokeStyle, outlineStyle)
  : StyleUtils.getPathway(strokeStyle, outlineStyle);
  } else {
+ if (Util.isArray(style)) {
+ layerInfo.style = style[0];
+ }
  newStyle = await StyleUtils.toOpenLayersStyle(layerInfo.style, layerInfo.featureType);
  }
  return new olLayer.Vector({
@@ -5147,4 +5155,15 @@ export class WebMap extends Observable {
  }
  return ['EPSG:-1000','EPSG:-1'].includes(projection);
  }
+
+ handleJSONSuffix(url) {
+ if (url.includes('?')) {
+ let urlArr = url.split('?');
+ urlArr[0] = urlArr[0] + ".json";
+ url = urlArr.join('?');
+ } else {
+ url = url + ".json"
+ }
+ return url;
+ }
 }