@antv/l7-layers 2.9.26-alpha.0 → 2.9.26

package/es/utils/simpleLine.js

@@ -0,0 +1,103 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import { aProjectFlat } from '@antv/l7-utils';
+import { vec2 } from 'gl-matrix';
+var lineA = vec2.create();
+export function direction(out, a, b) {
+  vec2.sub(out, a, b);
+  vec2.normalize(out, out);
+  return out;
+}
+
+var ExtrudePolyline = /*#__PURE__*/function () {
+  function ExtrudePolyline() {
+    _classCallCheck(this, ExtrudePolyline);
+
+    _defineProperty(this, "started", false);
+
+    _defineProperty(this, "totalDistance", 0);
+
+    _defineProperty(this, "currentIndex", 0);
+
+    this.complex = {
+      positions: [],
+      indices: [],
+      startIndex: 0,
+      indexes: []
+    };
+  }
+
+  _createClass(ExtrudePolyline, [{
+    key: "simpleExtrude",
+    value: function simpleExtrude(points) {
+      var complex = this.complex;
+
+      if (points.length <= 1) {
+        return complex;
+      }
+
+      this.started = false;
+      this.totalDistance = 0;
+      var total = points.length;
+      var count = complex.startIndex;
+
+      for (var i = 1; i < total; i++) {
+        var last = points[i - 1];
+        var cur = points[i];
+        var amt = this.simpleSegment(complex, count, last, cur);
+        count += amt;
+      }
+
+      for (var _i = 0; _i < complex.positions.length / 6; _i++) {
+        complex.positions[_i * 6 + 5] = this.totalDistance;
+      }
+
+      return complex;
+    }
+  }, {
+    key: "simpleSegment",
+    value: function simpleSegment(complex, index, last, cur) {
+      var count = 0;
+      var indices = complex.indices;
+      var positions = complex.positions;
+      var flatCur = aProjectFlat([cur[0], cur[1]]);
+      var flatLast = aProjectFlat([last[0], last[1]]);
+      direction(lineA, flatCur, flatLast);
+      var segmentDistance = this.lineSegmentDistance(flatCur, flatLast);
+      this.totalDistance += segmentDistance;
+
+      if (!this.started) {
+        this.started = true;
+        this.extrusions(positions, last, this.totalDistance - segmentDistance);
+      }
+
+      this.extrusions(positions, cur, this.totalDistance);
+      indices.push(index + 0, index + 1, index + 2);
+      indices.push(index + 2, index + 1, index + 3);
+      count += 2;
+      return count;
+    }
+  }, {
+    key: "extrusions",
+    value: function extrusions(positions, point, // 顶点
+    distanceRadio) {
+      positions.push(point[0], point[1], point[2] | 0, distanceRadio, 0, point[2] | 0);
+      this.complex.indexes.push(this.currentIndex);
+      positions.push(point[0], point[1], point[2] | 0, distanceRadio, 0, point[2] | 0);
+      this.complex.indexes.push(this.currentIndex);
+      this.currentIndex++;
+    }
+  }, {
+    key: "lineSegmentDistance",
+    value: function lineSegmentDistance(b1, a1) {
+      var dx = a1[0] - b1[0];
+      var dy = a1[1] - b1[1];
+      return Math.sqrt(dx * dx + dy * dy);
+    }
+  }]);
+
+  return ExtrudePolyline;
+}();
+
+export { ExtrudePolyline as default };

package/es/utils/symbol-layout.d.ts

@@ -0,0 +1,43 @@
+interface IPoint {
+    x: number;
+    y: number;
+}
+export declare type anchorType = 'right' | 'top-right' | 'left' | 'bottom-right' | 'left' | 'top-left' | 'bottom-left' | 'bottom' | 'bottom-right' | 'bottom-left' | 'top' | 'top-right' | 'top-left' | 'center';
+export interface IGlyphQuad {
+    tr: IPoint;
+    tl: IPoint;
+    bl: IPoint;
+    br: IPoint;
+    tex: {
+        x: number;
+        y: number;
+        height: number;
+        width: number;
+        advance: number;
+    };
+    glyphOffset: [number, number];
+}
+/**
+ * 计算文本中每个独立字符相对锚点的位置
+ *
+ * @param {string} text 原始文本
+ * @param {*} glyphs mapping
+ * @param {number} lineHeight 行高
+ * @param {string} textAnchor 文本相对于锚点的位置
+ * @param {string} textJustify 左右对齐
+ * @param {number} spacing 字符间距
+ * @param {[number, number]} translate 文本水平 & 垂直偏移量
+ * @param {[boolean]} isIconFont 是否是 iconfont
+ * @return {boolean|shaping} 每个字符相对于锚点的位置
+ */
+export declare function shapeText(text: string, glyphs: any, lineHeight: number, textAnchor: anchorType, textJustify: string, spacing: number, translate: [number, number] | undefined, isIconFont: boolean): false | {
+    positionedGlyphs: any[];
+    top: number;
+    bottom: number;
+    left: number;
+    right: number;
+    lineCount: number;
+    text: string;
+};
+export declare function getGlyphQuads(shaping: any, textOffset: [number, number] | undefined, alongLine: boolean): IGlyphQuad[];
+export {};

