Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@antv/g-camera-api

Package Overview
Dependencies
Maintainers
64
Versions
113
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@antv/g-camera-api - npm Package Compare versions

Comparing version 1.0.40 to 1.1.0-alpha.1

dist/index.esm.js.map
dist/index.js.map
dist/index.umd.min.js.map

1

dist/AdvancedCamera.d.ts

@@ -44,2 +44,1 @@ import { Camera } from '@antv/g-lite';

}
//# sourceMappingURL=AdvancedCamera.d.ts.map

1

dist/index.d.ts
import { AdvancedCamera } from './AdvancedCamera';
export { AdvancedCamera };
//# sourceMappingURL=index.d.ts.map

476

dist/index.esm.js
import { getAngle, CameraType, deg2rad, createVec3, runtime, Camera } from '@antv/g-lite';
import { __extends } from 'tslib';
import { isString, isNumber } from '@antv/util';
import { quat, mat4, vec3 } from 'gl-matrix';
function _inheritsLoose(subClass, superClass) {
subClass.prototype = Object.create(superClass.prototype);
subClass.prototype.constructor = subClass;
_setPrototypeOf(subClass, superClass);
}
function _setPrototypeOf(o, p) {
_setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {
o.__proto__ = p;
return o;
};
return _setPrototypeOf(o, p);
}
/**
* Provides camera action & animation.
*/
var AdvancedCamera = /*#__PURE__*/function (_Camera) {
_inheritsLoose(AdvancedCamera, _Camera);
function AdvancedCamera() {
var _this;
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
var AdvancedCamera = /** @class */ (function (_super) {
__extends(AdvancedCamera, _super);
function AdvancedCamera() {
var _this = _super !== null && _super.apply(this, arguments) || this;
/**
* switch between multiple landmarks
*/
_this.landmarks = [];
return _this;
/**
* Sets the camera to a distance such that the area covered by the bounding box is viewed.
*/
// shot(displayObject: DisplayObject) {
// const aabb = displayObject.getBounds();
// if (!AABB.isEmpty(aabb)) {
// this.setElevation(0);
// this.setAzimuth(0);
// this.setRoll(0);
// const { halfExtents, center } = aabb;
// const maxDim = Math.max(halfExtents[0] * 2, halfExtents[1] * 2);
// const cc = center.map((c: number) => Math.round(c * 1000) / 1000) as [number, number, number];
// if (maxDim !== 0) {
// const d = (1.5 * maxDim) / Math.tan(this.fov * DEG_2_RAD);
// this.setPosition([cc[0], cc[1], cc[2] + d]);
// }
// this.setFocalPoint(cc);
// }
// }
}
_this = _Camera.call.apply(_Camera, [this].concat(args)) || this;
/**
* switch between multiple landmarks
* Changes the azimuth and elevation with respect to the current camera axes
* @param {Number} azimuth the relative azimuth
* @param {Number} elevation the relative elevation
* @param {Number} roll the relative roll
*/
_this.landmarks = [];
_this.landmarkAnimationID = void 0;
return _this;
}
var _proto = AdvancedCamera.prototype;
/**
* Changes the azimuth and elevation with respect to the current camera axes
* @param {Number} azimuth the relative azimuth
* @param {Number} elevation the relative elevation
* @param {Number} roll the relative roll
*/
_proto.rotate = function rotate(azimuth, elevation, roll) {
this.relElevation = getAngle(elevation);
this.relAzimuth = getAngle(azimuth);
this.relRoll = getAngle(roll);
this.elevation += this.relElevation;
this.azimuth += this.relAzimuth;
this.roll += this.relRoll;
if (this.type === CameraType.EXPLORING) {
var rotX = quat.setAxisAngle(quat.create(), [1, 0, 0], deg2rad((this.rotateWorld ? 1 : -1) * this.relElevation));
var rotY = quat.setAxisAngle(quat.create(), [0, 1, 0], deg2rad((this.rotateWorld ? 1 : -1) * this.relAzimuth));
var rotZ = quat.setAxisAngle(quat.create(), [0, 0, 1], deg2rad(this.relRoll));
var rotQ = quat.multiply(quat.create(), rotY, rotX);
rotQ = quat.multiply(quat.create(), rotQ, rotZ);
var rotMatrix = mat4.fromQuat(mat4.create(), rotQ);
mat4.translate(this.matrix, this.matrix, [0, 0, -this.distance]);
mat4.multiply(this.matrix, this.matrix, rotMatrix);
mat4.translate(this.matrix, this.matrix, [0, 0, this.distance]);
} else {
if (Math.abs(this.elevation) > 90) {
AdvancedCamera.prototype.rotate = function (azimuth, elevation, roll) {
this.relElevation = getAngle(elevation);
this.relAzimuth = getAngle(azimuth);
this.relRoll = getAngle(roll);
this.elevation += this.relElevation;
this.azimuth += this.relAzimuth;
this.roll += this.relRoll;
if (this.type === CameraType.EXPLORING) {
var rotX = quat.setAxisAngle(quat.create(), [1, 0, 0], deg2rad((this.rotateWorld ? 1 : -1) * this.relElevation));
var rotY = quat.setAxisAngle(quat.create(), [0, 1, 0], deg2rad((this.rotateWorld ? 1 : -1) * this.relAzimuth));
var rotZ = quat.setAxisAngle(quat.create(), [0, 0, 1], deg2rad(this.relRoll));
var rotQ = quat.multiply(quat.create(), rotY, rotX);
rotQ = quat.multiply(quat.create(), rotQ, rotZ);
var rotMatrix = mat4.fromQuat(mat4.create(), rotQ);
mat4.translate(this.matrix, this.matrix, [0, 0, -this.distance]);
mat4.multiply(this.matrix, this.matrix, rotMatrix);
mat4.translate(this.matrix, this.matrix, [0, 0, this.distance]);
}
else {
if (Math.abs(this.elevation) > 90) {
return this;
}
this.computeMatrix();
}
this._getAxes();
if (this.type === CameraType.ORBITING ||
this.type === CameraType.EXPLORING) {
this._getPosition();
}
else if (this.type === CameraType.TRACKING) {
this._getFocalPoint();
}
this._update();
return this;
}
this.computeMatrix();
}
this._getAxes();
if (this.type === CameraType.ORBITING || this.type === CameraType.EXPLORING) {
this._getPosition();
} else if (this.type === CameraType.TRACKING) {
this._getFocalPoint();
}
this._update();
return this;
}
/**
* 沿水平(right) & 垂直(up)平移相机
*/;
_proto.pan = function pan(tx, ty) {
var coords = createVec3(tx, ty, 0);
var pos = vec3.clone(this.position);
vec3.add(pos, pos, vec3.scale(vec3.create(), this.right, coords[0]));
vec3.add(pos, pos, vec3.scale(vec3.create(), this.up, coords[1]));
this._setPosition(pos);
this.triggerUpdate();
return this;
}
/**
* 沿 n 轴移动，当距离视点远时移动速度较快，离视点越近速度越慢
*/;
_proto.dolly = function dolly(value) {
var n = this.forward;
var pos = vec3.clone(this.position);
var step = value * this.dollyingStep;
var updatedDistance = this.distance + value * this.dollyingStep;
// 限制视点距离范围
step = Math.max(Math.min(updatedDistance, this.maxDistance), this.minDistance) - this.distance;
pos[0] += step * n[0];
pos[1] += step * n[1];
pos[2] += step * n[2];
this._setPosition(pos);
if (this.type === CameraType.ORBITING || this.type === CameraType.EXPLORING) {
// 重新计算视点距离
this._getDistance();
} else if (this.type === CameraType.TRACKING) {
// 保持视距，移动视点位置
vec3.add(this.focalPoint, pos, this.distanceVector);
}
this.triggerUpdate();
return this;
};
_proto.cancelLandmarkAnimation = function cancelLandmarkAnimation() {
if (this.landmarkAnimationID !== undefined) {
this.canvas.cancelAnimationFrame(this.landmarkAnimationID);
}
};
_proto.createLandmark = function createLandmark(name, params) {
var _position$, _position$2, _focalPoint$, _focalPoint$2;
if (params === void 0) {
params = {};
}
var _params = params,
_params$position = _params.position,
position = _params$position === void 0 ? this.position : _params$position,
_params$focalPoint = _params.focalPoint,
focalPoint = _params$focalPoint === void 0 ? this.focalPoint : _params$focalPoint,
roll = _params.roll,
zoom = _params.zoom;
var camera = new runtime.CameraContribution();
camera.setType(this.type, undefined);
camera.setPosition(position[0], (_position$ = position[1]) !== null && _position$ !== void 0 ? _position$ : this.position[1], (_position$2 = position[2]) !== null && _position$2 !== void 0 ? _position$2 : this.position[2]);
camera.setFocalPoint(focalPoint[0], (_focalPoint$ = focalPoint[1]) !== null && _focalPoint$ !== void 0 ? _focalPoint$ : this.focalPoint[1], (_focalPoint$2 = focalPoint[2]) !== null && _focalPoint$2 !== void 0 ? _focalPoint$2 : this.focalPoint[2]);
camera.setRoll(roll !== null && roll !== void 0 ? roll : this.roll);
camera.setZoom(zoom !== null && zoom !== void 0 ? zoom : this.zoom);
var landmark = {
name: name,
matrix: mat4.clone(camera.getWorldTransform()),
right: vec3.clone(camera.right),
up: vec3.clone(camera.up),
forward: vec3.clone(camera.forward),
position: vec3.clone(camera.getPosition()),
focalPoint: vec3.clone(camera.getFocalPoint()),
distanceVector: vec3.clone(camera.getDistanceVector()),
distance: camera.getDistance(),
dollyingStep: camera.getDollyingStep(),
azimuth: camera.getAzimuth(),
elevation: camera.getElevation(),
roll: camera.getRoll(),
relAzimuth: camera.relAzimuth,
relElevation: camera.relElevation,
relRoll: camera.relRoll,
zoom: camera.getZoom()
};
this.landmarks.push(landmark);
return landmark;
};
_proto.gotoLandmark = function gotoLandmark(name, options) {
var _this2 = this;
if (options === void 0) {
options = {};
}
var landmark = isString(name) ? this.landmarks.find(function (l) {
return l.name === name;
}) : name;
if (landmark) {
var _ref = isNumber(options) ? {
duration: options
} : options,
_ref$easing = _ref.easing,
easing = _ref$easing === void 0 ? 'linear' : _ref$easing,
_ref$duration = _ref.duration,
duration = _ref$duration === void 0 ? 100 : _ref$duration,
_ref$easingFunction = _ref.easingFunction,
easingFunction = _ref$easingFunction === void 0 ? undefined : _ref$easingFunction,
_ref$onfinish = _ref.onfinish,
onfinish = _ref$onfinish === void 0 ? undefined : _ref$onfinish;
var epsilon = 0.01;
if (duration === 0) {
this.syncFromLandmark(landmark);
if (onfinish) {
onfinish();
/**
* 沿水平(right) & 垂直(up)平移相机
*/
AdvancedCamera.prototype.pan = function (tx, ty) {
var coords = createVec3(tx, ty, 0);
var pos = vec3.clone(this.position);
vec3.add(pos, pos, vec3.scale(vec3.create(), this.right, coords[0]));
vec3.add(pos, pos, vec3.scale(vec3.create(), this.up, coords[1]));
this._setPosition(pos);
this.triggerUpdate();
return this;
};
/**
* 沿 n 轴移动，当距离视点远时移动速度较快，离视点越近速度越慢
*/
AdvancedCamera.prototype.dolly = function (value) {
var n = this.forward;
var pos = vec3.clone(this.position);
var step = value * this.dollyingStep;
var updatedDistance = this.distance + value * this.dollyingStep;
// 限制视点距离范围
step =
Math.max(Math.min(updatedDistance, this.maxDistance), this.minDistance) -
this.distance;
pos[0] += step * n[0];
pos[1] += step * n[1];
pos[2] += step * n[2];
this._setPosition(pos);
if (this.type === CameraType.ORBITING ||
this.type === CameraType.EXPLORING) {
// 重新计算视点距离
this._getDistance();
}
return;
}
// cancel ongoing animation
this.cancelLandmarkAnimation();
var destPosition = landmark.position;
var destFocalPoint = landmark.focalPoint;
var destZoom = landmark.zoom;
var destRoll = landmark.roll;
var easingFunc = easingFunction || runtime.EasingFunction(easing);
var timeStart;
var endAnimation = function endAnimation() {
_this2.setFocalPoint(destFocalPoint);
_this2.setPosition(destPosition);
_this2.setRoll(destRoll);
_this2.setZoom(destZoom);
_this2.computeMatrix();
_this2.triggerUpdate();
if (onfinish) {
onfinish();
else if (this.type === CameraType.TRACKING) {
// 保持视距，移动视点位置
vec3.add(this.focalPoint, pos, this.distanceVector);
}
};
var animate = function animate(timestamp) {
if (timeStart === undefined) {
timeStart = timestamp;
this.triggerUpdate();
return this;
};
AdvancedCamera.prototype.cancelLandmarkAnimation = function () {
if (this.landmarkAnimationID !== undefined) {
this.canvas.cancelAnimationFrame(this.landmarkAnimationID);
}
var elapsed = timestamp - timeStart;
if (elapsed > duration) {
endAnimation();
return;
};
AdvancedCamera.prototype.createLandmark = function (name, params) {
var _a, _b, _c, _d;
if (params === void 0) { params = {}; }
var _e = params.position, position = _e === void 0 ? this.position : _e, _f = params.focalPoint, focalPoint = _f === void 0 ? this.focalPoint : _f, roll = params.roll, zoom = params.zoom;
var camera = new runtime.CameraContribution();
camera.setType(this.type, undefined);
camera.setPosition(position[0], (_a = position[1]) !== null && _a !== void 0 ? _a : this.position[1], (_b = position[2]) !== null && _b !== void 0 ? _b : this.position[2]);
camera.setFocalPoint(focalPoint[0], (_c = focalPoint[1]) !== null && _c !== void 0 ? _c : this.focalPoint[1], (_d = focalPoint[2]) !== null && _d !== void 0 ? _d : this.focalPoint[2]);
camera.setRoll(roll !== null && roll !== void 0 ? roll : this.roll);
camera.setZoom(zoom !== null && zoom !== void 0 ? zoom : this.zoom);
var landmark = {
name: name,
matrix: mat4.clone(camera.getWorldTransform()),
right: vec3.clone(camera.right),
up: vec3.clone(camera.up),
forward: vec3.clone(camera.forward),
position: vec3.clone(camera.getPosition()),
focalPoint: vec3.clone(camera.getFocalPoint()),
distanceVector: vec3.clone(camera.getDistanceVector()),
distance: camera.getDistance(),
dollyingStep: camera.getDollyingStep(),
azimuth: camera.getAzimuth(),
elevation: camera.getElevation(),
roll: camera.getRoll(),
relAzimuth: camera.relAzimuth,
relElevation: camera.relElevation,
relRoll: camera.relRoll,
zoom: camera.getZoom(),
};
this.landmarks.push(landmark);
return landmark;
};
AdvancedCamera.prototype.gotoLandmark = function (name, options) {
var _this = this;
if (options === void 0) { options = {}; }
var landmark = isString(name)
? this.landmarks.find(function (l) { return l.name === name; })
: name;
if (landmark) {
var _a = isNumber(options) ? { duration: options } : options, _b = _a.easing, easing = _b === void 0 ? 'linear' : _b, _c = _a.duration, duration_1 = _c === void 0 ? 100 : _c, _d = _a.easingFunction, easingFunction = _d === void 0 ? undefined : _d, _e = _a.onfinish, onfinish_1 = _e === void 0 ? undefined : _e;
var epsilon_1 = 0.01;
if (duration_1 === 0) {
this.syncFromLandmark(landmark);
if (onfinish_1) {
onfinish_1();
}
return;
}
// cancel ongoing animation
this.cancelLandmarkAnimation();
var destPosition_1 = landmark.position;
var destFocalPoint_1 = landmark.focalPoint;
var destZoom_1 = landmark.zoom;
var destRoll_1 = landmark.roll;
var easingFunc_1 = easingFunction || runtime.EasingFunction(easing);
var timeStart_1;
var endAnimation_1 = function () {
_this.setFocalPoint(destFocalPoint_1);
_this.setPosition(destPosition_1);
_this.setRoll(destRoll_1);
_this.setZoom(destZoom_1);
_this.computeMatrix();
_this.triggerUpdate();
if (onfinish_1) {
onfinish_1();
}
};
var animate_1 = function (timestamp) {
if (timeStart_1 === undefined) {
timeStart_1 = timestamp;
}
var elapsed = timestamp - timeStart_1;
if (elapsed > duration_1) {
endAnimation_1();
return;
}
// use the same ease function in animation system
var t = easingFunc_1(elapsed / duration_1);
var interFocalPoint = vec3.create();
var interPosition = vec3.create();
var interZoom = 1;
var interRoll = 0;
vec3.lerp(interFocalPoint, _this.focalPoint, destFocalPoint_1, t);
vec3.lerp(interPosition, _this.position, destPosition_1, t);
interRoll = _this.roll * (1 - t) + destRoll_1 * t;
interZoom = _this.zoom * (1 - t) + destZoom_1 * t;
_this.setFocalPoint(interFocalPoint);
_this.setPosition(interPosition);
_this.setRoll(interRoll);
_this.setZoom(interZoom);
var dist = vec3.dist(interFocalPoint, destFocalPoint_1) +
vec3.dist(interPosition, destPosition_1);
if (dist <= epsilon_1 && destZoom_1 == undefined && destRoll_1 == undefined) {
endAnimation_1();
return;
}
_this.computeMatrix();
_this.triggerUpdate();
if (elapsed < duration_1) {
_this.landmarkAnimationID = _this.canvas.requestAnimationFrame(animate_1);
}
};
this.canvas.requestAnimationFrame(animate_1);
}
// use the same ease function in animation system
var t = easingFunc(elapsed / duration);
var interFocalPoint = vec3.create();
var interPosition = vec3.create();
var interZoom = 1;
var interRoll = 0;
vec3.lerp(interFocalPoint, _this2.focalPoint, destFocalPoint, t);
vec3.lerp(interPosition, _this2.position, destPosition, t);
interRoll = _this2.roll * (1 - t) + destRoll * t;
interZoom = _this2.zoom * (1 - t) + destZoom * t;
_this2.setFocalPoint(interFocalPoint);
_this2.setPosition(interPosition);
_this2.setRoll(interRoll);
_this2.setZoom(interZoom);
var dist = vec3.dist(interFocalPoint, destFocalPoint) + vec3.dist(interPosition, destPosition);
if (dist <= epsilon && destZoom == undefined && destRoll == undefined) {
endAnimation();
return;
}
_this2.computeMatrix();
_this2.triggerUpdate();
if (elapsed < duration) {
_this2.landmarkAnimationID = _this2.canvas.requestAnimationFrame(animate);
}
};
this.canvas.requestAnimationFrame(animate);
}
};
_proto.syncFromLandmark = function syncFromLandmark(landmark) {
this.matrix = mat4.copy(this.matrix, landmark.matrix);
this.right = vec3.copy(this.right, landmark.right);
this.up = vec3.copy(this.up, landmark.up);
this.forward = vec3.copy(this.forward, landmark.forward);
this.position = vec3.copy(this.position, landmark.position);
this.focalPoint = vec3.copy(this.focalPoint, landmark.focalPoint);
this.distanceVector = vec3.copy(this.distanceVector, landmark.distanceVector);
this.azimuth = landmark.azimuth;
this.elevation = landmark.elevation;
this.roll = landmark.roll;
this.relAzimuth = landmark.relAzimuth;
this.relElevation = landmark.relElevation;
this.relRoll = landmark.relRoll;
this.dollyingStep = landmark.dollyingStep;
this.distance = landmark.distance;
this.zoom = landmark.zoom;
};
return AdvancedCamera;
}(Camera);
};
AdvancedCamera.prototype.syncFromLandmark = function (landmark) {
this.matrix = mat4.copy(this.matrix, landmark.matrix);
this.right = vec3.copy(this.right, landmark.right);
this.up = vec3.copy(this.up, landmark.up);
this.forward = vec3.copy(this.forward, landmark.forward);
this.position = vec3.copy(this.position, landmark.position);
this.focalPoint = vec3.copy(this.focalPoint, landmark.focalPoint);
this.distanceVector = vec3.copy(this.distanceVector, landmark.distanceVector);
this.azimuth = landmark.azimuth;
this.elevation = landmark.elevation;
this.roll = landmark.roll;
this.relAzimuth = landmark.relAzimuth;
this.relElevation = landmark.relElevation;
this.relRoll = landmark.relRoll;
this.dollyingStep = landmark.dollyingStep;
this.distance = landmark.distance;
this.zoom = landmark.zoom;
};
return AdvancedCamera;
}(Camera));

@@ -264,1 +253,2 @@ runtime.CameraContribution = AdvancedCamera;

export { AdvancedCamera };
//# sourceMappingURL=index.esm.js.map

478

dist/index.js
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var gLite = require('@antv/g-lite');
var tslib = require('tslib');
var util = require('@antv/util');
var glMatrix = require('gl-matrix');
function _inheritsLoose(subClass, superClass) {
subClass.prototype = Object.create(superClass.prototype);
subClass.prototype.constructor = subClass;
_setPrototypeOf(subClass, superClass);
}
function _setPrototypeOf(o, p) {
_setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {
o.__proto__ = p;
return o;
};
return _setPrototypeOf(o, p);
}
/**
* Provides camera action & animation.
*/
var AdvancedCamera = /*#__PURE__*/function (_Camera) {
_inheritsLoose(AdvancedCamera, _Camera);
function AdvancedCamera() {
var _this;
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
var AdvancedCamera = /** @class */ (function (_super) {
tslib.__extends(AdvancedCamera, _super);
function AdvancedCamera() {
var _this = _super !== null && _super.apply(this, arguments) || this;
/**
* switch between multiple landmarks
*/
_this.landmarks = [];
return _this;
/**
* Sets the camera to a distance such that the area covered by the bounding box is viewed.
*/
// shot(displayObject: DisplayObject) {
// const aabb = displayObject.getBounds();
// if (!AABB.isEmpty(aabb)) {
// this.setElevation(0);
// this.setAzimuth(0);
// this.setRoll(0);
// const { halfExtents, center } = aabb;
// const maxDim = Math.max(halfExtents[0] * 2, halfExtents[1] * 2);
// const cc = center.map((c: number) => Math.round(c * 1000) / 1000) as [number, number, number];
// if (maxDim !== 0) {
// const d = (1.5 * maxDim) / Math.tan(this.fov * DEG_2_RAD);
// this.setPosition([cc[0], cc[1], cc[2] + d]);
// }
// this.setFocalPoint(cc);
// }
// }
}
_this = _Camera.call.apply(_Camera, [this].concat(args)) || this;
/**
* switch between multiple landmarks
* Changes the azimuth and elevation with respect to the current camera axes
* @param {Number} azimuth the relative azimuth
* @param {Number} elevation the relative elevation
* @param {Number} roll the relative roll
*/
_this.landmarks = [];
_this.landmarkAnimationID = void 0;
return _this;
}
var _proto = AdvancedCamera.prototype;
/**
* Changes the azimuth and elevation with respect to the current camera axes
* @param {Number} azimuth the relative azimuth
* @param {Number} elevation the relative elevation
* @param {Number} roll the relative roll
*/
_proto.rotate = function rotate(azimuth, elevation, roll) {
this.relElevation = gLite.getAngle(elevation);
this.relAzimuth = gLite.getAngle(azimuth);
this.relRoll = gLite.getAngle(roll);
this.elevation += this.relElevation;
this.azimuth += this.relAzimuth;
this.roll += this.relRoll;
if (this.type === gLite.CameraType.EXPLORING) {
var rotX = glMatrix.quat.setAxisAngle(glMatrix.quat.create(), [1, 0, 0], gLite.deg2rad((this.rotateWorld ? 1 : -1) * this.relElevation));
var rotY = glMatrix.quat.setAxisAngle(glMatrix.quat.create(), [0, 1, 0], gLite.deg2rad((this.rotateWorld ? 1 : -1) * this.relAzimuth));
var rotZ = glMatrix.quat.setAxisAngle(glMatrix.quat.create(), [0, 0, 1], gLite.deg2rad(this.relRoll));
var rotQ = glMatrix.quat.multiply(glMatrix.quat.create(), rotY, rotX);
rotQ = glMatrix.quat.multiply(glMatrix.quat.create(), rotQ, rotZ);
var rotMatrix = glMatrix.mat4.fromQuat(glMatrix.mat4.create(), rotQ);
glMatrix.mat4.translate(this.matrix, this.matrix, [0, 0, -this.distance]);
glMatrix.mat4.multiply(this.matrix, this.matrix, rotMatrix);
glMatrix.mat4.translate(this.matrix, this.matrix, [0, 0, this.distance]);
} else {
if (Math.abs(this.elevation) > 90) {
AdvancedCamera.prototype.rotate = function (azimuth, elevation, roll) {
this.relElevation = gLite.getAngle(elevation);
this.relAzimuth = gLite.getAngle(azimuth);
this.relRoll = gLite.getAngle(roll);
this.elevation += this.relElevation;
this.azimuth += this.relAzimuth;
this.roll += this.relRoll;
if (this.type === gLite.CameraType.EXPLORING) {
var rotX = glMatrix.quat.setAxisAngle(glMatrix.quat.create(), [1, 0, 0], gLite.deg2rad((this.rotateWorld ? 1 : -1) * this.relElevation));
var rotY = glMatrix.quat.setAxisAngle(glMatrix.quat.create(), [0, 1, 0], gLite.deg2rad((this.rotateWorld ? 1 : -1) * this.relAzimuth));
var rotZ = glMatrix.quat.setAxisAngle(glMatrix.quat.create(), [0, 0, 1], gLite.deg2rad(this.relRoll));
var rotQ = glMatrix.quat.multiply(glMatrix.quat.create(), rotY, rotX);
rotQ = glMatrix.quat.multiply(glMatrix.quat.create(), rotQ, rotZ);
var rotMatrix = glMatrix.mat4.fromQuat(glMatrix.mat4.create(), rotQ);
glMatrix.mat4.translate(this.matrix, this.matrix, [0, 0, -this.distance]);
glMatrix.mat4.multiply(this.matrix, this.matrix, rotMatrix);
glMatrix.mat4.translate(this.matrix, this.matrix, [0, 0, this.distance]);
}
else {
if (Math.abs(this.elevation) > 90) {
return this;
}
this.computeMatrix();
}
this._getAxes();
if (this.type === gLite.CameraType.ORBITING ||
this.type === gLite.CameraType.EXPLORING) {
this._getPosition();
}
else if (this.type === gLite.CameraType.TRACKING) {
this._getFocalPoint();
}
this._update();
return this;
}
this.computeMatrix();
}
this._getAxes();
if (this.type === gLite.CameraType.ORBITING || this.type === gLite.CameraType.EXPLORING) {
this._getPosition();
} else if (this.type === gLite.CameraType.TRACKING) {
this._getFocalPoint();
}
this._update();
return this;
}
/**
* 沿水平(right) & 垂直(up)平移相机
*/;
_proto.pan = function pan(tx, ty) {
var coords = gLite.createVec3(tx, ty, 0);
var pos = glMatrix.vec3.clone(this.position);
glMatrix.vec3.add(pos, pos, glMatrix.vec3.scale(glMatrix.vec3.create(), this.right, coords[0]));
glMatrix.vec3.add(pos, pos, glMatrix.vec3.scale(glMatrix.vec3.create(), this.up, coords[1]));
this._setPosition(pos);
this.triggerUpdate();
return this;
}
/**
* 沿 n 轴移动，当距离视点远时移动速度较快，离视点越近速度越慢
*/;
_proto.dolly = function dolly(value) {
var n = this.forward;
var pos = glMatrix.vec3.clone(this.position);
var step = value * this.dollyingStep;
var updatedDistance = this.distance + value * this.dollyingStep;
// 限制视点距离范围
step = Math.max(Math.min(updatedDistance, this.maxDistance), this.minDistance) - this.distance;
pos[0] += step * n[0];
pos[1] += step * n[1];
pos[2] += step * n[2];
this._setPosition(pos);
if (this.type === gLite.CameraType.ORBITING || this.type === gLite.CameraType.EXPLORING) {
// 重新计算视点距离
this._getDistance();
} else if (this.type === gLite.CameraType.TRACKING) {
// 保持视距，移动视点位置
glMatrix.vec3.add(this.focalPoint, pos, this.distanceVector);
}
this.triggerUpdate();
return this;
};
_proto.cancelLandmarkAnimation = function cancelLandmarkAnimation() {
if (this.landmarkAnimationID !== undefined) {
this.canvas.cancelAnimationFrame(this.landmarkAnimationID);
}
};
_proto.createLandmark = function createLandmark(name, params) {
var _position$, _position$2, _focalPoint$, _focalPoint$2;
if (params === void 0) {
params = {};
}
var _params = params,
_params$position = _params.position,
position = _params$position === void 0 ? this.position : _params$position,
_params$focalPoint = _params.focalPoint,
focalPoint = _params$focalPoint === void 0 ? this.focalPoint : _params$focalPoint,
roll = _params.roll,
zoom = _params.zoom;
var camera = new gLite.runtime.CameraContribution();
camera.setType(this.type, undefined);
camera.setPosition(position[0], (_position$ = position[1]) !== null && _position$ !== void 0 ? _position$ : this.position[1], (_position$2 = position[2]) !== null && _position$2 !== void 0 ? _position$2 : this.position[2]);
camera.setFocalPoint(focalPoint[0], (_focalPoint$ = focalPoint[1]) !== null && _focalPoint$ !== void 0 ? _focalPoint$ : this.focalPoint[1], (_focalPoint$2 = focalPoint[2]) !== null && _focalPoint$2 !== void 0 ? _focalPoint$2 : this.focalPoint[2]);
camera.setRoll(roll !== null && roll !== void 0 ? roll : this.roll);
camera.setZoom(zoom !== null && zoom !== void 0 ? zoom : this.zoom);
var landmark = {
name: name,
matrix: glMatrix.mat4.clone(camera.getWorldTransform()),
right: glMatrix.vec3.clone(camera.right),
up: glMatrix.vec3.clone(camera.up),
forward: glMatrix.vec3.clone(camera.forward),
position: glMatrix.vec3.clone(camera.getPosition()),
focalPoint: glMatrix.vec3.clone(camera.getFocalPoint()),
distanceVector: glMatrix.vec3.clone(camera.getDistanceVector()),
distance: camera.getDistance(),
dollyingStep: camera.getDollyingStep(),
azimuth: camera.getAzimuth(),
elevation: camera.getElevation(),
roll: camera.getRoll(),
relAzimuth: camera.relAzimuth,
relElevation: camera.relElevation,
relRoll: camera.relRoll,
zoom: camera.getZoom()
};
this.landmarks.push(landmark);
return landmark;
};
_proto.gotoLandmark = function gotoLandmark(name, options) {
var _this2 = this;
if (options === void 0) {
options = {};
}
var landmark = util.isString(name) ? this.landmarks.find(function (l) {
return l.name === name;
}) : name;
if (landmark) {
var _ref = util.isNumber(options) ? {
duration: options
} : options,
_ref$easing = _ref.easing,
easing = _ref$easing === void 0 ? 'linear' : _ref$easing,
_ref$duration = _ref.duration,
duration = _ref$duration === void 0 ? 100 : _ref$duration,
_ref$easingFunction = _ref.easingFunction,
easingFunction = _ref$easingFunction === void 0 ? undefined : _ref$easingFunction,
_ref$onfinish = _ref.onfinish,
onfinish = _ref$onfinish === void 0 ? undefined : _ref$onfinish;
var epsilon = 0.01;
if (duration === 0) {
this.syncFromLandmark(landmark);
if (onfinish) {
onfinish();
/**
* 沿水平(right) & 垂直(up)平移相机
*/
AdvancedCamera.prototype.pan = function (tx, ty) {
var coords = gLite.createVec3(tx, ty, 0);
var pos = glMatrix.vec3.clone(this.position);
glMatrix.vec3.add(pos, pos, glMatrix.vec3.scale(glMatrix.vec3.create(), this.right, coords[0]));
glMatrix.vec3.add(pos, pos, glMatrix.vec3.scale(glMatrix.vec3.create(), this.up, coords[1]));
this._setPosition(pos);
this.triggerUpdate();
return this;
};
/**
* 沿 n 轴移动，当距离视点远时移动速度较快，离视点越近速度越慢
*/
AdvancedCamera.prototype.dolly = function (value) {
var n = this.forward;
var pos = glMatrix.vec3.clone(this.position);
var step = value * this.dollyingStep;
var updatedDistance = this.distance + value * this.dollyingStep;
// 限制视点距离范围
step =
Math.max(Math.min(updatedDistance, this.maxDistance), this.minDistance) -
this.distance;
pos[0] += step * n[0];
pos[1] += step * n[1];
pos[2] += step * n[2];
this._setPosition(pos);
if (this.type === gLite.CameraType.ORBITING ||
this.type === gLite.CameraType.EXPLORING) {
// 重新计算视点距离
this._getDistance();
}
return;
}
// cancel ongoing animation
this.cancelLandmarkAnimation();
var destPosition = landmark.position;
var destFocalPoint = landmark.focalPoint;
var destZoom = landmark.zoom;
var destRoll = landmark.roll;
var easingFunc = easingFunction || gLite.runtime.EasingFunction(easing);
var timeStart;
var endAnimation = function endAnimation() {
_this2.setFocalPoint(destFocalPoint);
_this2.setPosition(destPosition);
_this2.setRoll(destRoll);
_this2.setZoom(destZoom);
_this2.computeMatrix();
_this2.triggerUpdate();
if (onfinish) {
onfinish();
else if (this.type === gLite.CameraType.TRACKING) {
// 保持视距，移动视点位置
glMatrix.vec3.add(this.focalPoint, pos, this.distanceVector);
}
};
var animate = function animate(timestamp) {
if (timeStart === undefined) {
timeStart = timestamp;
this.triggerUpdate();
return this;
};
AdvancedCamera.prototype.cancelLandmarkAnimation = function () {
if (this.landmarkAnimationID !== undefined) {
this.canvas.cancelAnimationFrame(this.landmarkAnimationID);
}
var elapsed = timestamp - timeStart;
if (elapsed > duration) {
endAnimation();
return;
};
AdvancedCamera.prototype.createLandmark = function (name, params) {
var _a, _b, _c, _d;
if (params === void 0) { params = {}; }
var _e = params.position, position = _e === void 0 ? this.position : _e, _f = params.focalPoint, focalPoint = _f === void 0 ? this.focalPoint : _f, roll = params.roll, zoom = params.zoom;
var camera = new gLite.runtime.CameraContribution();
camera.setType(this.type, undefined);
camera.setPosition(position[0], (_a = position[1]) !== null && _a !== void 0 ? _a : this.position[1], (_b = position[2]) !== null && _b !== void 0 ? _b : this.position[2]);
camera.setFocalPoint(focalPoint[0], (_c = focalPoint[1]) !== null && _c !== void 0 ? _c : this.focalPoint[1], (_d = focalPoint[2]) !== null && _d !== void 0 ? _d : this.focalPoint[2]);
camera.setRoll(roll !== null && roll !== void 0 ? roll : this.roll);
camera.setZoom(zoom !== null && zoom !== void 0 ? zoom : this.zoom);
var landmark = {
name: name,
matrix: glMatrix.mat4.clone(camera.getWorldTransform()),
right: glMatrix.vec3.clone(camera.right),
up: glMatrix.vec3.clone(camera.up),
forward: glMatrix.vec3.clone(camera.forward),
position: glMatrix.vec3.clone(camera.getPosition()),
focalPoint: glMatrix.vec3.clone(camera.getFocalPoint()),
distanceVector: glMatrix.vec3.clone(camera.getDistanceVector()),
distance: camera.getDistance(),
dollyingStep: camera.getDollyingStep(),
azimuth: camera.getAzimuth(),
elevation: camera.getElevation(),
roll: camera.getRoll(),
relAzimuth: camera.relAzimuth,
relElevation: camera.relElevation,
relRoll: camera.relRoll,
zoom: camera.getZoom(),
};
this.landmarks.push(landmark);
return landmark;
};
AdvancedCamera.prototype.gotoLandmark = function (name, options) {
var _this = this;
if (options === void 0) { options = {}; }
var landmark = util.isString(name)
? this.landmarks.find(function (l) { return l.name === name; })
: name;
if (landmark) {
var _a = util.isNumber(options) ? { duration: options } : options, _b = _a.easing, easing = _b === void 0 ? 'linear' : _b, _c = _a.duration, duration_1 = _c === void 0 ? 100 : _c, _d = _a.easingFunction, easingFunction = _d === void 0 ? undefined : _d, _e = _a.onfinish, onfinish_1 = _e === void 0 ? undefined : _e;
var epsilon_1 = 0.01;
if (duration_1 === 0) {
this.syncFromLandmark(landmark);
if (onfinish_1) {
onfinish_1();
}
return;
}
// cancel ongoing animation
this.cancelLandmarkAnimation();
var destPosition_1 = landmark.position;
var destFocalPoint_1 = landmark.focalPoint;
var destZoom_1 = landmark.zoom;
var destRoll_1 = landmark.roll;
var easingFunc_1 = easingFunction || gLite.runtime.EasingFunction(easing);
var timeStart_1;
var endAnimation_1 = function () {
_this.setFocalPoint(destFocalPoint_1);
_this.setPosition(destPosition_1);
_this.setRoll(destRoll_1);
_this.setZoom(destZoom_1);
_this.computeMatrix();
_this.triggerUpdate();
if (onfinish_1) {
onfinish_1();
}
};
var animate_1 = function (timestamp) {
if (timeStart_1 === undefined) {
timeStart_1 = timestamp;
}
var elapsed = timestamp - timeStart_1;
if (elapsed > duration_1) {
endAnimation_1();
return;
}
// use the same ease function in animation system
var t = easingFunc_1(elapsed / duration_1);
var interFocalPoint = glMatrix.vec3.create();
var interPosition = glMatrix.vec3.create();
var interZoom = 1;
var interRoll = 0;
glMatrix.vec3.lerp(interFocalPoint, _this.focalPoint, destFocalPoint_1, t);
glMatrix.vec3.lerp(interPosition, _this.position, destPosition_1, t);
interRoll = _this.roll * (1 - t) + destRoll_1 * t;
interZoom = _this.zoom * (1 - t) + destZoom_1 * t;
_this.setFocalPoint(interFocalPoint);
_this.setPosition(interPosition);
_this.setRoll(interRoll);
_this.setZoom(interZoom);
var dist = glMatrix.vec3.dist(interFocalPoint, destFocalPoint_1) +
glMatrix.vec3.dist(interPosition, destPosition_1);
if (dist <= epsilon_1 && destZoom_1 == undefined && destRoll_1 == undefined) {
endAnimation_1();
return;
}
_this.computeMatrix();
_this.triggerUpdate();
if (elapsed < duration_1) {
_this.landmarkAnimationID = _this.canvas.requestAnimationFrame(animate_1);
}
};
this.canvas.requestAnimationFrame(animate_1);
}
// use the same ease function in animation system
var t = easingFunc(elapsed / duration);
var interFocalPoint = glMatrix.vec3.create();
var interPosition = glMatrix.vec3.create();
var interZoom = 1;
var interRoll = 0;
glMatrix.vec3.lerp(interFocalPoint, _this2.focalPoint, destFocalPoint, t);
glMatrix.vec3.lerp(interPosition, _this2.position, destPosition, t);
interRoll = _this2.roll * (1 - t) + destRoll * t;
interZoom = _this2.zoom * (1 - t) + destZoom * t;
_this2.setFocalPoint(interFocalPoint);
_this2.setPosition(interPosition);
_this2.setRoll(interRoll);
_this2.setZoom(interZoom);
var dist = glMatrix.vec3.dist(interFocalPoint, destFocalPoint) + glMatrix.vec3.dist(interPosition, destPosition);
if (dist <= epsilon && destZoom == undefined && destRoll == undefined) {
endAnimation();
return;
}
_this2.computeMatrix();
_this2.triggerUpdate();
if (elapsed < duration) {
_this2.landmarkAnimationID = _this2.canvas.requestAnimationFrame(animate);
}
};
this.canvas.requestAnimationFrame(animate);
}
};
_proto.syncFromLandmark = function syncFromLandmark(landmark) {
this.matrix = glMatrix.mat4.copy(this.matrix, landmark.matrix);
this.right = glMatrix.vec3.copy(this.right, landmark.right);
this.up = glMatrix.vec3.copy(this.up, landmark.up);
this.forward = glMatrix.vec3.copy(this.forward, landmark.forward);
this.position = glMatrix.vec3.copy(this.position, landmark.position);
this.focalPoint = glMatrix.vec3.copy(this.focalPoint, landmark.focalPoint);
this.distanceVector = glMatrix.vec3.copy(this.distanceVector, landmark.distanceVector);
this.azimuth = landmark.azimuth;
this.elevation = landmark.elevation;
this.roll = landmark.roll;
this.relAzimuth = landmark.relAzimuth;
this.relElevation = landmark.relElevation;
this.relRoll = landmark.relRoll;
this.dollyingStep = landmark.dollyingStep;
this.distance = landmark.distance;
this.zoom = landmark.zoom;
};
return AdvancedCamera;
}(gLite.Camera);
};
AdvancedCamera.prototype.syncFromLandmark = function (landmark) {
this.matrix = glMatrix.mat4.copy(this.matrix, landmark.matrix);
this.right = glMatrix.vec3.copy(this.right, landmark.right);
this.up = glMatrix.vec3.copy(this.up, landmark.up);
this.forward = glMatrix.vec3.copy(this.forward, landmark.forward);
this.position = glMatrix.vec3.copy(this.position, landmark.position);
this.focalPoint = glMatrix.vec3.copy(this.focalPoint, landmark.focalPoint);
this.distanceVector = glMatrix.vec3.copy(this.distanceVector, landmark.distanceVector);
this.azimuth = landmark.azimuth;
this.elevation = landmark.elevation;
this.roll = landmark.roll;
this.relAzimuth = landmark.relAzimuth;
this.relElevation = landmark.relElevation;
this.relRoll = landmark.relRoll;
this.dollyingStep = landmark.dollyingStep;
this.distance = landmark.distance;
this.zoom = landmark.zoom;
};
return AdvancedCamera;
}(gLite.Camera));

@@ -268,1 +255,2 @@ gLite.runtime.CameraContribution = AdvancedCamera;

exports.AdvancedCamera = AdvancedCamera;
//# sourceMappingURL=index.js.map

25

package.json
{
"name": "@antv/g-camera-api",
"version": "1.0.40",
"version": "1.1.0-alpha.1",
"description": "A simple implementation of Camera API.",

@@ -16,3 +16,4 @@ "keywords": [

"type": "git",
"url": "git+https://github.com/antvis/g.git"
"url": "git+https://github.com/antvis/g.git",
"directory": "packages/g-camera-api"
},

@@ -22,2 +23,7 @@ "license": "MIT",

"sideEffects": true,
"exports": {
"types": "./dist/index.d.ts",
"import": "./dist/index.esm.js",
"default": "./dist/index.js"
},
"main": "dist/index.js",

@@ -34,15 +40,16 @@ "unpkg": "dist/index.umd.min.js",

"scripts": {
"sync": "tnpm sync"
"build": "npm run clean && rollup -c",
"clean": "rimraf dist",
"sync": "tnpm sync",
"watch": "rollup -c -w"
},
"dependencies": {
"@antv/g-lite": "workspace:*",
"@antv/util": "^3.3.1",
"gl-matrix": "^3.1.0"
"gl-matrix": "^3.3.0",
"tslib": "^2.5.3"
},
"peerDependencies": {
"@antv/g-lite": "^1.0.0"
},
"publishConfig": {
"access": "public"
},
"gitHead": "53932c66ed9f2cbc28993e1e359c8df27703fc52"
}
}
dist/AdvancedCamera.d.ts.map
dist/index.d.ts.map
dist/index.umd.js
dist/index.umd.min.js

Sorry, the diff of this file is too big to display

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc