fitExtent
by bman654
HTML
<script src="https://rawgit.com/toji/gl-matrix/master/dist/gl-matrix.js"></script>
Babel + JSX
/**
*
* @param elementSize Object { width, height }
* @param topLeft Array [traceNumber, sampleNumber]
* @param bottomRight Array [traceNumber, sampleNumber]
* @returns {Object}
*/
function fitSeismicExtentToElement(elementSize, topLeft, bottomRight) {
const visibleTraces = Math.max(1, bottomRight[0] - topLeft[0] + 1);
const visibleSamples = Math.max(1, bottomRight[1] - topLeft[1] + 1);
const xscale = elementSize.width / visibleTraces;
const yscale = elementSize.height / visibleSamples;
const xoffset = topLeft[0] * xscale;
const yoffset = topLeft[1] * yscale;
const transform = mat3.create();
transform[0] = xscale;
transform[4] = yscale;
transform[6] = -xoffset;
transform[7] = -yoffset;
return transform;
}
function fitSeismicToElement(numTraces, numSamples, elementSize) {
const xscale = elementSize.width / numTraces;
const yscale = elementSize.height / numSamples;
const transform = mat3.create();
mat3.scale(transform, transform, [xscale, yscale]); // apply the scale
return transform;
}
let t;
let v;
function check(t, sx, sy, ex, ey) {
const v = vec2.fromValues(sx, sy);
vec2.transformMat3(v, v, t);
const descr = `transform([${sx}, ${sy}]) -> [${ex}, ${ey}]: `;
if (Math.abs(ex - v[0]) < 0.01 && Math.abs(ey - v[1]) < 0.01) {
console.log(`${descr}: OK`);
}
else {
console.log(`${descr}: NOTOK [${v[0]}, ${v[1]}]`);
}
}
console.log("full extent small canvas");
console.log(JSON.stringify({ result: fitSeismicToElement(100, 1000, {width: 100, height: 1000}) }));
console.log(JSON.stringify({ result: t = fitSeismicExtentToElement({width: 100, height: 1000}, [0, 0], [99, 999]) }));
check(t, 0, 0, 0, 0);
check(t, 99, 999, 99, 999);
console.log("full extent large canvas");
console.log(JSON.stringify({ result: fitSeismicToElement(100, 1000, {width: 1000, height: 1000}) }));
console.log(JSON.stringify({ result: t = fitSeismicExtentToElement({width: 1000, height:...