package/es/utils/symbol-layout.js

@@ -0,0 +1,299 @@
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+/**
+ * 返回文本相对锚点位置
+ * @param {string} anchor 锚点位置
+ * @return {alignment} alignment
+ */
+function getAnchorAlignment(anchor) {
+  var horizontalAlign = 0.5;
+  var verticalAlign = 0.5;
+
+  switch (anchor) {
+    case 'right':
+    case 'top-right':
+    case 'bottom-right':
+      horizontalAlign = 1;
+      break;
+
+    case 'left':
+    case 'top-left':
+    case 'bottom-left':
+      horizontalAlign = 0;
+      break;
+
+    default:
+      horizontalAlign = 0.5;
+  }
+
+  switch (anchor) {
+    case 'bottom':
+    case 'bottom-right':
+    case 'bottom-left':
+      verticalAlign = 1;
+      break;
+
+    case 'top':
+    case 'top-right':
+    case 'top-left':
+      verticalAlign = 0;
+      break;
+
+    default:
+      verticalAlign = 0.5;
+  }
+
+  return {
+    horizontalAlign: horizontalAlign,
+    verticalAlign: verticalAlign
+  };
+} // justify right = 1, left = 0, center = 0.5
+
+
+function justifyLine(positionedGlyphs, glyphMap, start, end, justify) {
+  if (!justify) {
+    return;
+  }
+
+  var lastPositionedGlyph = positionedGlyphs[end];
+  var glyph = lastPositionedGlyph.glyph;
+
+  if (glyph) {
+    var lastAdvance = glyphMap[glyph].advance * lastPositionedGlyph.scale;
+    var lineIndent = (positionedGlyphs[end].x + lastAdvance) * justify;
+
+    for (var j = start; j <= end; j++) {
+      positionedGlyphs[j].x -= lineIndent;
+    }
+  }
+} // justify right=1 left=0 center=0.5
+// horizontalAlign right=1 left=0 center=0.5
+// verticalAlign right=1 left=0 center=0.5
+
+
+function align(positionedGlyphs, justify, horizontalAlign, verticalAlign, maxLineLength, lineHeight, lineCount) {
+  var shiftX = (justify - horizontalAlign) * maxLineLength;
+  var shiftY = (-verticalAlign * lineCount + 0.5) * lineHeight;
+
+  var _iterator = _createForOfIteratorHelper(positionedGlyphs),
+      _step;
+
+  try {
+    for (_iterator.s(); !(_step = _iterator.n()).done;) {
+      var glyphs = _step.value;
+      glyphs.x += shiftX;
+      glyphs.y += shiftY;
+    }
+  } catch (err) {
+    _iterator.e(err);
+  } finally {
+    _iterator.f();
+  }
+}
+
+function shapeLines(shaping, glyphMap, lines, lineHeight, textAnchor, textJustify, spacing) {
+  // buffer 为 4
+  var yOffset = -8;
+  var x = 0;
+  var y = yOffset;
+  var maxLineLength = 0;
+  var positionedGlyphs = shaping.positionedGlyphs;
+  var justify = textJustify === 'right' ? 1 : textJustify === 'left' ? 0 : 0.5;
+  var lineStartIndex = positionedGlyphs.length;
+  lines.forEach(function (line) {
+    line.split('').forEach(function (char) {
+      var glyph = glyphMap[char];
+      var baselineOffset = 0;
+
+      if (glyph) {
+        positionedGlyphs.push({
+          glyph: char,
+          x: x,
+          y: y + baselineOffset,
+          vertical: false,
+          // TODO：目前只支持水平方向
+          scale: 1,
+          metrics: glyph
+        });
+        x += glyph.advance + spacing;
+      }
+    }); // 左右对齐
+
+    if (positionedGlyphs.length !== lineStartIndex) {
+      var lineLength = x - spacing;
+      maxLineLength = Math.max(lineLength, maxLineLength);
+      justifyLine(positionedGlyphs, glyphMap, lineStartIndex, positionedGlyphs.length - 1, justify);
+    }
+
+    x = 0;
+    y -= lineHeight + 5;
+  });
+
+  var _getAnchorAlignment = getAnchorAlignment(textAnchor),
+      horizontalAlign = _getAnchorAlignment.horizontalAlign,
+      verticalAlign = _getAnchorAlignment.verticalAlign;
+
+  align(positionedGlyphs, justify, horizontalAlign, verticalAlign, maxLineLength, lineHeight, lines.length); // 计算包围盒
+
+  var height = y - yOffset;
+  shaping.top += -verticalAlign * height;
+  shaping.bottom = shaping.top - height;
+  shaping.left += -horizontalAlign * maxLineLength;
+  shaping.right = shaping.left + maxLineLength;
+}
+
+function shapeIconFont(shaping, glyphMap, iconfonts, lineHeight, textAnchor, textJustify, spacing) {
+  // buffer 为 4
+  var yOffset = -8;
+  var x = 0;
+  var y = yOffset;
+  var maxLineLength = 0;
+  var positionedGlyphs = shaping.positionedGlyphs;
+  var justify = textJustify === 'right' ? 1 : textJustify === 'left' ? 0 : 0.5;
+  var lineStartIndex = positionedGlyphs.length;
+  iconfonts.forEach(function (iconfont) {
+    var glyph = glyphMap[iconfont];
+    var baselineOffset = 0;
+
+    if (glyph) {
+      positionedGlyphs.push({
+        glyph: iconfont,
+        // x,
+
+        /**
+         * iconfont
+         * 在计算大小的时候计算的是 unicode 字符 如 &#xe6d4;
+         * 在布局计算 icon 位置的时候应该始终保持居中（且 icon 只占一个字符的位置）
+         */
+        x: glyph.advance / 2,
+        y: y + baselineOffset,
+        vertical: false,
+        // TODO：目前只支持水平方向
+        scale: 1,
+        metrics: glyph
+      });
+      x += glyph.advance + spacing;
+    } // 左右对齐
+
+
+    if (positionedGlyphs.length !== lineStartIndex) {
+      var lineLength = x - spacing;
+      maxLineLength = Math.max(lineLength, maxLineLength);
+      justifyLine(positionedGlyphs, glyphMap, lineStartIndex, positionedGlyphs.length - 1, justify);
+    }
+
+    x = 0;
+    y -= lineHeight + 5;
+  });
+
+  var _getAnchorAlignment2 = getAnchorAlignment(textAnchor),
+      horizontalAlign = _getAnchorAlignment2.horizontalAlign,
+      verticalAlign = _getAnchorAlignment2.verticalAlign;
+
+  align(positionedGlyphs, justify, horizontalAlign, verticalAlign, maxLineLength, lineHeight, iconfonts.length); // 计算包围盒
+
+  var height = y - yOffset;
+  shaping.top += -verticalAlign * height;
+  shaping.bottom = shaping.top - height;
+  shaping.left += -horizontalAlign * maxLineLength;
+  shaping.right = shaping.left + maxLineLength;
+}
+/**
+ * 计算文本中每个独立字符相对锚点的位置
+ *
+ * @param {string} text 原始文本
+ * @param {*} glyphs mapping
+ * @param {number} lineHeight 行高
+ * @param {string} textAnchor 文本相对于锚点的位置
+ * @param {string} textJustify 左右对齐
+ * @param {number} spacing 字符间距
+ * @param {[number, number]} translate 文本水平 & 垂直偏移量
+ * @param {[boolean]} isIconFont 是否是 iconfont
+ * @return {boolean|shaping} 每个字符相对于锚点的位置
+ */
+
+
+export function shapeText(text, glyphs, lineHeight, textAnchor, textJustify, spacing) {
+  var translate = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : [0, 0];
+  var isIconFont = arguments.length > 7 ? arguments[7] : undefined;
+  // TODO：处理换行
+  var lines = text.split('\n');
+  var positionedGlyphs = [];
+  var shaping = {
+    positionedGlyphs: positionedGlyphs,
+    top: translate[1],
+    bottom: translate[1],
+    left: translate[0],
+    right: translate[0],
+    lineCount: lines.length,
+    text: text
+  };
+  isIconFont ? shapeIconFont(shaping, glyphs, lines, lineHeight, textAnchor, textJustify, spacing) : shapeLines(shaping, glyphs, lines, lineHeight, textAnchor, textJustify, spacing);
+
+  if (!positionedGlyphs.length) {
+    return false;
+  }
+
+  return shaping;
+}
+export function getGlyphQuads(shaping) {
+  var textOffset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [0, 0];
+  var alongLine = arguments.length > 2 ? arguments[2] : undefined;
+  var _shaping$positionedGl = shaping.positionedGlyphs,
+      positionedGlyphs = _shaping$positionedGl === void 0 ? [] : _shaping$positionedGl;
+  var quads = [];
+
+  var _iterator2 = _createForOfIteratorHelper(positionedGlyphs),
+      _step2;
+
+  try {
+    for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+      var positionedGlyph = _step2.value;
+      var rect = positionedGlyph.metrics; // The rects have an addditional buffer that is not included in their size.
+
+      var rectBuffer = 4;
+      var halfAdvance = rect.advance * positionedGlyph.scale / 2;
+      var glyphOffset = alongLine ? [positionedGlyph.x + halfAdvance, positionedGlyph.y] : [0, 0];
+      var builtInOffset = alongLine ? [0, 0] : [positionedGlyph.x + halfAdvance + textOffset[0], positionedGlyph.y + textOffset[1]];
+      var x1 = (0 - rectBuffer) * positionedGlyph.scale - halfAdvance + builtInOffset[0];
+      var y1 = (0 - rectBuffer) * positionedGlyph.scale + builtInOffset[1];
+      var x2 = x1 + rect.width * positionedGlyph.scale;
+      var y2 = y1 + rect.height * positionedGlyph.scale;
+      var tl = {
+        x: x1,
+        y: y1
+      };
+      var tr = {
+        x: x2,
+        y: y1
+      };
+      var bl = {
+        x: x1,
+        y: y2
+      };
+      var br = {
+        x: x2,
+        y: y2
+      }; // TODO：处理字符旋转的情况
+
+      quads.push({
+        tl: tl,
+        tr: tr,
+        bl: bl,
+        br: br,
+        tex: rect,
+        glyphOffset: glyphOffset
+      });
+    }
+  } catch (err) {
+    _iterator2.e(err);
+  } finally {
+    _iterator2.f();
+  }
+
+  return quads;
+}

