You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

material.md 15KB

材质 API 🌎

在真实世界里,每个物体会对光产生不同的反应。钢看起来比陶瓷花瓶更闪闪发光,一个木头箱子不会像钢箱子一样对光产生很强的反射。每个物体对镜面高光也有不同的反应。有些物体不会散射( Scatter)很多光却会反射(Reflect)很多光,结果看起来就有一个较小的高光点(Highlight),有些物体散射了很多,它们就会产生一个半径更大的高光。如果我们想要在 OpenGL 中模拟多种类型的物体,我们必须为每个物体分别定义材质(Material)属性。

DC.ColorMaterialProperty

颜色材质

example

let material = new DC.ColorMaterialProperty(DC.Color.RED)

creation

  • constructor(color)

构造函数

  • 参数
    • {DC.Color} color:颜色
  • 返回值 material

DC.ImageMaterialProperty

图片材质

example

let material = new DC.ImageMaterialProperty({
  image: '**/**.png',
  transparent: true,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 material
// options(属性可选)
const options = {
  "image": "", // 图片地址
  "repeat": { "x": 1, "y": 1 }, // 图片重复
  "color": DC.Color.WHITE, // 图片颜色
  "transparent": false // 材质是否透明
}

properties

  • {String} image:图片地址
  • {Object} repeat:图片重复
  • {DC.Color} color:图片颜色
  • {Boolean} transparent:材质是否透明

DC.CircleBlurMaterialProperty

模糊圆材质

example

let material = new DC.CircleBlurMaterialProperty({
  color: DC.Color.WHITE,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE, // 颜色
  "speed": 10 // 速度
}

properties

  • {DC.Color} color:颜色
  • {Number} speed:速度

DC.CircleDiffuseMaterialProperty

扩散圆材质

example

let material = new DC.CircleDiffuseMaterialProperty({
  color: DC.Color.WHITE,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE, // 颜色
  "speed": 10// 速度
}

properties

  • {DC.Color} color:颜色
  • {Number} speed:速度

DC.CircleFadeMaterialProperty

逐渐消逝圆材质

example

let material = new DC.CircleFadeMaterialProperty({
  color: DC.Color.WHITE,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE,// 颜色
  "speed": 10// 速度
}

properties

  • {DC.Color} color:颜色
  • {Number} speed:速度

DC.CirclePulseMaterialProperty

脉冲圆材质

example

let material = new DC.CirclePulseMaterialProperty({
  color: DC.Color.WHITE,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE, // 颜色
  "speed": 10// 速度
}

properties

  • {DC.Color} color:颜色
  • {Number} speed:速度

DC.CircleScanMaterialProperty

扫描圆材质

example

let material = new DC.CircleScanMaterialProperty({
  color: DC.Color.WHITE,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE,// 颜色
  "speed": 10// 速度
}

properties

  • {DC.Color} color:颜色
  • {Number} speed:速度

DC.CircleSpiralMaterialProperty

螺旋圆材质

example

let material = new DC.CircleSpiralMaterialProperty({
  color: DC.Color.WHITE,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE,// 颜色
  "speed": 10 // 速度
}

properties

  • {DC.Color} color:颜色
  • {Number} speed:速度

DC.CircleVaryMaterialProperty

多彩圆材质

example

let material = new DC.CircleVaryMaterialProperty({
  color: DC.Color.WHITE,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
      • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE,// 颜色
  "speed": 10// 速度
}

properties

  • {DC.Color} color:颜色
  • {Number} speed:速度

DC.CircleWaveMaterialProperty

波纹圆材质

example

let material = new DC.CircleWaveMaterialProperty({
  color: DC.Color.WHITE,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE,// 颜色
  "speed": 10, // 速度
  "count": 5, //数量
  "gradient": 0.1  //强度
}

properties

  • {Color} color:颜色
  • {Number} speed:速度
  • {Number} count:数量
  • {Number} gradient:强度

DC.EllipsoidElectricMaterialProperty

电弧球材质

example

let material = new DC.EllipsoidElectricMaterialProperty({
  color: DC.Color.WHITE,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE,// 颜色
  "speed": 10 // 速度
}

properties

  • {DC.Color} color:颜色
  • {Number} speed:速度

DC.EllipsoidTrailMaterialProperty

轨迹球材质

example

let material = new DC.EllipsoidTrailMaterialProperty({
  color: DC.Color.WHITE,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE, // 颜色
  "speed": 10  // 速度
}

properties

  • {DC.Color} color:颜色
  • {Number} speed:速度

DC.PolylineDashMaterialProperty

虚线材质

example

let material = new DC.PolylineDashMaterialProperty({
  color: DC.Color.WHITE,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE,// 虚线颜色
  "gapColor": DC.Color.TRANSPARENT,// 间隔颜色
  "dashLength": 16.0// 虚线片段长度
}

properties

  • {DC.Color} color:虚线颜色
  • {DC.Color} gapColor:间隔颜色
  • {Number} dashLength:虚线片段长度

DC.PolylineArrowMaterialProperty

箭头材质

example

let material = new DC.PolylineArrowMaterialProperty(DC.Color.WHITE)

creation

  • constructor(color)

构造函数

  • 参数
    • {DC.Color} color:箭头颜色
  • 返回值 materialProperty

properties

  • {DC.Color} color:箭头颜色

DC.PolylineOutlineMaterialProperty

边线材质

example

let material = new DC.PolylineOutlineMaterialProperty({
  color: DC.Color.WHITE,
  outlineColor: DC.Color.BLACK,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE,// 颜色
  "outlineColor": DC.Color.BLACK,// 边线颜色
  "outlineWidth": 1// 边线宽度
}

properties

  • {DC.Color} color:颜色
  • {DC.Color} outlineColor:边线颜色
  • {Number} outlineWidth:边线宽度

DC.PolylineGlowMaterialProperty

光晕材质

example

let material = new DC.PolylineGlowMaterialProperty({
  color: DC.Color.WHITE,
  glowPower: 0.25,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE,// 颜色
  "glowPower": 0.25,// 发光强度,以总线宽的百分比表示
  "taperPower": 1 // 渐缩效果的强度
}

properties

  • {DC.Color} color:颜色
  • {Number} glowPower:发光强度
  • {Number} taperPower:渐缩效果的强度

DC.PolylineFlickerMaterialProperty

闪烁线材质

example

let material = new DC.PolylineFlickerMaterialProperty({
  color: DC.Color.WHITE,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE,// 颜色
  "speed": 10 // 速度
}

properties

  • {DC.Color} color:颜色
  • {Number} speed:速度

DC.PolylineFlowMaterialProperty

流动线材质

example

let material = new DC.PolylineFlowMaterialProperty({
  color: DC.Color.WHITE,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE,// 颜色
  "speed": 10, // 速度,
  "percent": 0.3,// 比例
  "gradient": 0.1 // 透明程度
}

properties

  • {DC.Color} color:颜色
  • {Number} speed:速度
  • {Number} percent:比例,
  • {Number} gradient:透明程度,

DC.PolylineImageTrailMaterialProperty

图片轨迹线材质

example

let material = new DC.PolylineImageTrailMaterialProperty({
  color: DC.Color.WHITE,
  image: '**/*.png',
  repeat: { x: 10, y: 1 },
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE,// 颜色
  "speed": 10,// 速度
  "image": "**/*.png",// 图片地址
  "repeat": {
    "x": 10,
    "y": 1
  } //重复规则
}

properties

  • {DC.Color} color:颜色
  • {Number} speed:速度
  • {String} image:图片地址
  • {Object} repeat:重复规则

DC.PolylineLightingMaterialProperty

发光线材质

example

let material = new DC.PolylineLightingMaterialProperty({
  color: DC.Color.WHITE,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE // 颜色
}

properties

  • {DC.Color} color:颜色

DC.PolylineLightingTrailMaterialProperty

颜色轨迹线材质

example

let material = new DC.PolylineLightingTrailMaterialProperty({
  color: DC.Color.WHITE,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE,// 颜色
  "speed": 10// 速度
}

properties

  • {DC.Color} color:颜色
  • {Number} speed:速度

DC.PolylineTrailMaterialProperty

颜色轨迹线材质

example

let material = new DC.PolylineTrailMaterialProperty({
  color: DC.Color.WHITE,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE,// 颜色
  "speed": 10 // 速度
}

properties

  • {DC.Color} color:颜色
  • {Number} speed:速度

DC.RadarLineMaterialProperty

雷达线材质

example

let material = new DC.RadarLineMaterialProperty({
  color: DC.Color.WHITE,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE,// 颜色
  "speed": 10// 速度
}

properties

  • {DC.Color} color:颜色
  • {Number} speed:速度

DC.RadarWaveMaterialProperty

波纹雷达材质

example

let material = new DC.RadarWaveMaterialProperty({
  color: DC.Color.WHITE,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE,// 颜色
  "speed": 10// 速度
}

properties

  • {DC.Color} color:颜色
  • {Number} speed:速度

DC.WallImageTrailMaterialProperty

图片轨迹墙体材质

example

let material = new DC.WallImageTrailMaterialProperty({
  color: DC.Color.WHITE,
  image: '**/*.png',
  repeat: { x: 10, y: 1 },
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE,// 颜色
  "speed": 10,// 速度
  "image": "**/*.png",// 图片地址
  "repeat": {
    "x": 10,
    "y": 1
  } //重复规则
}

properties

  • {DC.Color} color:颜色
  • {Number} speed:速度
  • {String} image:图片地址
  • {Object} repeat:重复规则

DC.WallTrailMaterialProperty

流动墙材质

example

let material = new DC.WallTrailMaterialProperty({
  color: DC.Color.WHITE,
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "color": DC.Color.WHITE, // 颜色
  "speed": 10// 速度
}

properties

  • {DC.Color} color:颜色
  • {Number} speed:速度

DC.WaterMaterialProperty

流动水材质

example

let material = new DC.WaterMaterialProperty({
  baseWaterColor: DC.Color.WHITE,
  normalMap: '**/**.png',
})

creation

  • constructor([options])

构造函数

  • 参数
    • {Object} options:属性
  • 返回值 materialProperty
// options(属性可选)
const options = {
  "baseWaterColor": DC.Color.WHITE,// 水体颜色
  "blendColor": DC.Color.WHITE,// 混合颜色
  "specularMap": "",// 镜面图
  "normalMap": "", // 法线图
  "frequency": 1000, //波纹数量
  "animationSpeed": 0.03, // 动画速度
  "amplitude": 10, //水波振幅
  "specularIntensity": 10 //镜面反射强度
} 

properties

  • {DC.Color} baseWaterColor:颜色
  • {DC.Color} blendColor:混合颜色
  • {String} normalMap:法线图
  • {String} specularMap:镜面图