@deck.gl/experimental-layers
Version:
Experimental layers for deck.gl
240 lines (216 loc) • 9.22 kB
JavaScript
function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _get(target, property, receiver) { if (typeof Reflect !== "undefined" && Reflect.get) { _get = Reflect.get; } else { _get = function _get(target, property, receiver) { var base = _superPropBase(target, property); if (!base) return; var desc = Object.getOwnPropertyDescriptor(base, property); if (desc.get) { return desc.get.call(receiver); } return desc.value; }; } return _get(target, property, receiver || target); }
function _superPropBase(object, property) { while (!Object.prototype.hasOwnProperty.call(object, property)) { object = _getPrototypeOf(object); if (object === null) break; } return object; }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
// Copyright (c) 2015 - 2017 Uber Technologies, Inc.
//
// Permission is hereby granted, free of charge, to any person obtaining a copy
// of this software and associated documentation files (the "Software"), to deal
// in the Software without restriction, including without limitation the rights
// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
// copies of the Software, and to permit persons to whom the Software is
// furnished to do so, subject to the following conditions:
//
// The above copyright notice and this permission notice shall be included in
// all copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
// THE SOFTWARE.
import { Layer } from '@deck.gl/core';
import GL from 'luma.gl/constants';
import { Model, Geometry, fp64 } from 'luma.gl';
var fp64LowPart = fp64.fp64LowPart;
import vs from './bezier-curve-layer-vertex.glsl';
import fs from './bezier-curve-layer-fragment.glsl';
var NUM_SEGMENTS = 40;
var DEFAULT_COLOR = [0, 0, 0, 255];
var defaultProps = {
strokeWidth: {
type: 'number',
min: 0,
value: 1
},
fp64: false,
getSourcePosition: {
type: 'accessor',
value: function value(x) {
return x.sourcePosition;
}
},
getTargetPosition: {
type: 'accessor',
value: function value(x) {
return x.targetPosition;
}
},
getControlPoint: {
type: 'accessor',
value: function value(x) {
return x.controlPoint;
}
},
getColor: {
type: 'accessor',
value: DEFAULT_COLOR
}
};
var BezierCurveLayer =
/*#__PURE__*/
function (_Layer) {
_inherits(BezierCurveLayer, _Layer);
function BezierCurveLayer() {
_classCallCheck(this, BezierCurveLayer);
return _possibleConstructorReturn(this, _getPrototypeOf(BezierCurveLayer).apply(this, arguments));
}
_createClass(BezierCurveLayer, [{
key: "getShaders",
value: function getShaders() {
return {
vs: vs,
fs: fs,
modules: ['picking']
};
}
}, {
key: "initializeState",
value: function initializeState() {
var attributeManager = this.state.attributeManager;
/* eslint-disable max-len */
attributeManager.addInstanced({
instanceSourcePositions: {
size: 3,
transition: true,
accessor: 'getSourcePosition'
},
instanceTargetPositions: {
size: 3,
transition: true,
accessor: 'getTargetPosition'
},
instanceControlPoints: {
size: 3,
transition: false,
accessor: 'getControlPoint'
},
instanceColors: {
size: 4,
type: GL.UNSIGNED_BYTE,
transition: true,
accessor: 'getColor',
defaultValue: [0, 0, 0, 255]
}
});
/* eslint-enable max-len */
}
}, {
key: "updateAttribute",
value: function updateAttribute(_ref) {
var props = _ref.props,
oldProps = _ref.oldProps,
changeFlags = _ref.changeFlags;
if (props.fp64 !== oldProps.fp64) {
var attributeManager = this.state.attributeManager;
attributeManager.invalidateAll();
}
}
}, {
key: "updateState",
value: function updateState(_ref2) {
var props = _ref2.props,
oldProps = _ref2.oldProps,
changeFlags = _ref2.changeFlags;
_get(_getPrototypeOf(BezierCurveLayer.prototype), "updateState", this).call(this, {
props: props,
oldProps: oldProps,
changeFlags: changeFlags
});
if (props.fp64 !== oldProps.fp64) {
var gl = this.context.gl;
this.setState({
model: this._getModel(gl)
});
}
this.updateAttribute({
props: props,
oldProps: oldProps,
changeFlags: changeFlags
});
}
}, {
key: "draw",
value: function draw(_ref3) {
var uniforms = _ref3.uniforms;
var strokeWidth = this.props.strokeWidth;
this.state.model.render(Object.assign({}, uniforms, {
strokeWidth: strokeWidth
}));
}
}, {
key: "_getModel",
value: function _getModel(gl) {
/*
* (0, -1)-------------_(1, -1)
* | _,-" |
* o _,-" o
* | _,-" |
* (0, 1)"-------------(1, 1)
*/
var positions = [];
for (var i = 0; i <= NUM_SEGMENTS; i++) {
positions = positions.concat([i, -1, 0, i, 1, 0]);
}
var model = new Model(gl, Object.assign({}, this.getShaders(), {
id: this.props.id,
geometry: new Geometry({
drawMode: GL.TRIANGLE_STRIP,
attributes: {
positions: new Float32Array(positions)
}
}),
isInstanced: true,
shaderCache: this.context.shaderCache
}));
model.setUniforms({
numSegments: NUM_SEGMENTS
});
return model;
}
}, {
key: "calculateInstanceSourceTargetPositions64xyLow",
value: function calculateInstanceSourceTargetPositions64xyLow(attribute) {
var _this$props = this.props,
data = _this$props.data,
getSourcePosition = _this$props.getSourcePosition,
getTargetPosition = _this$props.getTargetPosition;
var value = attribute.value,
size = attribute.size;
var i = 0;
data.forEach(function (object) {
var sourcePosition = getSourcePosition(object);
var targetPosition = getTargetPosition(object);
value[i + 0] = fp64LowPart(sourcePosition[0]);
value[i + 1] = fp64LowPart(sourcePosition[1]);
value[i + 2] = fp64LowPart(targetPosition[0]);
value[i + 3] = fp64LowPart(targetPosition[1]);
i += size;
});
}
}]);
return BezierCurveLayer;
}(Layer);
export { BezierCurveLayer as default };
BezierCurveLayer.layerName = 'BezierCurveLayer';
BezierCurveLayer.defaultProps = defaultProps;
//# sourceMappingURL=bezier-curve-layer.js.map