geojson文件默认已有的style会导致webGL渲染错误处理办法

geojson文件默认已有的style会导致webGL渲染错误处理办法

相关链接:

功能示例(Vue版) | Mars3D三维可视化平台 | 火星科技

代码:

复制代码
export function showDraw(isFlyTo) {
  removeLayer()

  graphicLayer = new mars3d.layer.GeoJsonLayer({
    data: {
      type: "FeatureCollection",
      features: [
        {
          type: "Feature",
          geometry: {
            type: "Point",
            coordinates: [121.453893, 29.888391],
          },
          properties: {
            gid: "1",
            code: "1718850737365",
            type: 'circleP',
            style: {
              radius: 1693.63
            }
          },
          id: "fid--45368680_1902ac1ce0f_-7fde",
        },
      ],
    },
    symbol: {
      styleOptions: {
        color: "#FF0000",
      },
    },
    flyTo: true
  });
  map.addLayer(graphicLayer);
}

效果:

报错:

Cesium.js:15236 An error occurred while rendering. Rendering has stopped.

DeveloperError: normalized result is not a number

Error

处理办法:

设置下 merge为true即可,

正确代码:

复制代码
export function showDraw(isFlyTo) {
  removeLayer()

  graphicLayer = new mars3d.layer.GeoJsonLayer({
    data: {
      type: "FeatureCollection",
      features: [
        {
          type: "Feature",
          geometry: {
            type: "Point",
            coordinates: [121.453893, 29.888391],
          },
          properties: {
            gid: "1",
            code: "1718850737365",
            type: 'circleP',
            style: {
              radius: 1693.63
            }
          },
          id: "fid--45368680_1902ac1ce0f_-7fde",
        },
      ],
    },
    symbol: {
      merge: true,
      styleOptions: {
        color: "#FF0000",
      },
    },
    flyTo: true
  });
  map.addLayer(graphicLayer);
}

正常效果:

原因:

1.内置的style与symbol配置冲突,需要合并并覆盖json中已有的style

相关api:

Mars3D三维可视化平台 | 火星科技

相关推荐
小桥风满袖2 分钟前
Three.js-硬要自学系列38之专项学习缓冲几何体
前端·css·three.js
Rubin933 分钟前
埋点方案实现
前端
斯~内克7 分钟前
Centrifugo 深度解析:构建高性能实时应用的开源引擎
前端·开源
tianchang18 分钟前
策略模式(Strategy Pattern)深入解析与实战应用
前端·javascript·代码规范
best66621 分钟前
JavaScript的Math内置对象,到底是何方神圣?
javascript
掘金安东尼27 分钟前
技术解析:高级 Excel 财务报表解析器的架构与实现
前端·javascript·面试
Hilaku28 分钟前
深入CSS层叠的本质:@layer如何优雅地解决样式覆盖与!important滥用问题
前端·css·html
天天扭码31 分钟前
AI时代,前端如何处理大模型返回的多模态数据?
前端·人工智能·面试
每天开心33 分钟前
一文教你掌握事件机制
前端·javascript·ai编程
LeeAt40 分钟前
真的!真的就一句话就能明白this指向问题
前端·javascript