package/es/utils/updateShape.d.ts

@@ -0,0 +1,2 @@
+import { ILayer, StyleAttributeField } from '@antv/l7-core';
+export declare function updateShape(layer: ILayer, lastShape: StyleAttributeField | undefined, currentShape: StyleAttributeField | undefined): void;

package/es/utils/updateShape.js

@@ -0,0 +1,20 @@
+// TODO: shapeUpdateList 存储一系列的 shape 类型
+// 当这一系列的 shape 相互切换的时候需要重构 layer 的 model (顶点数据集)
+var shapeUpdateList = [// PointLayer
+['circle', 'cylinder'], ['square', 'cylinder'], ['triangle', 'cylinder'], ['pentagon', 'cylinder'], ['hexagon', 'cylinder'], ['octogon', 'cylinder'], ['hexagram', 'cylinder'], ['rhombus', 'cylinder'], ['vesica', 'cylinder']];
+export function updateShape(layer, lastShape, currentShape) {
+  if (typeof lastShape === 'string' && typeof currentShape === 'string' && lastShape !== currentShape) {
+    if (layer.type === 'PointLayer') {
+      layer.dataState.dataSourceNeedUpdate = true;
+      return;
+    }
+
+    shapeUpdateList.map(function (shapes) {
+      if (shapes.includes(lastShape) && shapes.includes(currentShape)) {
+        // TODO: dataSourceNeedUpdate 借用数据更新时更新 layer model 的工作流
+        layer.dataState.dataSourceNeedUpdate = true;
+        return;
+      }
+    });
+  }
+}

