MCHMAP 丨 地图引擎
MCHMAP 丨 地图引擎 > 快速开始 > MchCesium > 编织条纹材质

编织条纹材质

构造函数：

const weaveMaterial = new MchCesium.WeaveMaterial(defaultOptions);

参数说明：defaultOptions: 编织条纹材质配置

defaultOptions配置属性说明：

属性数据类型说明
bgColorString设置背景色
stripeColorString设置线条颜色
stripeWidthNumber设置线条宽度
stripeGapNumber设置间隔大小
angleNumber设置倾斜角度

使用方法：

先创建编织条纹材质：const weaveMaterial = new MchCesium.WeaveMaterial(defaultOptions)

然后设置应用实体的material: weaveMaterial请参考如下实例：

实例：

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src="https://mhc.ixiera.com/mhc/main.js"></script> <script src="https://mhc.ixiera.com/mhc/Cesium-1.120/Build/Cesium/Cesium.js"></script> <script src="https://mhc.ixiera.com/mhc/Cesium3DTile.js"></script> <title>编织条纹材质</title> </head> <body> <div id="cesiumContainer"></div> <script> // 初始化 MchCesium.init('cesiumContainer'); MchCesium.contextOptions = { webgl: { failIfMajorPerformanceCaveat: false } } // 编织条纹 const defaultOptions = { bgColor: '#FFFFFF', // 背景色 stripeColor: '#03a9f4', // 线条颜色 stripeWidth: 4, // 线条宽度 stripeGap: 30, // 间隔大小 }; const weaveMaterial = new MchCesium.WeaveMaterial(defaultOptions); // 多边形配置 let polygonGraphics = { material: weaveMaterial, outlineColor: Cesium.Color.WHITE, } // 多边形顶点坐标（按照顺序） let positions = [[104.460887, 31.8291385], [104.462587, 31.8291385], [104.46302587, 31.8311385], [104.4609587, 31.8308385]] // 多边形其他配置 let option = { needTrans: true, editable: true, outline: { color: '#fff', width: 2.0, style: 'dashed' } } // 多边形实例化对象 let polygon = new MchCesium.Polygon('testPolygon', polygonGraphics, positions, option); // 加载多边形 polygon.createPolygonEntity(); // console.log(polygon) // 聚焦 MchCesium.viewer.zoomTo(MchCesium.viewer.entities) </script> </body> </html>

Demo地址：

https://mhc.ixiera.com/html/cesiumDemo/demo_weave.html

本文档来自—MCHMAP 丨 地图引擎平台