Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
componentDidMount(){
paper.setup(this.refCanvas);
this.project = paper.View._viewsById[this.refCanvas.id]._project;
this.view = paper.View._viewsById[this.refCanvas.id];
var { font, message, category, screenWidth, backgroundMode, size, fontSize, letterSpacing, baseline } = this.props;
// console.log (fontSize + "," + baseline);
this.createGlyphPath(font, message, size, backgroundMode, fontSize, letterSpacing, baseline, screenWidth, category);
this.project.activate();
this.view.draw();
}
componentDidMount() {
// set up paperjs on the window
this.canvas = document.getElementById('paperCanvas');
paper.setup(this.canvas);
}
export function initializeForceLayout(elem = "#canvas", data = null) {
// Setup canvas
const canvas: HTMLCanvasElement = document.querySelector(elem) as HTMLCanvasElement;
setup(canvas);
// Svg symbol
initSvg(new Raster());
// Init simulation
let layout = ForceLayout.fromJSON(data);
view.onFrame = (ev) => layout.update(Math.min(ev.delta, 0.032));
}
function init (options) {
options = u.defaults(options || {}, DEFAULTS);
paper._genart = {
options: options,
canvas: options.canvas || new Canvas(options.width, options.height),
};
paper._genart.ctx = paper._genart.canvas.getContext('2d');
paper = u.extend(paper, Genart);
paper.setup(paper._genart.canvas);
paper.setBackgroundColor(options.backgroundColor);
// extend paper's Item prototype with useful functionality
paper.Item.prototype.tile = function(fn) {
paper.tile(this, fn);
};
paper.Item.prototype.nthChild = function(n, fn) {
if (!this.ncb) {
this.ncb = {};
}
draw = (canvas) => {
paper.setup(canvas);
let { width, height } = canvas.getBoundingClientRect();
let center = new paper.Point(width / 2, height / 2);
let radius = this.props.radius || height / 2 - 20;
let bgcircle = new paper.Path.Circle(center, radius)
bgcircle.strokeWidth = 2;
bgcircle.strokeColor = Colors.blue_light;
bgcircle.fillColor = Colors.blue_lightest;
let circleSize = 5;
let startPos = new paper.Point(center.x, 15 + circleSize);
var line = new paper.Path.Line(center, startPos);
line.strokeColor = Colors.blue_base;
componentDidMount(){
paper.setup(this.refCanvas);
this.project = paper.View._viewsById[this.refCanvas.id]._project;
this.view = paper.View._viewsById[this.refCanvas.id];
var { font, message, screenHeight, screenWidth, animationIdx, backgroundMode, containerHeight, size, fontSize, letterSpacing, baseline } = this.props;
this.createGlyphPath(font, message, screenWidth, screenHeight, backgroundMode, containerHeight, size, fontSize, letterSpacing, baseline);
this.attachAnimation(this.props);
this.project.activate();
this.view.draw();
}
draw = (canvas) => {
paper.setup(canvas);
let colorLines = Colors.neutral_light;
let { width, height } = canvas.getBoundingClientRect();
let center = new paper.Point(width / 2, height / 2);
var pathY = new paper.Path();
pathY.strokeColor = Colors.neutral_light;
var start = new paper.Point(center.x, 0);
pathY.moveTo(start);
pathY.lineTo(start.add([0, height]));
var pathX = new paper.Path();
pathX.strokeColor = Colors.neutral_light;
var start = new paper.Point(0, center.y);
pathX.moveTo(start);
pathX.lineTo(start.add([width, 0]));
export function setupPaperJs(canvas: HTMLCanvasElement) {
if (isPaperJsSetup) {
return;
}
paper.setup(canvas);
paper.settings.handleSize = 8;
const defaultLayer = new paper.Layer();
defaultLayer.name = 'Default layer';
defaultLayer.data.isDefaultLayer = true;
const guideLayer = new paper.Layer();
guideLayer.name = 'Guide layer';
guideLayer.data.isGuideLayer = true;
guideLayer.bringToFront();
defaultLayer.activate();
isPaperJsSetup = true;
}
componentDidMount(){
paper.setup(this.refCanvas);
this.project = paper.View._viewsById[this.refCanvas.id]._project;
this.view = paper.View._viewsById[this.refCanvas.id];
var { letterSpacing, baseline, fontSize, font, message, screenHeight, screenWidth, animationScriptIdx, backgroundMode, size, containerHeight } = this.props;
this.createGlyphPath(font, message, size, screenWidth, screenHeight, backgroundMode, containerHeight, fontSize, letterSpacing, baseline);
this.attachAnimation(this.props);
this.project.activate();
this.view.draw();
}
draw = (canvas) => {
paper.setup(canvas);
let colorLines = 'rgba(0,0,0,0.1)';
let { width, height } = canvas.getBoundingClientRect();
let center = new paper.Point(width / 2, height / 2);
var myPath = new paper.Path({ strokeWidth: 2, strokeCap: 'round' });
myPath.strokeColor = Colors.blue_base;
myPath.fillColor = Colors.blue_light;
let points = this.props.points || [];
let step = (width - 10) / (points.length - 1);
let circles = [];
for (var i = 0; i < points.length; i++) {
let point = new paper.Point(5 + i * step, height - points[i]);
myPath.add(point);