Javascript 用于将数据模型坐标转换为画布像素坐标的Pixi.js/WebGL方法

如果我的任何条款不正确，请提前道歉。我对WebGL词汇的熟悉程度还是很新的

我目前有一个项目，我正在创建一个图表库。我的问题源于将点从图表坐标系映射到webgl画布像素坐标的速度缓慢。例如：

    _____________ 100, 100
    |           |
    |           |
    |           |
    |           |
0,0 -------------

其中我的显示点随机分布在（[0100]、[0100]）之间。然后我需要将x/y值从0到100图表坐标转换为0，比如说640像素坐标。虽然我可以在javascript中执行此转换，但我想知道是否有更好的机制可以通过WebGL技术来执行此转换（例如使用图形卡可以比普通的旧javascript代码执行更快的一些输入注册某种形式的矩阵转换）

我当前的javascript函数从模型坐标转换为像素坐标：

function transformY(y, modelYmin, modelYmax, pixelYMax) {
    var numerator = y - modelYmin;
    var denominator = modelYmax - modelYmin;
    var ratio = numerator / denominator;
    var scale = ratio * pixelYMax;
    return scale;
}

function transformX(x, modelXmin, modelXmax, pixelXMax) {
    var numerator = x - modelXmin;
    var denominator = modelXmax - modelXmin;
    var ratio = numerator / denominator;
    var scale = ratio * pixelXMax;
    return scale;
}

---

提前谢谢

PIXI有一个名为

dimensions

的默认制服，您可以在WebGL代码中使用它。只需确保在PIXI过滤器中添加制服，如下所示：

function myFilter() {
  var uniforms = {
    dimensions: {type: '4f',value: new Float32Array([0, 0, 0, 0])}
  }
}

（例如，请参见在任何默认过滤器中如何使用

维度，例如）

如果此处定义了统一，PIXI将自动填充这些值，以便您可以使用WebGL中的
dimensions.xy
向量访问画布宽度/高度，然后您可以在其中执行转换
 您是否正在寻找基于pixi的解决方案？或者webgl？任何一个选项都足够了，谢谢！