概述

Fill 类是 Openlayers 中的一个用于处理图形填充样式的类，通常用于矢量图形样式设置。该类允许你设置、获取填充颜色或图案，管理颜色的加载状态，并且支持克隆功能。

源码分析

Fill类的源码实现

Fill类的源码实现如下：

class Fill {
  constructor(options) {
    options = options || {};
    this.patternImage_ = null;
    this.color_ = null;
    if (options.color != undefined) {
      this.setColor(options.color);
    }
  }
  clone() {
    const color = this.getColor;
    return new Fill({
      color: Array.isArray(color) ? color.slice() : color || undefined,
    });
  }
  getColor(){
    return this.color_
  }
  setColor(color){
    if(color!===null && typeof color == 'object' && 'src' in color){
        const patternImage = getIconImage(null,color,src,'anonymous',undefined,color.offset?null:color.color?color.color:null,!(color.offset && color.size))

        patternImage.ready().then(()=>{
            this.patternImage_=null
        })

        if(patternImage.getImageState() === ImageState.IDLE){
            patternImage.load();
        }

        if(patternImage.getImageState() === ImageState.LOADING){
            this.patternImage_ = patternImage;
        }
    }
    this.color_=color
  }
  loading(){
    return !!this.patternImage_;
  }
  ready(){
    return this.patternImage_?this.patterImage_.ready(): Promise.resolve()
  }
}

Fill类的构造函数

Fill类的构造函数接受一个选项对象options，该对象可以包含color 属性。除此之外构造函数还定义了this.patternImage_属性，用于存储图案的图像对象，初始化为 null、this.color_属性用于存储颜色的属性，初始化为 null；然后判断，若options.color已经提供，则调用setColor()方法来设置颜色。

Fill类的主要方法

Fill类的主要方法如下：

• clone()方法：用于克隆当前的Fill对象。它获取当前的颜色并返回一个新的 Fill 实例。颜色是通过getColor()方法获取的。如果颜色是数组，则通过.slice()创建颜色数组的副本，避免引用相同的数组。

• getColor()方法：返回当前填充颜色。它返回的是 color_ 属性的值。

• setColor(color): 设置填充颜色或图案。如果传入的 color 是一个对象，并且该对象包含 src 属性（通常表示图案的来源），则认为它是一个图案，而不是普通的颜色。此时，代码通过 getIconImage 函数获取一个图案图像并处理图案的加载状态。

  • getIconImage()：这是一个函数，用于从给定的颜色对象中获取图案图像，并处理相关的加载状态。

  • patternImage.ready(): 通过调用图像的 ready() 方法，可以返回一个承诺对象，用来处理图像加载的完成。

  • patternImage.getImageState(): 检查图像当前的加载状态。

    • ImageState.IDLE：表示图像还没有加载。

    • ImageState.LOADING：表示图像正在加载中。

  • 如果图案图像处于加载中状态，则将patternImage_ 设置为图像对象。

如果传入的color 不是对象，或者不包含 src 属性，直接将 this.color_ 设置为传入的颜色值。

• loading(): 返回一个布尔值，表示图案是否正在加载。如果 patternImage_ 存在（即正在加载图案），返回 true，否则返回 false。

• ready(): 检查图案是否准备好。如果存在图案图像，则返回该图像的 ready() 方法，表示图像是否加载完成。如果没有图案图像，则返回一个已经解析的 Promise，表示“已准备好”

总结

Fill 类用于处理 Openlayers 中的图形填充样式，支持颜色和图案填充，能够灵活地管理填充样式，支持图案和颜色的动态加载与管理。