@antv/l7-renderer 2.20.13 → 2.20.15

package/lib/device/index.js

@@ -42,15 +42,18 @@ __export(device_exports, {
 });
 module.exports = __toCommonJS(device_exports);
 var import_g_device_api = require("@antv/g-device-api");
+var import_l7_utils = require("@antv/l7-utils");
 var import_inversify = require("inversify");
 var import_reflect_metadata = require("reflect-metadata");
 var import_DeviceAttribute = __toESM(require("./DeviceAttribute"));
 var import_DeviceBuffer = __toESM(require("./DeviceBuffer"));
+var import_DeviceCache = require("./DeviceCache");
 var import_DeviceElements = __toESM(require("./DeviceElements"));
 var import_DeviceFramebuffer = __toESM(require("./DeviceFramebuffer"));
 var import_DeviceModel = __toESM(require("./DeviceModel"));
 var import_DeviceTexture2D = __toESM(require("./DeviceTexture2D"));
 var import_webgl = require("./utils/webgl");
+var { isUndefined } = import_l7_utils.lodashUtil;
 var DeviceRendererService = class {
   constructor() {
     this.uniformBuffers = [];
@@ -70,10 +73,38 @@ var DeviceRendererService = class {
       this.endFrame();
       this.currentFramebuffer = null;
     };
+    this.useFramebufferAsync = async (framebuffer, drawCommands) => {
+      this.currentFramebuffer = framebuffer;
+      this.preRenderPass = this.renderPass;
+      this.beginFrame();
+      await drawCommands();
+      this.endFrame();
+      this.currentFramebuffer = null;
+      this.renderPass = this.preRenderPass;
+    };
     this.clear = (options) => {
       const { color, depth, stencil, framebuffer = null } = options;
       if (framebuffer) {
         framebuffer.clearOptions = { color, depth, stencil };
+      } else {
+        const platformString = this.queryVerdorInfo();
+        if (platformString === "WebGL1") {
+          const gl = this.getGLContext();
+          if (!isUndefined(stencil)) {
+            gl.clearStencil(stencil);
+            gl.clear(gl.STENCIL_BUFFER_BIT);
+          } else if (!isUndefined(depth)) {
+            gl.clearDepth(depth);
+            gl.clear(gl.DEPTH_BUFFER_BIT);
+          }
+        } else if (platformString === "WebGL2") {
+          const gl = this.getGLContext();
+          if (!isUndefined(stencil)) {
+            gl.clearBufferiv(gl.STENCIL, 0, [stencil]);
+          } else if (!isUndefined(depth)) {
+            gl.clearBufferfv(gl.DEPTH, 0, [depth]);
+          }
+        }
       }
     };
     this.viewport = ({
@@ -82,6 +113,8 @@ var DeviceRendererService = class {
       width,
       height
     }) => {
+      this.swapChain.configureSwapChain(width, height);
+      this.createMainColorDepthRT(width, height);
       this.width = width;
       this.height = height;
     };
@@ -89,14 +122,46 @@ var DeviceRendererService = class {
       const { framebuffer, x, y, width, height } = options;
       const readback = this.device.createReadback();
       const texture = framebuffer["colorTexture"];
-      return readback.readTextureSync(
+      const result = readback.readTextureSync(
         texture,
         x,
-        y,
+        /**
+         * Origin is at lower-left corner. Width / height is already multiplied by dpr.
+         * WebGPU needs flipY
+         */
+        this.viewportOrigin === import_g_device_api.ViewportOrigin.LOWER_LEFT ? y : this.height - y,
         width,
         height,
         new Uint8Array(width * height * 4)
       );
+      readback.destroy();
+      return result;
+    };
+    this.readPixelsAsync = async (options) => {
+      const { framebuffer, x, y, width, height } = options;
+      const readback = this.device.createReadback();
+      const texture = framebuffer["colorTexture"];
+      const result = await readback.readTexture(
+        texture,
+        x,
+        /**
+         * Origin is at lower-left corner. Width / height is already multiplied by dpr.
+         * WebGPU needs flipY
+         */
+        this.viewportOrigin === import_g_device_api.ViewportOrigin.LOWER_LEFT ? y : this.height - y,
+        width,
+        height,
+        new Uint8Array(width * height * 4)
+      );
+      if (this.viewportOrigin !== import_g_device_api.ViewportOrigin.LOWER_LEFT) {
+        for (let j = 0; j < result.length; j += 4) {
+          const t = result[j];
+          result[j] = result[j + 2];
+          result[j + 2] = t;
+        }
+      }
+      readback.destroy();
+      return result;
     };
     this.getViewportSize = () => {
       return {
@@ -121,6 +186,7 @@ var DeviceRendererService = class {
         buffer.destroy();
       });
       this.device.destroy();
+      this.renderCache.destroy();
     };
   }
   async init(canvas, cfg) {
@@ -145,34 +211,45 @@ var DeviceRendererService = class {
     swapChain.configureSwapChain(canvas.width, canvas.height);
     this.device = swapChain.getDevice();
     this.swapChain = swapChain;
+    this.renderCache = new import_DeviceCache.RenderCache(this.device);
     this.currentFramebuffer = null;
+    this.viewportOrigin = this.device.queryVendorInfo().viewportOrigin;
     const gl = this.device["gl"];
     this.extensionObject = {
       // @ts-ignore
       OES_texture_float: !(0, import_webgl.isWebGL2)(gl) && this.device["OES_texture_float"]
     };
+    this.createMainColorDepthRT(canvas.width, canvas.height);
+  }
+  createMainColorDepthRT(width, height) {
+    if (this.mainColorRT) {
+      this.mainColorRT.destroy();
+    }
+    if (this.mainDepthRT) {
+      this.mainDepthRT.destroy();
+    }
     this.mainColorRT = this.device.createRenderTargetFromTexture(
       this.device.createTexture({
         format: import_g_device_api.Format.U8_RGBA_RT,
-        width: canvas.width,
-        height: canvas.height,
+        width,
+        height,
         usage: import_g_device_api.TextureUsage.RENDER_TARGET
       })
     );
     this.mainDepthRT = this.device.createRenderTargetFromTexture(
       this.device.createTexture({
         format: import_g_device_api.Format.D24_S8,
-        width: canvas.width,
-        height: canvas.height,
+        width,
+        height,
         usage: import_g_device_api.TextureUsage.RENDER_TARGET
       })
     );
   }
   beginFrame() {
+    this.device.beginFrame();
     const { currentFramebuffer, swapChain, mainColorRT, mainDepthRT } = this;
-    const onscreenTexture = swapChain.getOnscreenTexture();
     const colorAttachment = currentFramebuffer ? currentFramebuffer["colorRenderTarget"] : mainColorRT;
-    const colorResolveTo = currentFramebuffer ? null : onscreenTexture;
+    const colorResolveTo = currentFramebuffer ? null : swapChain.getOnscreenTexture();
     const depthStencilAttachment = currentFramebuffer ? currentFramebuffer["depthRenderTarget"] : mainDepthRT;
     const { color = [0, 0, 0, 0], depth = 1, stencil = 0 } = (
       // @ts-ignore
@@ -190,6 +267,8 @@ var DeviceRendererService = class {
       colorAttachment: [colorAttachment],
       colorResolveTo: [colorResolveTo],
       colorClearColor: [colorClearColor],
+      // colorStore: [!!currentFramebuffer],
+      colorStore: [true],
       depthStencilAttachment,
       depthClearValue,
       stencilClearValue
@@ -198,6 +277,7 @@ var DeviceRendererService = class {
   }
   endFrame() {
     this.device.submitPass(this.renderPass);
+    this.device.endFrame();
   }
   getPointSizeRange() {
     const gl = this.device["gl"];

package/lib/device/utils/HashMap.js

@@ -0,0 +1,113 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/device/utils/HashMap.ts
+var HashMap_exports = {};
+__export(HashMap_exports, {
+  HashMap: () => HashMap,
+  hashCodeNumberFinish: () => hashCodeNumberFinish,
+  hashCodeNumberUpdate: () => hashCodeNumberUpdate,
+  nullHashFunc: () => nullHashFunc
+});
+module.exports = __toCommonJS(HashMap_exports);
+function hashCodeNumberUpdate(hash, v = 0) {
+  hash += v;
+  hash += hash << 10;
+  hash += hash >>> 6;
+  return hash >>> 0;
+}
+function hashCodeNumberFinish(hash) {
+  hash += hash << 3;
+  hash ^= hash >>> 11;
+  hash += hash << 15;
+  return hash >>> 0;
+}
+function nullHashFunc(k) {
+  return 0;
+}
+var HashBucket = class {
+  constructor() {
+    this.keys = [];
+    this.values = [];
+  }
+};
+var HashMap = class {
+  constructor(keyEqualFunc, keyHashFunc) {
+    this.keyEqualFunc = keyEqualFunc;
+    this.keyHashFunc = keyHashFunc;
+    this.buckets = /* @__PURE__ */ new Map();
+  }
+  findBucketIndex(bucket, k) {
+    for (let i = 0; i < bucket.keys.length; i++)
+      if (this.keyEqualFunc(k, bucket.keys[i]))
+        return i;
+    return -1;
+  }
+  findBucket(k) {
+    const bw = this.keyHashFunc(k);
+    return this.buckets.get(bw);
+  }
+  get(k) {
+    const bucket = this.findBucket(k);
+    if (bucket === void 0)
+      return null;
+    const bi = this.findBucketIndex(bucket, k);
+    if (bi < 0)
+      return null;
+    return bucket.values[bi];
+  }
+  add(k, v) {
+    const bw = this.keyHashFunc(k);
+    if (this.buckets.get(bw) === void 0)
+      this.buckets.set(bw, new HashBucket());
+    const bucket = this.buckets.get(bw);
+    bucket.keys.push(k);
+    bucket.values.push(v);
+  }
+  delete(k) {
+    const bucket = this.findBucket(k);
+    if (bucket === void 0)
+      return;
+    const bi = this.findBucketIndex(bucket, k);
+    if (bi === -1)
+      return;
+    bucket.keys.splice(bi, 1);
+    bucket.values.splice(bi, 1);
+  }
+  clear() {
+    this.buckets.clear();
+  }
+  size() {
+    let acc = 0;
+    for (const bucket of this.buckets.values())
+      acc += bucket.values.length;
+    return acc;
+  }
+  *values() {
+    for (const bucket of this.buckets.values())
+      for (let j = bucket.values.length - 1; j >= 0; j--)
+        yield bucket.values[j];
+  }
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  HashMap,
+  hashCodeNumberFinish,
+  hashCodeNumberUpdate,
+  nullHashFunc
+});

package/lib/device/utils/typedarray.js

@@ -19,6 +19,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/device/utils/typedarray.ts
 var typedarray_exports = {};
 __export(typedarray_exports, {
+  extend3ChannelsTo4: () => extend3ChannelsTo4,
   isTypedArray: () => isTypedArray
 });
 module.exports = __toCommonJS(typedarray_exports);
@@ -37,7 +38,21 @@ var dtypes = {
 function isTypedArray(x) {
   return Object.prototype.toString.call(x) in dtypes;
 }
+function extend3ChannelsTo4(array, valueToInsert) {
+  const originalLength = array.length;
+  const insertCount = Math.ceil(originalLength / 3);
+  const newLength = originalLength + insertCount;
+  const newArray = new Float32Array(newLength);
+  for (let i = 0; i < newLength; i += 4) {
+    newArray[i] = array[i / 4 * 3];
+    newArray[i + 1] = array[i / 4 * 3 + 1];
+    newArray[i + 2] = array[i / 4 * 3 + 2];
+    newArray[i + 3] = valueToInsert;
+  }
+  return newArray;
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  extend3ChannelsTo4,
   isTypedArray
 });

package/lib/regl/index.js

@@ -67,6 +67,11 @@ var ReglRendererService = class {
         framebuffer: framebuffer ? framebuffer.get() : null
       })(drawCommands);
     };
+    this.useFramebufferAsync = async (framebuffer, drawCommands) => {
+      this.gl({
+        framebuffer: framebuffer ? framebuffer.get() : null
+      })(drawCommands);
+    };
     this.clear = (options) => {
       var _a;
       const { color, depth, stencil, framebuffer = null } = options;
@@ -102,6 +107,9 @@ var ReglRendererService = class {
       }
       return this.gl.read(readPixelsOptions);
     };
+    this.readPixelsAsync = async (options) => {
+      return this.readPixels(options);
+    };
     this.getViewportSize = () => {
       return {
         width: this.gl._gl.drawingBufferWidth,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/l7-renderer",
-  "version": "2.20.13",
+  "version": "2.20.15",
   "description": "",
   "license": "ISC",
   "author": "xiaoiver",
@@ -24,20 +24,20 @@
     "tsc": "tsc --project tsconfig.build.json"
   },
   "dependencies": {
-    "@antv/g-device-api": "^1.4.10",
-    "@antv/l7-core": "2.20.13",
-    "@antv/l7-utils": "2.20.13",
+    "@antv/g-device-api": "^1.6.4",
+    "@antv/l7-core": "2.20.15",
+    "@antv/l7-utils": "2.20.15",
     "@babel/runtime": "^7.7.7",
     "inversify": "^5.0.1",
     "reflect-metadata": "^0.2.1",
     "regl": "1.6.1"
   },
   "devDependencies": {
-    "@antv/l7-test-utils": "2.20.13",
+    "@antv/l7-test-utils": "2.20.15",
     "gl": "^6.0.2"
   },
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "9487cca3bdd14eb2fc81b310e4eae5d30a30496f"
+  "gitHead": "283c12854a06cd2181552d6a9cf00d3e34bbd58e"
 }