cione-comp-lib
Version:
`$ yarn add cione-comp-lib` 或者 `$ npm i cione-comp-lib -S`
94 lines (93 loc) • 3.43 kB
JavaScript
import graphicGL from "../../util/graphicGL.mjs";
import verticesSortMixin from "../../util/geometry/verticesSortMixin.mjs";
import "../../../../echarts/lib/echarts.mjs";
import glmatrix from "../../../../claygl/src/glmatrix/index.mjs";
import sdfSpriteGLSL from "./sdfSprite.glsl.mjs";
var vec4 = glmatrix.vec4;
graphicGL.Shader.import(sdfSpriteGLSL);
var PointsMesh = graphicGL.Mesh.extend(function() {
var geometry = new graphicGL.Geometry({
dynamic: true,
attributes: {
color: new graphicGL.Geometry.Attribute("color", "float", 4, "COLOR"),
position: new graphicGL.Geometry.Attribute("position", "float", 3, "POSITION"),
size: new graphicGL.Geometry.Attribute("size", "float", 1),
prevPosition: new graphicGL.Geometry.Attribute("prevPosition", "float", 3),
prevSize: new graphicGL.Geometry.Attribute("prevSize", "float", 1)
}
});
Object.assign(geometry, verticesSortMixin);
var material = new graphicGL.Material({
shader: graphicGL.createShader("ecgl.sdfSprite"),
transparent: true,
depthMask: false
});
material.enableTexture("sprite");
material.define("both", "VERTEX_COLOR");
material.define("both", "VERTEX_SIZE");
var sdfTexture = new graphicGL.Texture2D({
image: document.createElement("canvas"),
flipY: false
});
material.set("sprite", sdfTexture);
geometry.pick = this._pick.bind(this);
return {
geometry,
material,
mode: graphicGL.Mesh.POINTS,
sizeScale: 1
};
}, {
_pick: function(x, y, renderer, camera, renderable, out) {
var positionNDC = this._positionNDC;
if (!positionNDC) {
return;
}
var viewport = renderer.viewport;
var ndcScaleX = 2 / viewport.width;
var ndcScaleY = 2 / viewport.height;
for (var i = this.geometry.vertexCount - 1; i >= 0; i--) {
var idx;
if (!this.geometry.indices) {
idx = i;
} else {
idx = this.geometry.indices[i];
}
var cx = positionNDC[idx * 2];
var cy = positionNDC[idx * 2 + 1];
var size = this.geometry.attributes.size.get(idx) / this.sizeScale;
var halfSize = size / 2;
if (x > cx - halfSize * ndcScaleX && x < cx + halfSize * ndcScaleX && y > cy - halfSize * ndcScaleY && y < cy + halfSize * ndcScaleY) {
var point = new graphicGL.Vector3();
var pointWorld = new graphicGL.Vector3();
this.geometry.attributes.position.get(idx, point.array);
graphicGL.Vector3.transformMat4(pointWorld, point, this.worldTransform);
out.push({
vertexIndex: idx,
point,
pointWorld,
target: this,
distance: pointWorld.distance(camera.getWorldPosition())
});
}
}
},
updateNDCPosition: function(worldViewProjection, is2D, api) {
var positionNDC = this._positionNDC;
var geometry = this.geometry;
if (!positionNDC || positionNDC.length / 2 !== geometry.vertexCount) {
positionNDC = this._positionNDC = new Float32Array(geometry.vertexCount * 2);
}
var pos = vec4.create();
for (var i = 0; i < geometry.vertexCount; i++) {
geometry.attributes.position.get(i, pos);
pos[3] = 1;
vec4.transformMat4(pos, pos, worldViewProjection.array);
vec4.scale(pos, pos, 1 / pos[3]);
positionNDC[i * 2] = pos[0];
positionNDC[i * 2 + 1] = pos[1];
}
}
});
var PointsMesh$1 = PointsMesh;
export { PointsMesh$1 as default };