@tsparticles/shape-polygon 4.0.0-alpha.8 → 4.0.0-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/685.min.js ADDED
@@ -0,0 +1 @@
1
+ "use strict";(this.webpackChunk_tsparticles_shape_polygon=this.webpackChunk_tsparticles_shape_polygon||[]).push([[685],{228(e,t,n){n.d(t,{L:()=>r});var a=n(303);let o=new Map;class r{draw(e){let{particle:t,radius:n}=e;!function(e,t){let{context:n,radius:r}=e,s=function(e){let t=o.get(e);if(t)return t;let n=a.doublePI/e,r=(-Math.PI+(e%a.double?0:n))*a.half,s=[];for(let t=0;t<e;t++){let e=r+t*n;s[t]={x:Math.cos(e),y:Math.sin(e)}}return o.set(e,s),s}(t.count.numerator/t.count.denominator);n.beginPath();for(let e=0;e<s.length;e++){let t=s[e];if(!t)continue;let a=t.x*r,o=t.y*r;e?n.lineTo(a,o):n.moveTo(a,o)}n.closePath()}(e,this.getSidesData(t,n))}getSidesCount(e){let t=e.shapeData;return Math.round((0,a.getRangeValue)(t?.sides??5))}}},685(e,t,n){n.d(t,{TriangleDrawer:()=>o});var a=n(228);class o extends a.L{getSidesCount(){return 3}getSidesData(e,t){return{count:{denominator:1,numerator:3},length:2.66*t/1}}}}}]);
package/833.min.js ADDED
@@ -0,0 +1 @@
1
+ "use strict";(this.webpackChunk_tsparticles_shape_polygon=this.webpackChunk_tsparticles_shape_polygon||[]).push([[833],{833(t,e,n){n.d(e,{PolygonDrawer:()=>o});var a=n(228);class o extends a.L{getSidesData(t,e){let{sides:n}=t;return{count:{denominator:1,numerator:n},length:2.66*e/(n/3)}}}},228(t,e,n){n.d(e,{L:()=>l});var a=n(303);let o=new Map;class l{draw(t){let{particle:e,radius:n}=t;!function(t,e){let{context:n,radius:l}=t,s=function(t){let e=o.get(t);if(e)return e;let n=a.doublePI/t,l=(-Math.PI+(t%a.double?0:n))*a.half,s=[];for(let e=0;e<t;e++){let t=l+e*n;s[e]={x:Math.cos(t),y:Math.sin(t)}}return o.set(t,s),s}(e.count.numerator/e.count.denominator);n.beginPath();for(let t=0;t<s.length;t++){let e=s[t];if(!e)continue;let a=e.x*l,o=e.y*l;t?n.lineTo(a,o):n.moveTo(a,o)}n.closePath()}(t,this.getSidesData(e,n))}getSidesCount(t){let e=t.shapeData;return Math.round((0,a.getRangeValue)(e?.sides??5))}}}}]);
@@ -1,18 +1,8 @@
1
1
  import { PolygonDrawerBase } from "./PolygonDrawerBase.js";
