@idmwx/idmui-gl4/dist/mapbox/src/helper/viewport.d.ts

idm webgl4

import mapboxgl from 'mapbox-gl';
export interface ParticleOptions {
    fadeOpacity: number;
    speedFactor: number;
    dropRate: number;
    dropRateBump: number;
    uvRange: number[];
    sRange: number[];
    scale: number;
}
export declare class Viewport {
    map: mapboxgl.Map;
    private mercator;
    rampColorLayer: string;
    rampColorSource: string;
    particleLayer: string;
    particleSource: string;
    rampColorCanvas: HTMLCanvasElement;
    particleCanvas: HTMLCanvasElement;
    ratio: number;
    constructor(map: mapboxgl.Map);
    /**
     * 转换为[-180, 180]的经度，且包含转换次数
     * @param lng
     * @param n
     */
    private convertNLng;
    /**
     * [4326坐标]
     * 返回视窗边界经纬度(从西北方向逆时针返回四个角的经纬度)
     * 依次为： NW, NE, SE, SW
     * @param map
     * @return [[lng, lat], [lng, lat], [lng, lat], [lng, lat]]
     */
    getBoundLngLat(): number[][];
    /**
     * [视窗像素坐标]
     * @see https://github.com/mapbox/sphericalmercator
     * 返回视窗边界像素
     * 依次为: 左下角(lf = left bottom)、右上角(rt = right top)
     * @param [lb.x, lb.y, rt.x, rt.y]
     */
    getBoundPixel(): any[];
    /**
     * [视窗边界像素宽度]
     */
    getBoundRange(): any[];
    /**
     * 获取视窗世界（多世界复本）
     * @param pixels
     * @param zoom
     */
    getWorldCopy(pixels: number[], zoom: number): number[][];
    resize(): void;
    toggle(visible: boolean): void;
    toggleParticle(visible: boolean): void;
}
export declare class WebGL {
    /**
     * 创建着色器
     * @see https://webglfundamentals.org/webgl/lessons/zh_cn/webgl-shaders-and-glsl.html
     * @param gl
     * @param type [VERTEX_SHADER, FRAGMENT_SHADER]
     * @param schema 着色器渲染代码[GLSL]
     */
    createShader(gl: WebGLRenderingContext, type: GLenum, schema: any): WebGLShader | null;
    /**
     * 创建纹理
     * @see https://blog.csdn.net/qq_37987033/article/details/128745577
     * @param gl
     * @param minFilter
     * @param magFilter
     * @param wrapFilter
     * @param data
     * @param width??
     * @param height??
     */
    createTexture(gl: WebGLRenderingContext, minFilter: GLint, magFilter: GLint, wrapFilter: GLint, data: Uint8Array | HTMLCanvasElement | HTMLImageElement | undefined, width?: number | undefined, height?: number | undefined): WebGLTexture | null;
    /**
     * 创建数据资源
     * @param type [array, element]
     * array: ARRAY_BUFFER
     * element: ELEMENT_ARRAY_BUFFER
     * @param resource 顶点数据
     */
    createDataBuffer(gl: WebGLRenderingContext, type: string, resource: BufferSource | undefined): WebGLBuffer | null;
    /**
     * 创建程序
     * @param gl
     * @param vertexSchema
     * @param fragmentSchema
     */
    createProgram(gl: WebGLRenderingContext, vertexSchema: string, fragmentSchema: string): WebGLProgram | null;
    /**
     * 创建程序并提取attrib & uniform参数
     * @param gl
     * @param vertexSchema
     * @param fragmentSchema
     */
    private createProgramWrapper;
    /**
     * 初始化渐变色纹理
     * @param colors
     */
    setup(context: WebGLRenderingContext | null, colors: Array<[number, string]>, int8?: boolean, width?: number, height?: number): {
        canvas: HTMLCanvasElement;
        texture: WebGLTexture | null;
    } | undefined;
    setupParticle(context: WebGLRenderingContext, num?: number): {
        resolution: number;
        total: number;
        texture0: WebGLTexture | null;
        texture1: WebGLTexture | null;
        indexBuffer: WebGLBuffer | null;
    };
    bind(context: WebGLRenderingContext | null, vertexSchema: string, fragmentSchema: string): {
        program: WebGLProgram;
        aPositionBuffer: WebGLBuffer | null;
    } | {
        program?: undefined;
        aPositionBuffer?: undefined;
    };
    bindParticle(gl: WebGLRenderingContext, drawVert: string, drawFrag: string, quadVert: string, screenFrag: string, updateFrag: string): {
        particle: {
            program: WebGLProgram;
        } | undefined;
        screen: {
            program: WebGLProgram;
        } | undefined;
        update: {
            program: WebGLProgram;
        } | undefined;
        quadBuffer: WebGLBuffer | null;
        frameBuffer: WebGLFramebuffer | null;
    };
    draw(viewport: Viewport, context: WebGLRenderingContext | null, program: WebGLProgram | null, texture: WebGLTexture | null, colorTexture: WebGLTexture | null, aPositionBuffer: WebGLBuffer | null, options?: ParticleOptions): void;
    drawParticle(viewport: Viewport, gl: WebGLRenderingContext, factorTexture: WebGLTexture, wrapper: any, options: ParticleOptions): void;
    private renderScreen;
    private renderScreenTexture;
    renderParticles(viewport: Viewport, gl: WebGLRenderingContext, wrapper: any, options: ParticleOptions): void;
    updateParticles(viewport: Viewport, gl: WebGLRenderingContext, wrapper: any, options: ParticleOptions): void;
    resize(viewport: Viewport, gl: WebGLRenderingContext): {
        screenTexture: WebGLTexture | null;
        backgroundTexture: WebGLTexture | null;
    };
    loadImg(data: any): Promise<HTMLImageElement>;
}
/**
 * WebGL (GLSL)渲染语法
 */
export declare class WebGLSchema {
    static vertexSchema: string;
    static uvFragmentSchema: string;
    static fragmentSchema: string;
}
export declare class ParticleSchema {
    static vertexSchema: string;
    static fragmentSchema: string;
    static quadVertSchema: string;
    static screenFragmentSchema: string;
    static updateFragmentSchema: string;
}