@antv/l7-renderer 2.20.5 → 2.20.6

package/lib/device/DeviceTexture2D.js

@@ -27,7 +27,7 @@ var import_g_device_api = require("@antv/g-device-api");
 var import_l7_core = require("@antv/l7-core");
 var import_constants = require("./constants");
 function isTexture2D(t) {
-  return false;
+  return !!(t && t["texture"]);
 }
 var DeviceTexture2D = class {
   constructor(device, options) {
@@ -41,12 +41,13 @@ var DeviceTexture2D = class {
       format = import_l7_core.gl.RGBA,
       wrapS = import_l7_core.gl.CLAMP_TO_EDGE,
       wrapT = import_l7_core.gl.CLAMP_TO_EDGE,
-      // aniso = 0,
-      alignment = 1
-      // mipmap = false,
+      aniso = 0,
+      alignment = 1,
+      usage = import_l7_core.TextureUsage.SAMPLED,
+      mipmap = false,
       // premultiplyAlpha = false,
-      // mag = gl.NEAREST,
-      // min = gl.NEAREST,
+      mag = import_l7_core.gl.NEAREST,
+      min = import_l7_core.gl.NEAREST
       // colorSpace = gl.BROWSER_DEFAULT_WEBGL,
       // x = 0,
       // y = 0,
@@ -57,10 +58,10 @@ var DeviceTexture2D = class {
     let pixelFormat = import_g_device_api.Format.U8_RGBA_RT;
     if (type === import_l7_core.gl.UNSIGNED_BYTE && format === import_l7_core.gl.RGBA) {
       pixelFormat = import_g_device_api.Format.U8_RGBA_RT;
-    } else if (format === import_l7_core.gl.LUMINANCE && type === import_l7_core.gl.FLOAT) {
-      pixelFormat = import_g_device_api.Format.F32_LUMINANCE;
-    } else if (format === import_l7_core.gl.LUMINANCE && type === import_l7_core.gl.UNSIGNED_BYTE) {
+    } else if (type === import_l7_core.gl.UNSIGNED_BYTE && format === import_l7_core.gl.LUMINANCE) {
       pixelFormat = import_g_device_api.Format.U8_LUMINANCE;
+    } else if (type === import_l7_core.gl.FLOAT && format === import_l7_core.gl.RGB) {
+      pixelFormat = import_g_device_api.Format.F32_RGB;
     } else {
       throw new Error(`create texture error, type: ${type}, format: ${format}`);
     }
@@ -68,11 +69,12 @@ var DeviceTexture2D = class {
       format: pixelFormat,
       width,
       height,
-      usage: import_g_device_api.TextureUsage.SAMPLED,
+      usage: usage === import_l7_core.TextureUsage.SAMPLED ? import_g_device_api.TextureUsage.SAMPLED : import_g_device_api.TextureUsage.RENDER_TARGET,
       pixelStore: {
         unpackFlipY: flipY,
         packAlignment: alignment
-      }
+      },
+      mipLevelCount: usage === import_l7_core.TextureUsage.RENDER_TARGET ? 1 : mipmap ? 1 : 0
     });
     if (data) {
       this.texture.setImageData([data]);
@@ -80,13 +82,12 @@ var DeviceTexture2D = class {
     this.sampler = device.createSampler({
       addressModeU: import_constants.wrapModeMap[wrapS],
       addressModeV: import_constants.wrapModeMap[wrapT],
-      minFilter: import_g_device_api.FilterMode.POINT,
-      // TODO: use mag & min
-      magFilter: import_g_device_api.FilterMode.BILINEAR,
+      minFilter: min === import_l7_core.gl.NEAREST ? import_g_device_api.FilterMode.POINT : import_g_device_api.FilterMode.BILINEAR,
+      magFilter: mag === import_l7_core.gl.NEAREST ? import_g_device_api.FilterMode.POINT : import_g_device_api.FilterMode.BILINEAR,
       mipmapFilter: import_g_device_api.MipmapFilterMode.NO_MIP,
-      lodMinClamp: 0,
-      lodMaxClamp: 0
-      // maxAnisotropy: aniso,
+      // lodMinClamp: 0,
+      // lodMaxClamp: 0,
+      maxAnisotropy: aniso
     });
   }
   get() {

package/lib/device/index.js

@@ -54,15 +54,24 @@ var import_webgl = require("./utils/webgl");
 var DeviceRendererService = class {
   constructor() {
     this.uniformBuffers = [];
-    this.createModel = (options) => new import_DeviceModel.default(this.device, options);
+    this.createModel = (options) => new import_DeviceModel.default(this.device, options, this);
     this.createAttribute = (options) => new import_DeviceAttribute.default(this.device, options);
     this.createBuffer = (options) => new import_DeviceBuffer.default(this.device, options);
     this.createElements = (options) => new import_DeviceElements.default(this.device, options);
     this.createTexture2D = (options) => new import_DeviceTexture2D.default(this.device, options);
     this.createFramebuffer = (options) => new import_DeviceFramebuffer.default(this.device, options);
-    this.useFramebuffer = () => {
+    this.useFramebuffer = (framebuffer, drawCommands) => {
+      this.currentFramebuffer = framebuffer;
+      this.beginFrame();
+      drawCommands();
+      this.endFrame();
+      this.currentFramebuffer = null;
     };
-    this.clear = () => {
+    this.clear = (options) => {
+      const { color, depth, stencil, framebuffer = null } = options;
+      if (framebuffer) {
+        framebuffer.clearOptions = { color, depth, stencil };
+      }
     };
     this.viewport = ({
       // x,
@@ -72,18 +81,24 @@ var DeviceRendererService = class {
     }) => {
       this.width = width;
       this.height = height;
-      this.device.width = width;
-      this.device.height = height;
     };
-    this.readPixels = () => {
-      return new Uint8Array();
+    this.readPixels = (options) => {
+      const { framebuffer, x, y, width, height } = options;
+      const readback = this.device.createReadback();
+      const texture = framebuffer["colorTexture"];
+      return readback.readTextureSync(
+        texture,
+        x,
+        y,
+        width,
+        height,
+        new Uint8Array(width * height * 4)
+      );
     };
     this.getViewportSize = () => {
       return {
-        // @ts-ignore
-        width: this.device.width,
-        // @ts-ignore
-        height: this.device.height
+        width: this.width,
+        height: this.height
       };
     };
     this.getContainer = () => {
@@ -127,18 +142,20 @@ var DeviceRendererService = class {
     swapChain.configureSwapChain(canvas.width, canvas.height);
     this.device = swapChain.getDevice();
     this.swapChain = swapChain;
+    this.currentFramebuffer = null;
     const gl = this.device["gl"];
     this.extensionObject = {
       // @ts-ignore
       OES_texture_float: !(0, import_webgl.isWebGL2)(gl) && this.device["OES_texture_float"]
     };
-    const renderTargetTexture = this.device.createTexture({
-      format: import_g_device_api.Format.U8_RGBA_RT,
-      width: canvas.width,
-      height: canvas.height,
-      usage: import_g_device_api.TextureUsage.RENDER_TARGET
-    });
-    this.renderTarget = this.device.createRenderTargetFromTexture(renderTargetTexture);
+    this.mainColorRT = this.device.createRenderTargetFromTexture(
+      this.device.createTexture({
+        format: import_g_device_api.Format.U8_RGBA_RT,
+        width: canvas.width,
+        height: canvas.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,
@@ -149,16 +166,32 @@ var DeviceRendererService = class {
     );
   }
   beginFrame() {
-    const onscreenTexture = this.swapChain.getOnscreenTexture();
-    this.renderPass = this.device.createRenderPass({
-      colorAttachment: [this.renderTarget],
-      // colorResolveTo: [onscreen ? onscreenTexture : onscreenTexture],
-      colorResolveTo: [onscreenTexture],
-      colorClearColor: [import_g_device_api.TransparentBlack],
-      depthStencilAttachment: this.mainDepthRT,
-      depthClearValue: 1
+    const { currentFramebuffer, swapChain, mainColorRT, mainDepthRT } = this;
+    const onscreenTexture = swapChain.getOnscreenTexture();
+    const colorAttachment = currentFramebuffer ? currentFramebuffer["colorRenderTarget"] : mainColorRT;
+    const colorResolveTo = currentFramebuffer ? null : onscreenTexture;
+    const depthStencilAttachment = currentFramebuffer ? currentFramebuffer["depthRenderTarget"] : mainDepthRT;
+    const { color = [0, 0, 0, 0], depth = 1, stencil = 0 } = (
+      // @ts-ignore
+      (currentFramebuffer == null ? void 0 : currentFramebuffer.clearOptions) || {}
+    );
+    const colorClearColor = colorAttachment ? (0, import_g_device_api.colorNewFromRGBA)(
+      color[0] * 255,
+      color[1] * 255,
+      color[2] * 255,
+      color[3]
+    ) : import_g_device_api.TransparentBlack;
+    const depthClearValue = depthStencilAttachment ? depth : void 0;
+    const stencilClearValue = depthStencilAttachment ? stencil : void 0;
+    const renderPass = this.device.createRenderPass({
+      colorAttachment: [colorAttachment],
+      colorResolveTo: [colorResolveTo],
+      colorClearColor: [colorClearColor],
+      depthStencilAttachment,
+      depthClearValue,
+      stencilClearValue
     });
-    this.device.renderPass = this.renderPass;
+    this.renderPass = renderPass;
   }
   endFrame() {
     this.device.submitPass(this.renderPass);

package/lib/regl/ReglModel.js

@@ -65,15 +65,17 @@ var ReglModel = class {
     Object.keys(attributes).forEach((name) => {
       reglAttributes[name] = attributes[name].get();
     });
+    const frag = (0, import_l7_core.removeDuplicateUniforms)(
+      (0, import_g_device_api.preprocessShader_GLSL)(vendorInfo, "frag", fs, null, false)
+    );
+    const vert = (0, import_l7_core.removeDuplicateUniforms)(
+      (0, import_g_device_api.preprocessShader_GLSL)(vendorInfo, "vert", vs, null, false)
+    );
     const drawParams = {
       attributes: reglAttributes,
-      frag: (0, import_l7_core.removeDuplicateUniforms)(
-        (0, import_g_device_api.preprocessShader_GLSL)(vendorInfo, "frag", fs, null, false)
-      ),
+      frag,
       uniforms: reglUniforms,
-      vert: (0, import_l7_core.removeDuplicateUniforms)(
-        (0, import_g_device_api.preprocessShader_GLSL)(vendorInfo, "vert", vs, null, false)
-      ),
+      vert,
       // @ts-ignore
       colorMask: reGl.prop("colorMask"),
       lineWidth: 1,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/l7-renderer",
-  "version": "2.20.5",
+  "version": "2.20.6",
   "description": "",
   "license": "ISC",
   "author": "xiaoiver",
@@ -14,30 +14,30 @@
     "README.md"
   ],
   "scripts": {
-    "tsc": "tsc --project tsconfig.build.json",
     "build": "father build",
     "build:cjs": "BABEL_ENV=cjs babel src --root-mode upward --out-dir lib --source-maps --extensions .ts,.tsx --delete-dir-on-start --no-comments",
     "build:esm": "BABEL_ENV=esm babel src --root-mode upward --out-dir es --source-maps --extensions .ts,.tsx --delete-dir-on-start --no-comments",
     "clean": "rimraf dist; rimraf es; rimraf lib;",
     "sync": "tnpm sync",
     "test": "umi-test --passWithNoTests",
-    "test-live": "umi-test --watch"
+    "test-live": "umi-test --watch",
+    "tsc": "tsc --project tsconfig.build.json"
   },
   "dependencies": {
-    "@antv/g-device-api": "^1.3.6",
-    "@antv/l7-core": "2.20.5",
-    "@antv/l7-utils": "2.20.5",
+    "@antv/g-device-api": "^1.4.5",
+    "@antv/l7-core": "2.20.6",
+    "@antv/l7-utils": "2.20.6",
     "@babel/runtime": "^7.7.7",
     "inversify": "^5.0.1",
-    "reflect-metadata": "^0.1.13",
+    "reflect-metadata": "^0.2.1",
     "regl": "1.6.1"
   },
   "devDependencies": {
-    "@antv/l7-test-utils": "2.20.5",
+    "@antv/l7-test-utils": "2.20.6",
     "gl": "^6.0.2"
   },
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "9c6df5f2ef050d18102f4aa4ccbb598bc1b5ee4d"
+  "gitHead": "b5af1f23f8f5524cbbb2ea858399fefba63b0163"
 }