package/es/wind/index.d.ts

@@ -0,0 +1,20 @@
+import BaseLayer from '../core/BaseLayer';
+import { IWindLayerStyleOptions } from '../core/interface';
+import { WindModelType } from './models';
+export default class WindLayer extends BaseLayer<IWindLayerStyleOptions> {
+    type: string;
+    buildModels(): void;
+    rebuildModels(): void;
+    renderModels(): this;
+    protected getConfigSchema(): {
+        properties: {
+            opacity: {
+                type: string;
+                minimum: number;
+                maximum: number;
+            };
+        };
+    };
+    protected getDefaultConfig(): {};
+    protected getModelType(): WindModelType;
+}

package/es/wind/index.js

@@ -0,0 +1,100 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+import BaseLayer from "../core/BaseLayer";
+import WindModels from "./models";
+
+var WindLayer = /*#__PURE__*/function (_BaseLayer) {
+  _inherits(WindLayer, _BaseLayer);
+
+  var _super = _createSuper(WindLayer);
+
+  function WindLayer() {
+    var _this;
+
+    _classCallCheck(this, WindLayer);
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _super.call.apply(_super, [this].concat(args));
+
+    _defineProperty(_assertThisInitialized(_this), "type", 'WindLayer');
+
+    return _this;
+  }
+
+  _createClass(WindLayer, [{
+    key: "buildModels",
+    value: function buildModels() {
+      var _this2 = this;
+
+      var modelType = this.getModelType();
+      this.layerModel = new WindModels[modelType](this);
+      this.layerModel.initModels(function (models) {
+        _this2.models = models;
+
+        _this2.renderLayers();
+      });
+    }
+  }, {
+    key: "rebuildModels",
+    value: function rebuildModels() {
+      var _this3 = this;
+
+      this.layerModel.buildModels(function (models) {
+        return _this3.models = models;
+      });
+    }
+  }, {
+    key: "renderModels",
+    value: function renderModels() {
+      if (this.layerModel) {
+        this.layerModel.render(); // 独立的渲染流程
+      }
+
+      return this;
+    }
+  }, {
+    key: "getConfigSchema",
+    value: function getConfigSchema() {
+      return {
+        properties: {
+          opacity: {
+            type: 'number',
+            minimum: 0,
+            maximum: 1
+          }
+        }
+      };
+    }
+  }, {
+    key: "getDefaultConfig",
+    value: function getDefaultConfig() {
+      var type = this.getModelType();
+      var defaultConfig = {
+        wind: {}
+      };
+      return defaultConfig[type];
+    }
+  }, {
+    key: "getModelType",
+    value: function getModelType() {
+      return 'wind';
+    }
+  }]);
+
+  return WindLayer;
+}(BaseLayer);
+
+export { WindLayer as default };