2
- const sidesCenterFactor = 3.5, yFactor = 2.66, sidesFactor = 3;
2
+ const yFactor = 2.66, sidesFactor = 3;
3
3
  export class PolygonDrawer extends PolygonDrawerBase {
4
- constructor() {
5
- super(...arguments);
6
- this.validTypes = ["polygon"];
7
- }
8
- getCenter(particle, radius) {
9
- return {
10
- x: -radius / (particle.sides / sidesCenterFactor),
11
- y: -radius / (yFactor / sidesCenterFactor),
12
- };
13
- }
14
4
  getSidesData(particle, radius) {
15
- const sides = particle.sides;
5
+ const { sides } = particle;
16
6
  return {
17
7
  count: {
18
8
  denominator: 1,
@@ -1,10 +1,10 @@
1
- import { getRangeValue, } from "@tsparticles/engine";
1
+ import { getRangeValue } from "@tsparticles/engine";
2
2
  import { drawPolygon } from "./Utils.js";
3
3
  const defaultSides = 5;
4
4
  export class PolygonDrawerBase {
5
5
  draw(data) {
6
- const { particle, radius } = data, start = this.getCenter(particle, radius), side = this.getSidesData(particle, radius);
7
- drawPolygon(data, start, side);
6
+ const { particle, radius } = data, side = this.getSidesData(particle, radius);
7
+ drawPolygon(data, side);
8
8
  }
9
9
  getSidesCount(particle) {
10
10
  const polygon = particle.shapeData;
@@ -1,28 +1,16 @@
1
- import { double } from "@tsparticles/engine";
2
1
  import { PolygonDrawerBase } from "./PolygonDrawerBase.js";
3
- const yFactor = 1.66, sides = 3;
2
+ const sides = 3, yFactor = 2.66, sidesFactor = 3;
4
3
  export class TriangleDrawer extends PolygonDrawerBase {
5
- constructor() {
6
- super(...arguments);
7
- this.validTypes = ["triangle"];
8
- }
9
- getCenter(_particle, radius) {
10
- return {
11
- x: -radius,
12
- y: radius / yFactor,
13
- };
14
- }
15
4
  getSidesCount() {
16
5
  return sides;
17
6
  }
18
7
  getSidesData(_particle, radius) {
19
- const diameter = radius * double;
20
8
  return {
21
9
  count: {
22
- denominator: 2,
23
- numerator: 3,
10
+ denominator: 1,
11
+ numerator: sides,
24
12
  },
25
- length: diameter,
13
+ length: (radius * yFactor) / (sides / sidesFactor),
26
14
  };
27
15
  }
28
16
  }
package/browser/Utils.js CHANGED
@@ -1,13 +1,36 @@
1
- import { degToRad } from "@tsparticles/engine";
2
- const piDeg = 180, origin = { x: 0, y: 0 }, sidesOffset = 2;
3
- export function drawPolygon(data, start, side) {
4
- const { context } = data, sideCount = side.count.numerator * side.count.denominator, decimalSides = side.count.numerator / side.count.denominator, interiorAngleDegrees = (piDeg * (decimalSides - sidesOffset)) / decimalSides, interiorAngle = Math.PI - degToRad(interiorAngleDegrees);
1
+ import { double, doublePI, half } from "@tsparticles/engine";
2
+ const polygonCache = new Map(), noOffset = 0;
3
+ function getUnitPolygon(sides) {
4
+ const cached = polygonCache.get(sides);
5
+ if (cached) {
6
+ return cached;
7
+ }
8
+ const step = doublePI / sides, isOdd = !!(sides % double), baseAngle = (-Math.PI + (isOdd ? noOffset : step)) * half, verts = [];
9
+ for (let i = 0; i < sides; i++) {
10
+ const angle = baseAngle + i * step;
11
+ verts[i] = {
12
+ x: Math.cos(angle),
13
+ y: Math.sin(angle),
14
+ };
15
+ }
16
+ polygonCache.set(sides, verts);
17
+ return verts;
18
+ }
19
+ export function drawPolygon(data, side) {
20
+ const { context, radius } = data, sides = side.count.numerator / side.count.denominator, verts = getUnitPolygon(sides);
5
21
  context.beginPath();
6
- context.translate(start.x, start.y);
7
- context.moveTo(origin.x, origin.y);
8
- for (let i = 0; i < sideCount; i++) {
9
- context.lineTo(side.length, origin.y);
10
- context.translate(side.length, origin.y);
11
- context.rotate(interiorAngle);
22
+ for (let i = 0; i < verts.length; i++) {
23
+ const vert = verts[i];
24
+ if (!vert) {
25
+ continue;
26
+ }
27
+ const x = vert.x * radius, y = vert.y * radius;
28
+ if (i) {
29
+ context.lineTo(x, y);
30
+ }
31
+ else {
32
+ context.moveTo(x, y);
33
+ }
12
34
  }
35
+ context.closePath();
13
36
  }
package/browser/index.js CHANGED
@@ -1,21 +1,25 @@
1
1
  export async function loadGenericPolygonShape(engine) {
2
- engine.checkVersion("4.0.0-alpha.8");
3
- await engine.register(async (e) => {
4
- const { PolygonDrawer } = await import("./PolygonDrawer.js");
5
- e.addShape(new PolygonDrawer());
2
+ engine.checkVersion("4.0.0-beta.0");
3
+ await engine.register(e => {
4
+ e.addShape(["polygon"], async () => {
5
+ const { PolygonDrawer } = await import("./PolygonDrawer.js");
6
+ return new PolygonDrawer();
7
+ });
6
8
  });
7
9
  }
8
10
  export async function loadTriangleShape(engine) {
9
- engine.checkVersion("4.0.0-alpha.8");
10
- await engine.register(async (e) => {
11
- const { TriangleDrawer } = await import("./TriangleDrawer.js");
12
- e.addShape(new TriangleDrawer());
11
+ engine.checkVersion("4.0.0-beta.0");
12
+ await engine.register(e => {
13
+ e.addShape(["triangle"], async () => {
14
+ const { TriangleDrawer } = await import("./TriangleDrawer.js");
15
+ return new TriangleDrawer();
16
+ });
13
17
  });
14
18
  }
15
19
  export async function loadPolygonShape(engine) {
16
- engine.checkVersion("4.0.0-alpha.8");
17
- await engine.register(async (e) => {
18
- await loadGenericPolygonShape(e);
19
- await loadTriangleShape(e);
20
- });
20
+ engine.checkVersion("4.0.0-beta.0");
21
+ await Promise.all([
22
+ loadGenericPolygonShape(engine),
23
+ loadTriangleShape(engine),
24
+ ]);
21
25
  }
@@ -1,18 +1,8 @@
1
1
  import { PolygonDrawerBase } from "./PolygonDrawerBase.js";
2
- const sidesCenterFactor = 3.5, yFactor = 2.66, sidesFactor = 3;
2
+ const yFactor = 2.66, sidesFactor = 3;
3
3
  export class PolygonDrawer extends PolygonDrawerBase {
4
- constructor() {
5
- super(...arguments);
6
- this.validTypes = ["polygon"];
7
- }
8
- getCenter(particle, radius) {
9
- return {
10
- x: -radius / (particle.sides / sidesCenterFactor),
11
- y: -radius / (yFactor / sidesCenterFactor),
12
- };
13
- }
14
4
  getSidesData(particle, radius) {
15
- const sides = particle.sides;
5
+ const { sides } = particle;
16
6
  return {
17
7
  count: {
18
8
  denominator: 1,
@@ -1,10 +1,10 @@
1
- import { getRangeValue, } from "@tsparticles/engine";
1
+ import { getRangeValue } from "@tsparticles/engine";
2
2
  import { drawPolygon } from "./Utils.js";
3
3
  const defaultSides = 5;
4
4
  export class PolygonDrawerBase {
5
5
  draw(data) {
6
- const { particle, radius } = data, start = this.getCenter(particle, radius), side = this.getSidesData(particle, radius);
7
- drawPolygon(data, start, side);
6
+ const { particle, radius } = data, side = this.getSidesData(particle, radius);
7
+ drawPolygon(data, side);
8
8
  }
9
9
  getSidesCount(particle) {
10
10
  const polygon = particle.shapeData;
@@ -1,28 +1,16 @@
1
- import { double } from "@tsparticles/engine";
2
1
  import { PolygonDrawerBase } from "./PolygonDrawerBase.js";
3
- const yFactor = 1.66, sides = 3;
2
+ const sides = 3, yFactor = 2.66, sidesFactor = 3;
4
3
  export class TriangleDrawer extends PolygonDrawerBase {
5
- constructor() {
6
- super(...arguments);
7
- this.validTypes = ["triangle"];
8
- }
9
- getCenter(_particle, radius) {
10
- return {
11
- x: -radius,
12
- y: radius / yFactor,
13
- };
14
- }
15
4
  getSidesCount() {
16
5
  return sides;
17
6
  }
18
7
  getSidesData(_particle, radius) {
19
- const diameter = radius * double;
20
8
  return {
21
9
  count: {
22
- denominator: 2,
23
- numerator: 3,
10
+ denominator: 1,
11
+ numerator: sides,
24
12
  },
25
- length: diameter,
13
+ length: (radius * yFactor) / (sides / sidesFactor),
26
14
  };
27
15
  }
28
16
  }
package/cjs/Utils.js CHANGED
@@ -1,13 +1,36 @@
1
- import { degToRad } from "@tsparticles/engine";
2
- const piDeg = 180, origin = { x: 0, y: 0 }, sidesOffset = 2;
3
- export function drawPolygon(data, start, side) {
4
- const { context } = data, sideCount = side.count.numerator * side.count.denominator, decimalSides = side.count.numerator / side.count.denominator, interiorAngleDegrees = (piDeg * (decimalSides - sidesOffset)) / decimalSides, interiorAngle = Math.PI - degToRad(interiorAngleDegrees);
1
+ import { double, doublePI, half } from "@tsparticles/engine";
2
+ const polygonCache = new Map(), noOffset = 0;
3
+ function getUnitPolygon(sides) {
4
+ const cached = polygonCache.get(sides);
5
+ if (cached) {
6
+ return cached;
7
+ }
8
+ const step = doublePI / sides, isOdd = !!(sides % double), baseAngle = (-Math.PI + (isOdd ? noOffset : step)) * half, verts = [];
9
+ for (let i = 0; i < sides; i++) {
10
+ const angle = baseAngle + i * step;
11
+ verts[i] = {
12
+ x: Math.cos(angle),
13
+ y: Math.sin(angle),
14
+ };
15
+ }
16
+ polygonCache.set(sides, verts);
17
+ return verts;
18
+ }
19
+ export function drawPolygon(data, side) {
20
+ const { context, radius } = data, sides = side.count.numerator / side.count.denominator, verts = getUnitPolygon(sides);
5
21
  context.beginPath();
6
- context.translate(start.x, start.y);
7
- context.moveTo(origin.x, origin.y);
8
- for (let i = 0; i < sideCount; i++) {
9
- context.lineTo(side.length, origin.y);
10
- context.translate(side.length, origin.y);
11
- context.rotate(interiorAngle);
22
+ for (let i = 0; i < verts.length; i++) {
23
+ const vert = verts[i];
24
+ if (!vert) {
25
+ continue;
26
+ }
27
+ const x = vert.x * radius, y = vert.y * radius;
28
+ if (i) {
29
+ context.lineTo(x, y);
30
+ }
31
+ else {
32
+ context.moveTo(x, y);
33
+ }
12
34
  }
35
+ context.closePath();
13
36
  }
package/cjs/index.js CHANGED
@@ -1,21 +1,25 @@
1
1
  export async function loadGenericPolygonShape(engine) {
2
- engine.checkVersion("4.0.0-alpha.8");
3
- await engine.register(async (e) => {
4
- const { PolygonDrawer } = await import("./PolygonDrawer.js");
5
- e.addShape(new PolygonDrawer());
2
+ engine.checkVersion("4.0.0-beta.0");
3
+ await engine.register(e => {
4
+ e.addShape(["polygon"], async () => {
5
+ const { PolygonDrawer } = await import("./PolygonDrawer.js");
6
+ return new PolygonDrawer();
7
+ });
6
8
  });
7
9
  }
8
10
  export async function loadTriangleShape(engine) {
9
- engine.checkVersion("4.0.0-alpha.8");
10
- await engine.register(async (e) => {
11
- const { TriangleDrawer } = await import("./TriangleDrawer.js");
12
- e.addShape(new TriangleDrawer());
11
+ engine.checkVersion("4.0.0-beta.0");
12
+ await engine.register(e => {
13
+ e.addShape(["triangle"], async () => {
14
+ const { TriangleDrawer } = await import("./TriangleDrawer.js");
15
+ return new TriangleDrawer();
16
+ });
13
17
  });
14
18
  }
15
19
  export async function loadPolygonShape(engine) {
16
- engine.checkVersion("4.0.0-alpha.8");
17
- await engine.register(async (e) => {
18
- await loadGenericPolygonShape(e);
19
- await loadTriangleShape(e);
20
- });
20
+ engine.checkVersion("4.0.0-beta.0");
21
+ await Promise.all([
22
+ loadGenericPolygonShape(engine),
23
+ loadTriangleShape(engine),
24
+ ]);
21
25
  }
@@ -4,7 +4,7 @@
4
4
  * Demo / Generator : https://particles.js.org/
5
5
  * GitHub : https://www.github.com/matteobruni/tsparticles
6
6
  * How to use? : Check the GitHub README
7
- * v4.0.0-alpha.8
7
+ * v4.0.0-beta.0
8
8
  */
9
9
  "use strict";
10
10
  /*
@@ -23,7 +23,7 @@
23
23
  \***************************************/
24
24
  (__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
25
25
 
26
- eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ PolygonDrawer: () => (/* binding */ PolygonDrawer)\n/* harmony export */ });\n/* harmony import */ var _PolygonDrawerBase_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./PolygonDrawerBase.js */ \"./dist/browser/PolygonDrawerBase.js\");\n\nconst sidesCenterFactor = 3.5,\n yFactor = 2.66,\n sidesFactor = 3;\nclass PolygonDrawer extends _PolygonDrawerBase_js__WEBPACK_IMPORTED_MODULE_0__.PolygonDrawerBase {\n constructor() {\n super(...arguments);\n this.validTypes = [\"polygon\"];\n }\n getCenter(particle, radius) {\n return {\n x: -radius / (particle.sides / sidesCenterFactor),\n y: -radius / (yFactor / sidesCenterFactor)\n };\n }\n getSidesData(particle, radius) {\n const sides = particle.sides;\n return {\n count: {\n denominator: 1,\n numerator: sides\n },\n length: radius * yFactor / (sides / sidesFactor)\n };\n }\n}\n\n//# sourceURL=webpack://@tsparticles/shape-polygon/./dist/browser/PolygonDrawer.js?\n}");
26
+ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ PolygonDrawer: () => (/* binding */ PolygonDrawer)\n/* harmony export */ });\n/* harmony import */ var _PolygonDrawerBase_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./PolygonDrawerBase.js */ \"./dist/browser/PolygonDrawerBase.js\");\n\nconst yFactor = 2.66, sidesFactor = 3;\nclass PolygonDrawer extends _PolygonDrawerBase_js__WEBPACK_IMPORTED_MODULE_0__.PolygonDrawerBase {\n getSidesData(particle, radius) {\n const { sides } = particle;\n return {\n count: {\n denominator: 1,\n numerator: sides\n },\n length: radius * yFactor / (sides / sidesFactor)\n };\n }\n}\n\n\n//# sourceURL=webpack://@tsparticles/shape-polygon/./dist/browser/PolygonDrawer.js?\n}");
27
27
 
28
28
  /***/ },
29
29
 
@@ -33,7 +33,7 @@ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpa
33
33
  \*******************************************/
34
34
  (__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
35
35
 
36
- eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ PolygonDrawerBase: () => (/* binding */ PolygonDrawerBase)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _Utils_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Utils.js */ \"./dist/browser/Utils.js\");\n\n\nconst defaultSides = 5;\nclass PolygonDrawerBase {\n draw(data) {\n const {\n particle,\n radius\n } = data,\n start = this.getCenter(particle, radius),\n side = this.getSidesData(particle, radius);\n (0,_Utils_js__WEBPACK_IMPORTED_MODULE_1__.drawPolygon)(data, start, side);\n }\n getSidesCount(particle) {\n const polygon = particle.shapeData;\n return Math.round((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getRangeValue)(polygon?.sides ?? defaultSides));\n }\n}\n\n//# sourceURL=webpack://@tsparticles/shape-polygon/./dist/browser/PolygonDrawerBase.js?\n}");
36
+ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ PolygonDrawerBase: () => (/* binding */ PolygonDrawerBase)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _Utils_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Utils.js */ \"./dist/browser/Utils.js\");\n\n\nconst defaultSides = 5;\nclass PolygonDrawerBase {\n draw(data) {\n const { particle, radius } = data, side = this.getSidesData(particle, radius);\n (0,_Utils_js__WEBPACK_IMPORTED_MODULE_1__.drawPolygon)(data, side);\n }\n getSidesCount(particle) {\n const polygon = particle.shapeData;\n return Math.round((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getRangeValue)(polygon?.sides ?? defaultSides));\n }\n}\n\n\n//# sourceURL=webpack://@tsparticles/shape-polygon/./dist/browser/PolygonDrawerBase.js?\n}");
37
37
 
38
38
  /***/ },
39
39
 
@@ -43,7 +43,7 @@ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpa
43
43
  \*******************************/
44
44
  (__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
45
45
 
46
- eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ drawPolygon: () => (/* binding */ drawPolygon)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n\nconst piDeg = 180,\n origin = {\n x: 0,\n y: 0\n },\n sidesOffset = 2;\nfunction drawPolygon(data, start, side) {\n const {\n context\n } = data,\n sideCount = side.count.numerator * side.count.denominator,\n decimalSides = side.count.numerator / side.count.denominator,\n interiorAngleDegrees = piDeg * (decimalSides - sidesOffset) / decimalSides,\n interiorAngle = Math.PI - (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.degToRad)(interiorAngleDegrees);\n context.beginPath();\n context.translate(start.x, start.y);\n context.moveTo(origin.x, origin.y);\n for (let i = 0; i < sideCount; i++) {\n context.lineTo(side.length, origin.y);\n context.translate(side.length, origin.y);\n context.rotate(interiorAngle);\n }\n}\n\n//# sourceURL=webpack://@tsparticles/shape-polygon/./dist/browser/Utils.js?\n}");
46
+ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ drawPolygon: () => (/* binding */ drawPolygon)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n\nconst polygonCache = new Map(), noOffset = 0;\nfunction getUnitPolygon(sides) {\n const cached = polygonCache.get(sides);\n if (cached) {\n return cached;\n }\n const step = _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.doublePI / sides, isOdd = !!(sides % _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.double), baseAngle = (-Math.PI + (isOdd ? noOffset : step)) * _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.half, verts = [];\n for(let i = 0; i < sides; i++){\n const angle = baseAngle + i * step;\n verts[i] = {\n x: Math.cos(angle),\n y: Math.sin(angle)\n };\n }\n polygonCache.set(sides, verts);\n return verts;\n}\nfunction drawPolygon(data, side) {\n const { context, radius } = data, sides = side.count.numerator / side.count.denominator, verts = getUnitPolygon(sides);\n context.beginPath();\n for(let i = 0; i < verts.length; i++){\n const vert = verts[i];\n if (!vert) {\n continue;\n }\n const x = vert.x * radius, y = vert.y * radius;\n if (i) {\n context.lineTo(x, y);\n } else {\n context.moveTo(x, y);\n }\n }\n context.closePath();\n}\n\n\n//# sourceURL=webpack://@tsparticles/shape-polygon/./dist/browser/Utils.js?\n}");
47
47
 
48
48
  /***/ }
49
49
 
@@ -4,7 +4,7 @@
4
4
  * Demo / Generator : https://particles.js.org/
5
5
  * GitHub : https://www.github.com/matteobruni/tsparticles
6
6
  * How to use? : Check the GitHub README
7
- * v4.0.0-alpha.8
7
+ * v4.0.0-beta.0
8
8
  */
9
9
  "use strict";
10
10
  /*
@@ -23,7 +23,7 @@
23
23
  \*******************************************/
24
24
  (__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
25
25
 
26
- eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ PolygonDrawerBase: () => (/* binding */ PolygonDrawerBase)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _Utils_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Utils.js */ \"./dist/browser/Utils.js\");\n\n\nconst defaultSides = 5;\nclass PolygonDrawerBase {\n draw(data) {\n const {\n particle,\n radius\n } = data,\n start = this.getCenter(particle, radius),\n side = this.getSidesData(particle, radius);\n (0,_Utils_js__WEBPACK_IMPORTED_MODULE_1__.drawPolygon)(data, start, side);\n }\n getSidesCount(particle) {\n const polygon = particle.shapeData;\n return Math.round((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getRangeValue)(polygon?.sides ?? defaultSides));\n }\n}\n\n//# sourceURL=webpack://@tsparticles/shape-polygon/./dist/browser/PolygonDrawerBase.js?\n}");
26
+ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ PolygonDrawerBase: () => (/* binding */ PolygonDrawerBase)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _Utils_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Utils.js */ \"./dist/browser/Utils.js\");\n\n\nconst defaultSides = 5;\nclass PolygonDrawerBase {\n draw(data) {\n const { particle, radius } = data, side = this.getSidesData(particle, radius);\n (0,_Utils_js__WEBPACK_IMPORTED_MODULE_1__.drawPolygon)(data, side);\n }\n getSidesCount(particle) {\n const polygon = particle.shapeData;\n return Math.round((0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.getRangeValue)(polygon?.sides ?? defaultSides));\n }\n}\n\n\n//# sourceURL=webpack://@tsparticles/shape-polygon/./dist/browser/PolygonDrawerBase.js?\n}");
27
27
 
28
28
  /***/ },
29
29
 
@@ -33,7 +33,7 @@ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpa
33
33
  \****************************************/
34
34
  (__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
35
35
 
36
- eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ TriangleDrawer: () => (/* binding */ TriangleDrawer)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n/* harmony import */ var _PolygonDrawerBase_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./PolygonDrawerBase.js */ \"./dist/browser/PolygonDrawerBase.js\");\n\n\nconst yFactor = 1.66,\n sides = 3;\nclass TriangleDrawer extends _PolygonDrawerBase_js__WEBPACK_IMPORTED_MODULE_1__.PolygonDrawerBase {\n constructor() {\n super(...arguments);\n this.validTypes = [\"triangle\"];\n }\n getCenter(_particle, radius) {\n return {\n x: -radius,\n y: radius / yFactor\n };\n }\n getSidesCount() {\n return sides;\n }\n getSidesData(_particle, radius) {\n const diameter = radius * _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.double;\n return {\n count: {\n denominator: 2,\n numerator: 3\n },\n length: diameter\n };\n }\n}\n\n//# sourceURL=webpack://@tsparticles/shape-polygon/./dist/browser/TriangleDrawer.js?\n}");
36
+ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ TriangleDrawer: () => (/* binding */ TriangleDrawer)\n/* harmony export */ });\n/* harmony import */ var _PolygonDrawerBase_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./PolygonDrawerBase.js */ \"./dist/browser/PolygonDrawerBase.js\");\n\nconst sides = 3, yFactor = 2.66, sidesFactor = 3;\nclass TriangleDrawer extends _PolygonDrawerBase_js__WEBPACK_IMPORTED_MODULE_0__.PolygonDrawerBase {\n getSidesCount() {\n return sides;\n }\n getSidesData(_particle, radius) {\n return {\n count: {\n denominator: 1,\n numerator: sides\n },\n length: radius * yFactor / (sides / sidesFactor)\n };\n }\n}\n\n\n//# sourceURL=webpack://@tsparticles/shape-polygon/./dist/browser/TriangleDrawer.js?\n}");
37
37
 
38
38
  /***/ },
39
39
 
@@ -43,7 +43,7 @@ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpa
43
43
  \*******************************/
44
44
  (__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
45
45
 
46
- eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ drawPolygon: () => (/* binding */ drawPolygon)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n\nconst piDeg = 180,\n origin = {\n x: 0,\n y: 0\n },\n sidesOffset = 2;\nfunction drawPolygon(data, start, side) {\n const {\n context\n } = data,\n sideCount = side.count.numerator * side.count.denominator,\n decimalSides = side.count.numerator / side.count.denominator,\n interiorAngleDegrees = piDeg * (decimalSides - sidesOffset) / decimalSides,\n interiorAngle = Math.PI - (0,_tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.degToRad)(interiorAngleDegrees);\n context.beginPath();\n context.translate(start.x, start.y);\n context.moveTo(origin.x, origin.y);\n for (let i = 0; i < sideCount; i++) {\n context.lineTo(side.length, origin.y);\n context.translate(side.length, origin.y);\n context.rotate(interiorAngle);\n }\n}\n\n//# sourceURL=webpack://@tsparticles/shape-polygon/./dist/browser/Utils.js?\n}");
46
+ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ drawPolygon: () => (/* binding */ drawPolygon)\n/* harmony export */ });\n/* harmony import */ var _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @tsparticles/engine */ \"@tsparticles/engine\");\n\nconst polygonCache = new Map(), noOffset = 0;\nfunction getUnitPolygon(sides) {\n const cached = polygonCache.get(sides);\n if (cached) {\n return cached;\n }\n const step = _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.doublePI / sides, isOdd = !!(sides % _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.double), baseAngle = (-Math.PI + (isOdd ? noOffset : step)) * _tsparticles_engine__WEBPACK_IMPORTED_MODULE_0__.half, verts = [];\n for(let i = 0; i < sides; i++){\n const angle = baseAngle + i * step;\n verts[i] = {\n x: Math.cos(angle),\n y: Math.sin(angle)\n };\n }\n polygonCache.set(sides, verts);\n return verts;\n}\nfunction drawPolygon(data, side) {\n const { context, radius } = data, sides = side.count.numerator / side.count.denominator, verts = getUnitPolygon(sides);\n context.beginPath();\n for(let i = 0; i < verts.length; i++){\n const vert = verts[i];\n if (!vert) {\n continue;\n }\n const x = vert.x * radius, y = vert.y * radius;\n if (i) {\n context.lineTo(x, y);\n } else {\n context.moveTo(x, y);\n }\n }\n context.closePath();\n}\n\n\n//# sourceURL=webpack://@tsparticles/shape-polygon/./dist/browser/Utils.js?\n}");
47
47
 
48
48
  /***/ }
49
49
 
@@ -1,18 +1,8 @@
1
1
  import { PolygonDrawerBase } from "./PolygonDrawerBase.js";
2
- const sidesCenterFactor = 3.5, yFactor = 2.66, sidesFactor = 3;
2
+ const yFactor = 2.66, sidesFactor = 3;
3
3
  export class PolygonDrawer extends PolygonDrawerBase {
4
- constructor() {
5
- super(...arguments);
6
- this.validTypes = ["polygon"];
7
- }
8
- getCenter(particle, radius) {
9
- return {
10
- x: -radius / (particle.sides / sidesCenterFactor),
11
- y: -radius / (yFactor / sidesCenterFactor),
12
- };
13
- }
14
4
  getSidesData(particle, radius) {
15
- const sides = particle.sides;
5
+ const { sides } = particle;
16
6
  return {
17
7
  count: {
18
8
  denominator: 1,
@@ -1,10 +1,10 @@
1
- import { getRangeValue, } from "@tsparticles/engine";
1
+ import { getRangeValue } from "@tsparticles/engine";
2
2
  import { drawPolygon } from "./Utils.js";
3
3
  const defaultSides = 5;
4
4
  export class PolygonDrawerBase {
5
5
  draw(data) {
6
- const { particle, radius } = data, start = this.getCenter(particle, radius), side = this.getSidesData(particle, radius);
7
- drawPolygon(data, start, side);
6
+ const { particle, radius } = data, side = this.getSidesData(particle, radius);
7
+ drawPolygon(data, side);
8
8
  }
9
9
  getSidesCount(particle) {
10
10
  const polygon = particle.shapeData;
@@ -1,28 +1,16 @@
1
- import { double } from "@tsparticles/engine";
2
1
  import { PolygonDrawerBase } from "./PolygonDrawerBase.js";
3
- const yFactor = 1.66, sides = 3;
2
+ const sides = 3, yFactor = 2.66, sidesFactor = 3;
4
3
  export class TriangleDrawer extends PolygonDrawerBase {
5
- constructor() {
6
- super(...arguments);
7
- this.validTypes = ["triangle"];
8
- }
9
- getCenter(_particle, radius) {
10
- return {
11
- x: -radius,
12
- y: radius / yFactor,
13
- };
14
- }
15
4
  getSidesCount() {
16
5
  return sides;
17
6
  }
18
7
  getSidesData(_particle, radius) {
19
- const diameter = radius * double;
20
8
  return {
21
9
  count: {
22
- denominator: 2,
23
- numerator: 3,
10
+ denominator: 1,
11
+ numerator: sides,
24
12
  },
25
- length: diameter,
13
+ length: (radius * yFactor) / (sides / sidesFactor),
26
14
  };
27
15
  }
28
16
  }
package/esm/Utils.js CHANGED
@@ -1,13 +1,36 @@
1
- import { degToRad } from "@tsparticles/engine";
2
- const piDeg = 180, origin = { x: 0, y: 0 }, sidesOffset = 2;
3
- export function drawPolygon(data, start, side) {
4
- const { context } = data, sideCount = side.count.numerator * side.count.denominator, decimalSides = side.count.numerator / side.count.denominator, interiorAngleDegrees = (piDeg * (decimalSides - sidesOffset)) / decimalSides, interiorAngle = Math.PI - degToRad(interiorAngleDegrees);
1
+ import { double, doublePI, half } from "@tsparticles/engine";
2
+ const polygonCache = new Map(), noOffset = 0;
3
+ function getUnitPolygon(sides) {
4
+ const cached = polygonCache.get(sides);
5
+ if (cached) {
6
+ return cached;
7
+ }
8
+ const step = doublePI / sides, isOdd = !!(sides % double), baseAngle = (-Math.PI + (isOdd ? noOffset : step)) * half, verts = [];
9
+ for (let i = 0; i < sides; i++) {
10
+ const angle = baseAngle + i * step;
11
+ verts[i] = {
12
+ x: Math.cos(angle),
13
+ y: Math.sin(angle),
14
+ };
15
+ }
16
+ polygonCache.set(sides, verts);
17
+ return verts;
18
+ }
19
+ export function drawPolygon(data, side) {
20
+ const { context, radius } = data, sides = side.count.numerator / side.count.denominator, verts = getUnitPolygon(sides);
5
21
  context.beginPath();
6
- context.translate(start.x, start.y);
7
- context.moveTo(origin.x, origin.y);
8
- for (let i = 0; i < sideCount; i++) {
9
- context.lineTo(side.length, origin.y);
10
- context.translate(side.length, origin.y);
11
- context.rotate(interiorAngle);
22
+ for (let i = 0; i < verts.length; i++) {
23
+ const vert = verts[i];
24
+ if (!vert) {
25
+ continue;
26
+ }
27
+ const x = vert.x * radius, y = vert.y * radius;
28
+ if (i) {
29
+ context.lineTo(x, y);
30
+ }
31
+ else {
32
+ context.moveTo(x, y);
33
+ }
12
34
  }
35
+ context.closePath();
13
36
  }
package/esm/index.js CHANGED
@@ -1,21 +1,25 @@
1
1
  export async function loadGenericPolygonShape(engine) {
2
- engine.checkVersion("4.0.0-alpha.8");
3
- await engine.register(async (e) => {
4
- const { PolygonDrawer } = await import("./PolygonDrawer.js");
5
- e.addShape(new PolygonDrawer());
2
+ engine.checkVersion("4.0.0-beta.0");
3
+ await engine.register(e => {
4
+ e.addShape(["polygon"], async () => {
5
+ const { PolygonDrawer } = await import("./PolygonDrawer.js");
6
+ return new PolygonDrawer();
7
+ });
6
8
  });
7
9
  }
8
10
  export async function loadTriangleShape(engine) {
9
- engine.checkVersion("4.0.0-alpha.8");
10
- await engine.register(async (e) => {
11
- const { TriangleDrawer } = await import("./TriangleDrawer.js");
12
- e.addShape(new TriangleDrawer());
11
+ engine.checkVersion("4.0.0-beta.0");
12
+ await engine.register(e => {
13
+ e.addShape(["triangle"], async () => {
14
+ const { TriangleDrawer } = await import("./TriangleDrawer.js");
15
+ return new TriangleDrawer();
16
+ });
13
17
  });
14
18
  }
15
19
  export async function loadPolygonShape(engine) {
16
- engine.checkVersion("4.0.0-alpha.8");
17
- await engine.register(async (e) => {
18
- await loadGenericPolygonShape(e);
19
- await loadTriangleShape(e);
20
- });
20
+ engine.checkVersion("4.0.0-beta.0");
21
+ await Promise.all([
22
+ loadGenericPolygonShape(engine),
23
+ loadTriangleShape(engine),
24
+ ]);
21
25
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tsparticles/shape-polygon",
3
- "version": "4.0.0-alpha.8",
3
+ "version": "4.0.0-beta.0",
4
4
  "description": "tsParticles polygon shape",
5
5
  "homepage": "https://particles.js.org",
6
6
  "repository": {
@@ -59,7 +59,7 @@
59
59
  "./package.json": "./package.json"
60
60
  },
61
61
  "dependencies": {
62
- "@tsparticles/engine": "4.0.0-alpha.8"
62
+ "@tsparticles/engine": "4.0.0-beta.0"
63
63
  },
64
64
  "publishConfig": {
65
65
  "access": "public"
package/report.html CHANGED
@@ -3,7 +3,7 @@
3
3
  <head>
4
4
  <meta charset="UTF-8"/>
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1"/>
6
- <title>@tsparticles/shape-polygon [23 Jan 2026 at 23:48]</title>
6
+ <title>@tsparticles/shape-polygon [19 Mar 2026 at 13:58]</title>
7
7
  <link rel="shortcut icon" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAABrVBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////+O1foceMD///+J0/qK1Pr7/v8Xdr/9///W8P4UdL7L7P0Scr2r4Pyj3vwad8D5/f/2/f+55f3E6f34+/2H0/ojfMKpzOd0rNgQcb3F3O/j9f7c8v6g3Pz0/P/w+v/q+P7n9v6T1/uQ1vuE0vqLut/y+v+Z2fvt+f+15Pzv9fuc2/vR7v2V2Pvd6/bg9P7I6/285/2y4/yp3/zp8vk8i8kqgMT7/P31+fyv4vxGkcz6/P6/6P3j7vfS5PNnpNUxhcbO7f7F6v3O4vHK3/DA2u631Ouy0eqXweKJud5wqthfoNMMbLvY8f73+v2dxeR8sNtTmdDx9/zX6PSjyeaCtd1YnNGX2PuQveCGt95Nls42h8dLlM3F4vBtAAAAM3RSTlMAAyOx0/sKBvik8opWGBMOAe3l1snDm2E9LSb06eHcu5JpHbarfHZCN9CBb08zzkdNS0kYaptYAAAFV0lEQVRYw92X51/aYBDHHS2O2qqttVbrqNq9m+TJIAYIShBkWwqIiCgoWvfeq7Z2/s29hyQNyUcR7LveGwVyXy6XH8/9rqxglLfUPLxVduUor3h0rfp2TYvpivk37929TkG037hffoX0+peVtZQc1589rigVUdXS/ABSAyEmGIO/1XfvldSK8vs3OqB6u3m0nxmIrvgB0dj7rr7Y9IbuF68hnfFaiHA/sxqm0wciIG43P60qKv9WXWc1RXGh/mFESFABTSBi0sNAKzqet17eCtOb3kZIDwxEEU0oAIJGYxNBDhBND29e0rtXXbcpuPmED9IhEAAQ/AXEaF8EPmnrrKsv0LvWR3fg5sWDNAFZOgAgaKvZDogHNU9MFwnnYROkc56RD5CjAbQX9Ow4g7upCsvYu55aSI/Nj0H1akgKQEUM94dwK65hYRmFU9MIcH/fqJYOZYcnuJSU/waKDgTOEVaVKhwrTRP5XzgSpAITYzom7UvkhFX5VutmxeNnWDjjswTKTyfgluNDGbUpWissXhF3s7mlSml+czWkg3D0l1nNjGNjz3myOQOa1KM/jOS6ebdbAVTCi4gljHSFrviza7tOgRWcS0MOUX9zdNgag5w7rRqA44Lzw0hr1WqES36dFliSJFlh2rXIae3FFcDDgKdxrUIDePr8jGcSClV1u7A9xeN0ModY/pHMxmR1EzRh8TJiwqsHmKW0l4FCEZI+jHio+JdPPE9qwQtTRxku2D8sIeRL2LnxWSllANCQGOIiqVHAz2ye2JR0DcH+HoxDkaADLjgxjKQ+AwCX/g0+DNgdG0ukYCONAe+dbc2IAc6fwt1ARoDSezNHxV2Cmzwv3O6lDMV55edBGwGK9n1+x2F8EDfAGCxug8MhpsMEcTEAWf3rx2vZhe/LAmtIn/6apE6PN0ULKgywD9mmdxbmFl3OvD5AS5fW5zLbv/YHmcsBTjf/afDz3MaZTVCfAP9z6/Bw6ycv8EUBWJIn9zYcoAWWlW9+OzO3vkTy8H+RANLmdrpOuYWdZYEXpo+TlCJrW5EARb7fF+bWdqf3hhyZI1nWJQHgznErZhbjoEsWqi8dQNoE294aldzFurwSABL2XXMf9+H1VQGke9exw5P/AnA5Pv5ngMul7LOvO922iwACu8WkCwLCafvM4CeWPxfA8lNHcWZSoi8EwMAIciKX2Z4SWCMAa3snCZ/G4EA8D6CMLNFsGQhkkz/gQNEBbPCbWsxGUpYVu3z8IyNAknwJkfPMEhLyrdi5RTyUVACkw4GSFRNWJNEW+fgPGwHD8/JxnRuLabN4CGNRkAE23na2+VmEAUmrYymSGjMAYqH84YUIyzgzs3XC7gNgH36Vcc4zKY9o9fgPBXUAiHHwVboBHGLiX6Zcjp1f2wu4tvzZKo0ecPnDtQYDQvJXaBeNzce45Fp28ZQLrEZVuFqgBwOalArKXnW1UzlnSusQKJqKYNuz4tOnI6sZG4zanpemv+7ySU2jbA9h6uhcgpfy6G2PahirDZ6zvq6zDduMVFTKvzw8wgyEdelwY9in3XkEPs3osJuwRQ4qTkfzifndg9Gfc4pdsu82+tTnHZTBa2EAMrqr2t43pguc8tNm7JQVQ2S0ukj2d22dhXYP0/veWtwKrCkNoNimAN5+Xr/oLrxswKbVJjteWrX7eR63o4j9q0GxnaBdWgGA5VStpanIjQmEhV0/nVt5VOFUvix6awJhPcAaTEShgrG+iGyvb5a0Ndb1YGHFPEwoqAinoaykaID1o1pdPNu7XsnCKQ3R+hwWIIhGvORcJUBYXe3Xa3vq/mF/N9V13ugufMkfXn+KHsRD0B8AAAAASUVORK5CYII=" type="image/x-icon" />
8
8
 
9
9
  <script>
@@ -4,7 +4,7 @@
4
4
  * Demo / Generator : https://particles.js.org/
5
5
  * GitHub : https://www.github.com/matteobruni/tsparticles
6
6
  * How to use? : Check the GitHub README
7
- * v4.0.0-alpha.8
7
+ * v4.0.0-beta.0
8
8
  */
9
9
  /*
10
10
  * ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
@@ -28,16 +28,6 @@ return /******/ (() => { // webpackBootstrap
28
28
  /******/ "use strict";
29
29
  /******/ var __webpack_modules__ = ({
30
30
 
31
- /***/ "./dist/browser/index.js"
32
- /*!*******************************!*\
33
- !*** ./dist/browser/index.js ***!
34
- \*******************************/
35
- (__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
36
-
37
- eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ loadGenericPolygonShape: () => (/* binding */ loadGenericPolygonShape),\n/* harmony export */ loadPolygonShape: () => (/* binding */ loadPolygonShape),\n/* harmony export */ loadTriangleShape: () => (/* binding */ loadTriangleShape)\n/* harmony export */ });\nasync function loadGenericPolygonShape(engine) {\n engine.checkVersion(\"4.0.0-alpha.8\");\n await engine.register(async e => {\n const {\n PolygonDrawer\n } = await __webpack_require__.e(/*! import() */ \"dist_browser_PolygonDrawer_js\").then(__webpack_require__.bind(__webpack_require__, /*! ./PolygonDrawer.js */ \"./dist/browser/PolygonDrawer.js\"));\n e.addShape(new PolygonDrawer());\n });\n}\nasync function loadTriangleShape(engine) {\n engine.checkVersion(\"4.0.0-alpha.8\");\n await engine.register(async e => {\n const {\n TriangleDrawer\n } = await __webpack_require__.e(/*! import() */ \"dist_browser_TriangleDrawer_js\").then(__webpack_require__.bind(__webpack_require__, /*! ./TriangleDrawer.js */ \"./dist/browser/TriangleDrawer.js\"));\n e.addShape(new TriangleDrawer());\n });\n}\nasync function loadPolygonShape(engine) {\n engine.checkVersion(\"4.0.0-alpha.8\");\n await engine.register(async e => {\n await loadGenericPolygonShape(e);\n await loadTriangleShape(e);\n });\n}\n\n//# sourceURL=webpack://@tsparticles/shape-polygon/./dist/browser/index.js?\n}");
38
-
39
- /***/ },
40
-
41
31
  /***/ "@tsparticles/engine"
42
32
  /*!*********************************************************************************************************************************!*\
43
33
  !*** external {"commonjs":"@tsparticles/engine","commonjs2":"@tsparticles/engine","amd":"@tsparticles/engine","root":"window"} ***!
@@ -46,6 +36,16 @@ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpa
46
36
 
47
37
  module.exports = __WEBPACK_EXTERNAL_MODULE__tsparticles_engine__;
48
38
 
39
+ /***/ },
40
+
41
+ /***/ "./dist/browser/index.js"
42
+ /*!*******************************!*\
43
+ !*** ./dist/browser/index.js ***!
44
+ \*******************************/
45
+ (__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
46
+
47
+ eval("{__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ loadGenericPolygonShape: () => (/* binding */ loadGenericPolygonShape),\n/* harmony export */ loadPolygonShape: () => (/* binding */ loadPolygonShape),\n/* harmony export */ loadTriangleShape: () => (/* binding */ loadTriangleShape)\n/* harmony export */ });\nasync function loadGenericPolygonShape(engine) {\n engine.checkVersion(\"4.0.0-beta.0\");\n await engine.register((e)=>{\n e.addShape([\n \"polygon\"\n ], async ()=>{\n const { PolygonDrawer } = await __webpack_require__.e(/*! import() */ \"dist_browser_PolygonDrawer_js\").then(__webpack_require__.bind(__webpack_require__, /*! ./PolygonDrawer.js */ \"./dist/browser/PolygonDrawer.js\"));\n return new PolygonDrawer();\n });\n });\n}\nasync function loadTriangleShape(engine) {\n engine.checkVersion(\"4.0.0-beta.0\");\n await engine.register((e)=>{\n e.addShape([\n \"triangle\"\n ], async ()=>{\n const { TriangleDrawer } = await __webpack_require__.e(/*! import() */ \"dist_browser_TriangleDrawer_js\").then(__webpack_require__.bind(__webpack_require__, /*! ./TriangleDrawer.js */ \"./dist/browser/TriangleDrawer.js\"));\n return new TriangleDrawer();\n });\n });\n}\nasync function loadPolygonShape(engine) {\n engine.checkVersion(\"4.0.0-beta.0\");\n await Promise.all([\n loadGenericPolygonShape(engine),\n loadTriangleShape(engine)\n ]);\n}\n\n\n//# sourceURL=webpack://@tsparticles/shape-polygon/./dist/browser/index.js?\n}");
48
+
49
49
  /***/ }
50
50
 
51
51
  /******/ });
@@ -60,12 +60,6 @@ module.exports = __WEBPACK_EXTERNAL_MODULE__tsparticles_engine__;
60
60
  /******/ if (cachedModule !== undefined) {
61
61
  /******/ return cachedModule.exports;
62
62
  /******/ }
63
- /******/ // Check if module exists (development only)
64
- /******/ if (__webpack_modules__[moduleId] === undefined) {
65
- /******/ var e = new Error("Cannot find module '" + moduleId + "'");
66
- /******/ e.code = 'MODULE_NOT_FOUND';
67
- /******/ throw e;
68
- /******/ }
69
63
  /******/ // Create a new module (and put it into the cache)
70
64
  /******/ var module = __webpack_module_cache__[moduleId] = {
71
65
  /******/ // no module.id needed
@@ -74,6 +68,12 @@ module.exports = __WEBPACK_EXTERNAL_MODULE__tsparticles_engine__;
74
68
  /******/ };
75
69
  /******/
76
70
  /******/ // Execute the module function
71
+ /******/ if (!(moduleId in __webpack_modules__)) {
72
+ /******/ delete __webpack_module_cache__[moduleId];
73
+ /******/ var e = new Error("Cannot find module '" + moduleId + "'");
74
+ /******/ e.code = 'MODULE_NOT_FOUND';
75
+ /******/ throw e;
76
+ /******/ }
77
77
  /******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
78
78
  /******/
79
79
  /******/ // Return the exports of the module
@@ -118,6 +118,18 @@ module.exports = __WEBPACK_EXTERNAL_MODULE__tsparticles_engine__;
118
118
  /******/ };
119
119
  /******/ })();
120
120
  /******/
121
+ /******/ /* webpack/runtime/global */
122
+ /******/ (() => {
123
+ /******/ __webpack_require__.g = (function() {
124
+ /******/ if (typeof globalThis === 'object') return globalThis;
125
+ /******/ try {
126
+ /******/ return this || new Function('return this')();
127
+ /******/ } catch (e) {
128
+ /******/ if (typeof window === 'object') return window;
129
+ /******/ }
130
+ /******/ })();
131
+ /******/ })();
132
+ /******/
121
133
  /******/ /* webpack/runtime/hasOwnProperty shorthand */
122
134
  /******/ (() => {
123
135
  /******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
@@ -182,8 +194,8 @@ module.exports = __WEBPACK_EXTERNAL_MODULE__tsparticles_engine__;
182
194
  /******/ /* webpack/runtime/publicPath */
183
195
  /******/ (() => {
184
196
  /******/ var scriptUrl;
185
- /******/ if (globalThis.importScripts) scriptUrl = globalThis.location + "";
186
- /******/ var document = globalThis.document;
197
+ /******/ if (__webpack_require__.g.importScripts) scriptUrl = __webpack_require__.g.location + "";
198
+ /******/ var document = __webpack_require__.g.document;
187
199
  /******/ if (!scriptUrl && document) {
188
200
  /******/ if (document.currentScript && document.currentScript.tagName.toUpperCase() === 'SCRIPT')
189
201
  /******/ scriptUrl = document.currentScript.src;
@@ -1,2 +1,2 @@
1
- /*! For license information please see tsparticles.shape.polygon.min.js.LICENSE.txt */
2
- !function(e,r){if("object"==typeof exports&&"object"==typeof module)module.exports=r(require("@tsparticles/engine"));else if("function"==typeof define&&define.amd)define(["@tsparticles/engine"],r);else{var t="object"==typeof exports?r(require("@tsparticles/engine")):r(e.window);for(var a in t)("object"==typeof exports?exports:e)[a]=t[a]}}(this,(e=>(()=>{var r,t,a={303(r){r.exports=e}},o={};function n(e){var r=o[e];if(void 0!==r)return r.exports;var t=o[e]={exports:{}};return a[e](t,t.exports,n),t.exports}n.m=a,n.d=(e,r)=>{for(var t in r)n.o(r,t)&&!n.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:r[t]})},n.f={},n.e=e=>Promise.all(Object.keys(n.f).reduce(((r,t)=>(n.f[t](e,r),r)),[])),n.u=e=>e+".min.js",n.o=(e,r)=>Object.prototype.hasOwnProperty.call(e,r),r={},t="@tsparticles/shape-polygon:",n.l=(e,a,o,i)=>{if(r[e])r[e].push(a);else{var s,l;if(void 0!==o)for(var p=document.getElementsByTagName("script"),c=0;c<p.length;c++){var d=p[c];if(d.getAttribute("src")==e||d.getAttribute("data-webpack")==t+o){s=d;break}}s||(l=!0,(s=document.createElement("script")).charset="utf-8",n.nc&&s.setAttribute("nonce",n.nc),s.setAttribute("data-webpack",t+o),s.src=e),r[e]=[a];var u=(t,a)=>{s.onerror=s.onload=null,clearTimeout(f);var o=r[e];if(delete r[e],s.parentNode&&s.parentNode.removeChild(s),o&&o.forEach((e=>e(a))),t)return t(a)},f=setTimeout(u.bind(null,void 0,{type:"timeout",target:s}),12e4);s.onerror=u.bind(null,s.onerror),s.onload=u.bind(null,s.onload),l&&document.head.appendChild(s)}},n.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},(()=>{var e;globalThis.importScripts&&(e=globalThis.location+"");var r=globalThis.document;if(!e&&r&&(r.currentScript&&"SCRIPT"===r.currentScript.tagName.toUpperCase()&&(e=r.currentScript.src),!e)){var t=r.getElementsByTagName("script");if(t.length)for(var a=t.length-1;a>-1&&(!e||!/^http(s?):/.test(e));)e=t[a--].src}if(!e)throw new Error("Automatic publicPath is not supported in this browser");e=e.replace(/^blob:/,"").replace(/#.*$/,"").replace(/\?.*$/,"").replace(/\/[^\/]+$/,"/"),n.p=e})(),(()=>{var e={974:0};n.f.j=(r,t)=>{var a=n.o(e,r)?e[r]:void 0;if(0!==a)if(a)t.push(a[2]);else{var o=new Promise(((t,o)=>a=e[r]=[t,o]));t.push(a[2]=o);var i=n.p+n.u(r),s=new Error;n.l(i,(t=>{if(n.o(e,r)&&(0!==(a=e[r])&&(e[r]=void 0),a)){var o=t&&("load"===t.type?"missing":t.type),i=t&&t.target&&t.target.src;s.message="Loading chunk "+r+" failed.\n("+o+": "+i+")",s.name="ChunkLoadError",s.type=o,s.request=i,a[1](s)}}),"chunk-"+r,r)}};var r=(r,t)=>{var a,o,[i,s,l]=t,p=0;if(i.some((r=>0!==e[r]))){for(a in s)n.o(s,a)&&(n.m[a]=s[a]);if(l)l(n)}for(r&&r(t);p<i.length;p++)o=i[p],n.o(e,o)&&e[o]&&e[o][0](),e[o]=0},t=this.webpackChunk_tsparticles_shape_polygon=this.webpackChunk_tsparticles_shape_polygon||[];t.forEach(r.bind(null,0)),t.push=r.bind(null,t.push.bind(t))})();var i={};async function s(e){e.checkVersion("4.0.0-alpha.8"),await e.register((async e=>{const{PolygonDrawer:r}=await n.e(215).then(n.bind(n,215));e.addShape(new r)}))}async function l(e){e.checkVersion("4.0.0-alpha.8"),await e.register((async e=>{const{TriangleDrawer:r}=await n.e(115).then(n.bind(n,115));e.addShape(new r)}))}async function p(e){e.checkVersion("4.0.0-alpha.8"),await e.register((async e=>{await s(e),await l(e)}))}return n.r(i),n.d(i,{loadGenericPolygonShape:()=>s,loadPolygonShape:()=>p,loadTriangleShape:()=>l}),i})()));
1
+ !function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("@tsparticles/engine"));else if("function"==typeof define&&define.amd)define(["@tsparticles/engine"],t);else{var r="object"==typeof exports?t(require("@tsparticles/engine")):t(e.window);for(var o in r)("object"==typeof exports?exports:e)[o]=r[o]}}(this,e=>(()=>{"use strict";var t,r,o,n={303(t){t.exports=e}},a={};function i(e){var t=a[e];if(void 0!==t)return t.exports;var r=a[e]={exports:{}};return n[e](r,r.exports,i),r.exports}i.m=n,i.d=(e,t)=>{for(var r in t)i.o(t,r)&&!i.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},i.f={},i.e=e=>Promise.all(Object.keys(i.f).reduce((t,r)=>(i.f[r](e,t),t),[])),i.u=e=>""+e+".min.js",i.g=function(){if("object"==typeof globalThis)return globalThis;try{return this||Function("return this")()}catch(e){if("object"==typeof window)return window}}(),i.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),s={},i.l=(e,t,r,o)=>{if(s[e])return void s[e].push(t);if(void 0!==r)for(var n,a,c=document.getElementsByTagName("script"),p=0;p<c.length;p++){var l=c[p];if(l.getAttribute("src")==e||l.getAttribute("data-webpack")=="@tsparticles/shape-polygon:"+r){n=l;break}}n||(a=!0,(n=document.createElement("script")).charset="utf-8",i.nc&&n.setAttribute("nonce",i.nc),n.setAttribute("data-webpack","@tsparticles/shape-polygon:"+r),n.src=e),s[e]=[t];var u=(t,r)=>{n.onerror=n.onload=null,clearTimeout(d);var o=s[e];if(delete s[e],n.parentNode&&n.parentNode.removeChild(n),o&&o.forEach(e=>e(r)),t)return t(r)},d=setTimeout(u.bind(null,void 0,{type:"timeout",target:n}),12e4);n.onerror=u.bind(null,n.onerror),n.onload=u.bind(null,n.onload),a&&document.head.appendChild(n)},i.r=e=>{"u">typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.g.importScripts&&(c=i.g.location+"");var s,c,p=i.g.document;if(!c&&p&&(p.currentScript&&"SCRIPT"===p.currentScript.tagName.toUpperCase()&&(c=p.currentScript.src),!c)){var l=p.getElementsByTagName("script");if(l.length)for(var u=l.length-1;u>-1&&(!c||!/^http(s?):/.test(c));)c=l[u--].src}if(!c)throw Error("Automatic publicPath is not supported in this browser");i.p=c=c.replace(/^blob:/,"").replace(/#.*$/,"").replace(/\?.*$/,"").replace(/\/[^\/]+$/,"/"),t={974:0},i.f.j=(e,r)=>{var o=i.o(t,e)?t[e]:void 0;if(0!==o)if(o)r.push(o[2]);else{var n=new Promise((r,n)=>o=t[e]=[r,n]);r.push(o[2]=n);var a=i.p+i.u(e),s=Error();i.l(a,r=>{if(i.o(t,e)&&(0!==(o=t[e])&&(t[e]=void 0),o)){var n=r&&("load"===r.type?"missing":r.type),a=r&&r.target&&r.target.src;s.message="Loading chunk "+e+` failed.
2
+ (`+n+": "+a+")",s.name="ChunkLoadError",s.type=n,s.request=a,o[1](s)}},"chunk-"+e,e)}},r=(e,r)=>{var o,n,[a,s,c]=r,p=0;if(a.some(e=>0!==t[e])){for(o in s)i.o(s,o)&&(i.m[o]=s[o]);c&&c(i)}for(e&&e(r);p<a.length;p++)n=a[p],i.o(t,n)&&t[n]&&t[n][0](),t[n]=0},(o=this.webpackChunk_tsparticles_shape_polygon=this.webpackChunk_tsparticles_shape_polygon||[]).forEach(r.bind(null,0)),o.push=r.bind(null,o.push.bind(o));var d={};async function f(e){e.checkVersion("4.0.0-beta.0"),await e.register(e=>{e.addShape(["polygon"],async()=>{let{PolygonDrawer:e}=await i.e(833).then(i.bind(i,833));return new e})})}async function h(e){e.checkVersion("4.0.0-beta.0"),await e.register(e=>{e.addShape(["triangle"],async()=>{let{TriangleDrawer:e}=await i.e(685).then(i.bind(i,685));return new e})})}async function g(e){e.checkVersion("4.0.0-beta.0"),await Promise.all([f(e),h(e)])}return i.r(d),i.d(d,{loadGenericPolygonShape:()=>f,loadPolygonShape:()=>g,loadTriangleShape:()=>h}),d})());
@@ -1,8 +1,6 @@
1
- import type { ICoordinates, Particle } from "@tsparticles/engine";
2
1
  import type { ISide } from "./ISide.js";
2
+ import type { Particle } from "@tsparticles/engine";
3
3
  import { PolygonDrawerBase } from "./PolygonDrawerBase.js";
4
4
  export declare class PolygonDrawer extends PolygonDrawerBase {
5
- readonly validTypes: readonly ["polygon"];
6
- getCenter(particle: Particle, radius: number): ICoordinates;
7
5
  getSidesData(particle: Particle, radius: number): ISide;
8
6
  }
@@ -1,9 +1,7 @@
1
- import { type ICoordinates, type IShapeDrawData, type IShapeDrawer, type Particle } from "@tsparticles/engine";
1
+ import { type IShapeDrawData, type IShapeDrawer, type Particle } from "@tsparticles/engine";
2
2
  import type { ISide } from "./ISide.js";
3
3
  export declare abstract class PolygonDrawerBase implements IShapeDrawer {
4
- abstract readonly validTypes: readonly string[];
5
4
  draw(data: IShapeDrawData): void;
6
5
  getSidesCount(particle: Particle): number;
7
- abstract getCenter(particle: Particle, radius: number): ICoordinates;
8
6
  abstract getSidesData(particle: Particle, radius: number): ISide;
9
7
  }
@@ -1,9 +1,7 @@
1
- import { type ICoordinates, type Particle } from "@tsparticles/engine";
2
1
  import type { ISide } from "./ISide.js";
2
+ import { type Particle } from "@tsparticles/engine";
3
3
  import { PolygonDrawerBase } from "./PolygonDrawerBase.js";
4
4
  export declare class TriangleDrawer extends PolygonDrawerBase {
5
- readonly validTypes: readonly ["triangle"];
6
- getCenter(_particle: Particle, radius: number): ICoordinates;
7
5
  getSidesCount(): number;
8
6
  getSidesData(_particle: Particle, radius: number): ISide;
9
7
  }
package/types/Utils.d.ts CHANGED
@@ -1,3 +1,3 @@
1
- import { type ICoordinates, type IShapeDrawData } from "@tsparticles/engine";
1
+ import { type IShapeDrawData } from "@tsparticles/engine";
2
2
  import type { ISide } from "./ISide.js";
3
- export declare function drawPolygon(data: IShapeDrawData, start: ICoordinates, side: ISide): void;
3
+ export declare function drawPolygon(data: IShapeDrawData, side: ISide): void;
@@ -11,20 +11,10 @@
11
11
  Object.defineProperty(exports, "__esModule", { value: true });
12
12
  exports.PolygonDrawer = void 0;
13
13
  const PolygonDrawerBase_js_1 = require("./PolygonDrawerBase.js");
14
- const sidesCenterFactor = 3.5, yFactor = 2.66, sidesFactor = 3;
14
+ const yFactor = 2.66, sidesFactor = 3;
15
15
  class PolygonDrawer extends PolygonDrawerBase_js_1.PolygonDrawerBase {
16
- constructor() {
17
- super(...arguments);
18
- this.validTypes = ["polygon"];
19
- }
20
- getCenter(particle, radius) {
21
- return {
22
- x: -radius / (particle.sides / sidesCenterFactor),
23
- y: -radius / (yFactor / sidesCenterFactor),
24
- };
25
- }
26
16
  getSidesData(particle, radius) {
27
- const sides = particle.sides;
17
+ const { sides } = particle;
28
18
  return {
29
19
  count: {
30
20
  denominator: 1,
@@ -15,8 +15,8 @@
15
15
  const defaultSides = 5;
16
16
  class PolygonDrawerBase {
17
17
  draw(data) {
18
- const { particle, radius } = data, start = this.getCenter(particle, radius), side = this.getSidesData(particle, radius);
19
- (0, Utils_js_1.drawPolygon)(data, start, side);
18
+ const { particle, radius } = data, side = this.getSidesData(particle, radius);
19
+ (0, Utils_js_1.drawPolygon)(data, side);
20
20
  }
21
21
  getSidesCount(particle) {
22
22
  const polygon = particle.shapeData;
@@ -4,37 +4,25 @@
4
4
  if (v !== undefined) module.exports = v;
5
5
  }
6
6
  else if (typeof define === "function" && define.amd) {
7
- define(["require", "exports", "@tsparticles/engine", "./PolygonDrawerBase.js"], factory);
7
+ define(["require", "exports", "./PolygonDrawerBase.js"], factory);
8
8
  }
9
9
  })(function (require, exports) {
10
10
  "use strict";
11
11
  Object.defineProperty(exports, "__esModule", { value: true });
12
12
  exports.TriangleDrawer = void 0;
13
- const engine_1 = require("@tsparticles/engine");
14
13
  const PolygonDrawerBase_js_1 = require("./PolygonDrawerBase.js");
15
- const yFactor = 1.66, sides = 3;
14
+ const sides = 3, yFactor = 2.66, sidesFactor = 3;
16
15
  class TriangleDrawer extends PolygonDrawerBase_js_1.PolygonDrawerBase {
17
- constructor() {
18
- super(...arguments);
19
- this.validTypes = ["triangle"];
20
- }
21
- getCenter(_particle, radius) {
22
- return {
23
- x: -radius,
24
- y: radius / yFactor,
25
- };
26
- }
27
16
  getSidesCount() {
28
17
  return sides;
29
18
  }
30
19
  getSidesData(_particle, radius) {
31
- const diameter = radius * engine_1.double;
32
20
  return {
33
21
  count: {
34
- denominator: 2,
35
- numerator: 3,
22
+ denominator: 1,
23
+ numerator: sides,
36
24
  },
37
- length: diameter,
25
+ length: (radius * yFactor) / (sides / sidesFactor),
38
26
  };
39
27
  }
40
28
  }
package/umd/Utils.js CHANGED
@@ -11,16 +11,39 @@
11
11
  Object.defineProperty(exports, "__esModule", { value: true });
12
12
  exports.drawPolygon = drawPolygon;
13
13
  const engine_1 = require("@tsparticles/engine");
14
- const piDeg = 180, origin = { x: 0, y: 0 }, sidesOffset = 2;
15
- function drawPolygon(data, start, side) {
16
- const { context } = data, sideCount = side.count.numerator * side.count.denominator, decimalSides = side.count.numerator / side.count.denominator, interiorAngleDegrees = (piDeg * (decimalSides - sidesOffset)) / decimalSides, interiorAngle = Math.PI - (0, engine_1.degToRad)(interiorAngleDegrees);
14
+ const polygonCache = new Map(), noOffset = 0;
15
+ function getUnitPolygon(sides) {
16
+ const cached = polygonCache.get(sides);
17
+ if (cached) {
18
+ return cached;
19
+ }
20
+ const step = engine_1.doublePI / sides, isOdd = !!(sides % engine_1.double), baseAngle = (-Math.PI + (isOdd ? noOffset : step)) * engine_1.half, verts = [];
21
+ for (let i = 0; i < sides; i++) {
22
+ const angle = baseAngle + i * step;
23
+ verts[i] = {
24
+ x: Math.cos(angle),
25
+ y: Math.sin(angle),
26
+ };
27
+ }
28
+ polygonCache.set(sides, verts);
29
+ return verts;
30
+ }
31
+ function drawPolygon(data, side) {
32
+ const { context, radius } = data, sides = side.count.numerator / side.count.denominator, verts = getUnitPolygon(sides);
17
33
  context.beginPath();
18
- context.translate(start.x, start.y);
19
- context.moveTo(origin.x, origin.y);
20
- for (let i = 0; i < sideCount; i++) {
21
- context.lineTo(side.length, origin.y);
22
- context.translate(side.length, origin.y);
23
- context.rotate(interiorAngle);
34
+ for (let i = 0; i < verts.length; i++) {
35
+ const vert = verts[i];
36
+ if (!vert) {
37
+ continue;
38
+ }
39
+ const x = vert.x * radius, y = vert.y * radius;
40
+ if (i) {
41
+ context.lineTo(x, y);
42
+ }
43
+ else {
44
+ context.moveTo(x, y);
45
+ }
24
46
  }
47
+ context.closePath();
25
48
  }
26
49
  });
package/umd/index.js CHANGED
@@ -47,24 +47,28 @@ var __importStar = (this && this.__importStar) || (function () {
47
47
  exports.loadTriangleShape = loadTriangleShape;
48
48
  exports.loadPolygonShape = loadPolygonShape;
49
49
  async function loadGenericPolygonShape(engine) {
50
- engine.checkVersion("4.0.0-alpha.8");
51
- await engine.register(async (e) => {
52
- const { PolygonDrawer } = await (__syncRequire ? Promise.resolve().then(() => __importStar(require("./PolygonDrawer.js"))) : new Promise((resolve_1, reject_1) => { require(["./PolygonDrawer.js"], resolve_1, reject_1); }).then(__importStar));
53
- e.addShape(new PolygonDrawer());
50
+ engine.checkVersion("4.0.0-beta.0");
51
+ await engine.register(e => {
52
+ e.addShape(["polygon"], async () => {
53
+ const { PolygonDrawer } = await (__syncRequire ? Promise.resolve().then(() => __importStar(require("./PolygonDrawer.js"))) : new Promise((resolve_1, reject_1) => { require(["./PolygonDrawer.js"], resolve_1, reject_1); }).then(__importStar));
54
+ return new PolygonDrawer();
55
+ });
54
56
  });
55
57
  }
56
58
  async function loadTriangleShape(engine) {
57
- engine.checkVersion("4.0.0-alpha.8");
58
- await engine.register(async (e) => {
59
- const { TriangleDrawer } = await (__syncRequire ? Promise.resolve().then(() => __importStar(require("./TriangleDrawer.js"))) : new Promise((resolve_2, reject_2) => { require(["./TriangleDrawer.js"], resolve_2, reject_2); }).then(__importStar));
60
- e.addShape(new TriangleDrawer());
59
+ engine.checkVersion("4.0.0-beta.0");
60
+ await engine.register(e => {
61
+ e.addShape(["triangle"], async () => {
62
+ const { TriangleDrawer } = await (__syncRequire ? Promise.resolve().then(() => __importStar(require("./TriangleDrawer.js"))) : new Promise((resolve_2, reject_2) => { require(["./TriangleDrawer.js"], resolve_2, reject_2); }).then(__importStar));
63
+ return new TriangleDrawer();
64
+ });
61
65
  });
62
66
  }
63
67
  async function loadPolygonShape(engine) {
64
- engine.checkVersion("4.0.0-alpha.8");
65
- await engine.register(async (e) => {
66
- await loadGenericPolygonShape(e);
67
- await loadTriangleShape(e);
68
- });
68
+ engine.checkVersion("4.0.0-beta.0");
69
+ await Promise.all([
70
+ loadGenericPolygonShape(engine),
71
+ loadTriangleShape(engine),
72
+ ]);
69
73
  }
70
74
  });
package/115.min.js DELETED
@@ -1,2 +0,0 @@
1
- /*! For license information please see 115.min.js.LICENSE.txt */
2
- (this.webpackChunk_tsparticles_shape_polygon=this.webpackChunk_tsparticles_shape_polygon||[]).push([[115],{115(t,e,n){n.d(e,{TriangleDrawer:()=>o});var a=n(303),r=n(549);class o extends r.L{constructor(){super(...arguments),this.validTypes=["triangle"]}getCenter(t,e){return{x:-e,y:e/1.66}}getSidesCount(){return 3}getSidesData(t,e){return{count:{denominator:2,numerator:3},length:e*a.double}}}},549(t,e,n){n.d(e,{L:()=>s});var a=n(303);const r=0,o=0;class s{draw(t){const{particle:e,radius:n}=t;!function(t,e,n){const{context:s}=t,u=n.count.numerator*n.count.denominator,i=n.count.numerator/n.count.denominator,c=180*(i-2)/i,l=Math.PI-(0,a.degToRad)(c);s.beginPath(),s.translate(e.x,e.y),s.moveTo(r,o);for(let t=0;t<u;t++)s.lineTo(n.length,o),s.translate(n.length,o),s.rotate(l)}(t,this.getCenter(e,n),this.getSidesData(e,n))}getSidesCount(t){const e=t.shapeData;return Math.round((0,a.getRangeValue)(e?.sides??5))}}}}]);
@@ -1 +0,0 @@
1
- /*! tsParticles Polygon Shape v4.0.0-alpha.8 by Matteo Bruni */
package/215.min.js DELETED
@@ -1,2 +0,0 @@
1
- /*! For license information please see 215.min.js.LICENSE.txt */
2
- (this.webpackChunk_tsparticles_shape_polygon=this.webpackChunk_tsparticles_shape_polygon||[]).push([[215],{215(t,e,n){n.d(e,{PolygonDrawer:()=>o});var a=n(549);class o extends a.L{constructor(){super(...arguments),this.validTypes=["polygon"]}getCenter(t,e){return{x:-e/(t.sides/3.5),y:-e/.76}}getSidesData(t,e){const n=t.sides;return{count:{denominator:1,numerator:n},length:2.66*e/(n/3)}}}},549(t,e,n){n.d(e,{L:()=>r});var a=n(303);const o=0,s=0;class r{draw(t){const{particle:e,radius:n}=t;!function(t,e,n){const{context:r}=t,i=n.count.numerator*n.count.denominator,c=n.count.numerator/n.count.denominator,u=180*(c-2)/c,d=Math.PI-(0,a.degToRad)(u);r.beginPath(),r.translate(e.x,e.y),r.moveTo(o,s);for(let t=0;t<i;t++)r.lineTo(n.length,s),r.translate(n.length,s),r.rotate(d)}(t,this.getCenter(e,n),this.getSidesData(e,n))}getSidesCount(t){const e=t.shapeData;return Math.round((0,a.getRangeValue)(e?.sides??5))}}}}]);
@@ -1 +0,0 @@
1
- /*! tsParticles Polygon Shape v4.0.0-alpha.8 by Matteo Bruni */
@@ -1 +0,0 @@
1
- /*! tsParticles Polygon Shape v4.0.0-alpha.8 by Matteo Bruni */