gradient-linear-two-point.js

total 0
used 0
limit 0
/* title: Radial Gradient (2 Points) category: gradient files: ../point_src/core/head.js ../point_src/pointpen.js ../point_src/pointdraw.js ../point_src/extras.js ../point_src/math.js ../point_src/point-content.js ../point_src/stage.js ../point_src/point.js ../point_src/distances.js ../point_src/pointlist.js ../point_src/events.js ../point_src/functions/clamp.js ../point_src/functions/within.js ../point_src/functions/rel.js ../point_src/random.js ../point_src/dragging.js ../point_src/setunset.js ../point_src/stroke.js ../point_src/automouse.js ../point_src/gradient.js */ class MainStage extends Stage { canvas='playspace' mounted(){ let c = this.center c.radius = 200 this.point = c.copy() this.innerPoint = c.copy().update({radius: 20, color:"hsl(299deg 62% 44%)"}) this.outerPoint = c.copy().update({radius: 20, color: "hsl(244deg 71% 56%)"}) // dark this.innerPoint.update({x:rel(-250), y:rel(-200)}) this.outerPoint.update({x:rel(200), y:rel(250)}) this.g = (new Gradient).linear(this.innerPoint, this.outerPoint) this.dragging.add( this.innerPoint, this.outerPoint, this.point) this.g.addStops({ 0: this.innerPoint, 1: this.outerPoint }) } draw(ctx){ this.clear(ctx) this.g.linear() // refresh hack. let grad = this.g.getObject(ctx) this.point.pen.fill(ctx, grad) // this.point.pen.circle(ctx, undefined, '#000', 3) // this.point0.pen.line(ctx, this.point1, '#111111', 2) this.innerPoint.pen.fill(ctx, 'white', 2) this.innerPoint.pen.circle(ctx, undefined, 'white', 1) this.outerPoint.pen.circle(ctx, undefined, '#DDD', 1) } } ;stage = MainStage.go();
Run
Meta Data
title Radial Gradient (2 Points)
imports ()
files ('../point_src/core/head.js', '../point_src/pointpen.js', '../point_src/pointdraw.js', '../point_src/extras.js', '../point_src/math.js', '../point_src/point-content.js', '../point_src/stage.js', '../point_src/point.js', '../point_src/distances.js', '../point_src/pointlist.js', '../point_src/events.js', '../point_src/functions/clamp.js', '../point_src/functions/within.js', '../point_src/functions/rel.js', '../point_src/random.js', '../point_src/dragging.js', '../point_src/setunset.js', '../point_src/stroke.js', '../point_src/automouse.js', '../point_src/gradient.js')
unused_keys ()
unknown_keys ('category',)
category ['gradient']
filepath_exists True
path gradient-linear-two-point.js
filepath gradient-linear-two-point.js
clean_files ('../point_src/core/head.js', '../point_src/pointpen.js', '../point_src/pointdraw.js', '../point_src/extras.js', '../point_src/math.js', '../point_src/compass.js', '../point_src/center.js', '../point_src/point-content.js', '../point_src/stage-resize.js', '../point_src/functions/resolve.js', '../point_src/stage.js', '../point_src/relative-xy.js', '../point_src/pointcast.js', '../point_src/point.js', '../point_src/distances.js', '../point_src/pointlistdraw.js', '../point_src/pointlistgradient.js', '../point_src/pointlistshape.js', '../point_src/pointlistgenerator.js', '../point_src/unpack.js', '../point_src/pointlist.js', '../point_src/events.js', '../point_src/functions/clamp.js', '../point_src/functions/within.js', '../point_src/functions/rel.js', '../point_src/random.js', '../point_src/protractor.js', '../point_src/text/beta.js', '../point_src/dragging.js', '../point_src/setunset.js', '../point_src/stroke.js', '../point_src/automouse.js', '../point_src/gradient.js')
markdown {'html': '', 'content': 'title: Radial Gradient (2 Points)\ncategory: gradient\nfiles:\n ../point_src/core/head.js\n ../point_src/pointpen.js\n ../point_src/pointdraw.js\n ../point_src/extras.js\n ../point_src/math.js\n ../point_src/point-content.js\n ../point_src/stage.js\n ../point_src/point.js\n ../point_src/distances.js\n ../point_src/pointlist.js\n ../point_src/events.js\n ../point_src/functions/clamp.js\n ../point_src/functions/within.js\n ../point_src/functions/rel.js\n ../point_src/random.js\n ../point_src/dragging.js\n ../point_src/setunset.js\n ../point_src/stroke.js\n ../point_src/automouse.js\n ../point_src/gradient.js'}