package/es/wind/models/index.d.ts

@@ -0,0 +1,5 @@
+export declare type WindModelType = 'wind';
+declare const WindModels: {
+    [key in WindModelType]: any;
+};
+export default WindModels;

package/es/wind/models/index.js

@@ -0,0 +1,5 @@
+import WindModel from "./wind";
+var WindModels = {
+  wind: WindModel
+};
+export default WindModels;

package/es/wind/models/utils.d.ts

@@ -0,0 +1,19 @@
+export declare function createProgram(gl: WebGLRenderingContext, vshader: string, fshader: string): WebGLProgram | null;
+export declare function loadShader(gl: WebGLRenderingContext, type: number, source: string): WebGLShader | null;
+export declare function createTexture(gl: WebGLRenderingContext, filter: any, data: any, width: number, height: number): WebGLTexture | null;
+export declare function createDataTexture(gl: WebGLRenderingContext, filter: any, data: any): WebGLTexture | null;
+export declare function bindTexture(gl: WebGLRenderingContext, texture: WebGLTexture, unit: number): void;
+export declare function createBuffer(gl: WebGLRenderingContext, data: Float32Array): WebGLBuffer | null;
+export declare function bindAttriBuffer(gl: WebGLRenderingContext, attrName: string, vertices: number, count: number, program: WebGLProgram): {
+    buffer: WebGLBuffer | null;
+    attr: number;
+    count: number;
+};
+export declare function bindAttriIndicesBuffer(gl: WebGLRenderingContext, indices: Uint8Array): WebGLBuffer;
+export declare function bindUnifrom(gl: WebGLRenderingContext, unifromName: string, data: number | Float32List, program: WebGLProgram, vec: string): WebGLUniformLocation | null;
+export declare function setUnifrom(gl: WebGLRenderingContext, location: WebGLUniformLocation, data: number | Float32List, vec: string): void;
+export declare function initFramebuffer(gl: WebGLRenderingContext): {
+    FRAMEBUFFER: WebGLFramebuffer | null;
+    OFFER_SCREEN_WIDTH: number;
+    OFFER_SCREEN_HEIGHT: number;
+};