From 9cb42dbb15e9d408ed94992e44f7c82c8f9f9371 Mon Sep 17 00:00:00 2001 From: marnec Date: Wed, 20 Dec 2023 23:32:44 +0100 Subject: [PATCH 1/2] add params for changing bg color --- docs/index.0489cf72.js | 44790 ++++++++++++++++++++++++++++++++++ docs/index.0489cf72.js.map | 1 + docs/index.19012566.css | 2 - docs/index.19012566.css.map | 1 - docs/index.23137d0f.js | 2 - docs/index.23137d0f.js.map | 1 - docs/index.4bf444f7.js | 1343 + docs/index.4bf444f7.js.map | 1 + docs/index.a1f5851f.css | 16 + docs/index.a1f5851f.css.map | 1 + docs/index.b0f6ada9.js | 770 - docs/index.b0f6ada9.js.map | 1 - docs/index.html | 34 +- src/frame.ts | 17 +- test/e2e/index.ts | 8 +- 15 files changed, 46206 insertions(+), 782 deletions(-) create mode 100644 docs/index.0489cf72.js create mode 100644 docs/index.0489cf72.js.map delete mode 100644 docs/index.19012566.css delete mode 100644 docs/index.19012566.css.map delete mode 100644 docs/index.23137d0f.js delete mode 100644 docs/index.23137d0f.js.map create mode 100644 docs/index.4bf444f7.js create mode 100644 docs/index.4bf444f7.js.map create mode 100644 docs/index.a1f5851f.css create mode 100644 docs/index.a1f5851f.css.map delete mode 100644 docs/index.b0f6ada9.js delete mode 100644 docs/index.b0f6ada9.js.map diff --git a/docs/index.0489cf72.js b/docs/index.0489cf72.js new file mode 100644 index 0000000..a55a634 --- /dev/null +++ b/docs/index.0489cf72.js @@ -0,0 +1,44790 @@ +// modules are defined as an array +// [ module function, map of requires ] +// +// map of requires is short require name -> numeric require +// +// anything defined in a previous bundle is accessed via the +// orig method which is the require for previous bundles + +(function (modules, entry, mainEntry, parcelRequireName, globalName) { + /* eslint-disable no-undef */ + var globalObject = + typeof globalThis !== 'undefined' + ? globalThis + : typeof self !== 'undefined' + ? self + : typeof window !== 'undefined' + ? window + : typeof global !== 'undefined' + ? global + : {}; + /* eslint-enable no-undef */ + + // Save the require from previous bundle to this closure if any + var previousRequire = + typeof globalObject[parcelRequireName] === 'function' && + globalObject[parcelRequireName]; + + var cache = previousRequire.cache || {}; + // Do not use `require` to prevent Webpack from trying to bundle this call + var nodeRequire = + typeof module !== 'undefined' && + typeof module.require === 'function' && + module.require.bind(module); + + function newRequire(name, jumped) { + if (!cache[name]) { + if (!modules[name]) { + // if we cannot find the module within our internal map or + // cache jump to the current global require ie. the last bundle + // that was added to the page. + var currentRequire = + typeof globalObject[parcelRequireName] === 'function' && + globalObject[parcelRequireName]; + if (!jumped && currentRequire) { + return currentRequire(name, true); + } + + // If there are other bundles on this page the require from the + // previous one is saved to 'previousRequire'. Repeat this as + // many times as there are bundles until the module is found or + // we exhaust the require chain. + if (previousRequire) { + return previousRequire(name, true); + } + + // Try the node require function if it exists. + if (nodeRequire && typeof name === 'string') { + return nodeRequire(name); + } + + var err = new Error("Cannot find module '" + name + "'"); + err.code = 'MODULE_NOT_FOUND'; + throw err; + } + + localRequire.resolve = resolve; + localRequire.cache = {}; + + var module = (cache[name] = new newRequire.Module(name)); + + modules[name][0].call( + module.exports, + localRequire, + module, + module.exports, + this + ); + } + + return cache[name].exports; + + function localRequire(x) { + var res = localRequire.resolve(x); + return res === false ? {} : newRequire(res); + } + + function resolve(x) { + var id = modules[name][1][x]; + return id != null ? id : x; + } + } + + function Module(moduleName) { + this.id = moduleName; + this.bundle = newRequire; + this.exports = {}; + } + + newRequire.isParcelRequire = true; + newRequire.Module = Module; + newRequire.modules = modules; + newRequire.cache = cache; + newRequire.parent = previousRequire; + newRequire.register = function (id, exports) { + modules[id] = [ + function (require, module) { + module.exports = exports; + }, + {}, + ]; + }; + + Object.defineProperty(newRequire, 'root', { + get: function () { + return globalObject[parcelRequireName]; + }, + }); + + globalObject[parcelRequireName] = newRequire; + + for (var i = 0; i < entry.length; i++) { + newRequire(entry[i]); + } + + if (mainEntry) { + // Expose entry point to Node, AMD or browser globals + // Based on https://github.com/ForbesLindesay/umd/blob/master/template.js + var mainExports = newRequire(mainEntry); + + // CommonJS + if (typeof exports === 'object' && typeof module !== 'undefined') { + module.exports = mainExports; + + // RequireJS + } else if (typeof define === 'function' && define.amd) { + define(function () { + return mainExports; + }); + + //

Playground

Axes and Grids

Scatterplot

Glyphs

Vectorplot

\ No newline at end of file + + + + + + + Threeplot playground and showcase page + + + + + +

Playground

+
+
+

Axes and Grids

+ +
+
+

Scatterplot

+ +
+
+

Glyphs

+ +
+
+

Vectorplot

+ +
+
+ + diff --git a/src/frame.ts b/src/frame.ts index c557a63..e2fbe25 100644 --- a/src/frame.ts +++ b/src/frame.ts @@ -5,6 +5,16 @@ import { Frameable, Plot } from "./plot"; import { Label } from "./label"; import { AxesParams, GridParams } from "./axes.params"; +type Background = + | { + transparent: true; + color?: never; + } + | { + transparent?: never | false; + color: number; + }; + export class Frame extends Scene { protected scene: Scene; protected renderer: WebGLRenderer; @@ -20,17 +30,18 @@ export class Frame extends Scene { protected canvas: HTMLCanvasElement, protected size = 10, axesParams?: AxesParams, - gridParams?: GridParams + gridParams?: GridParams, + background?: Background, ) { super(); this.scene = new Scene(); - this.scene.background = new Color(0xffffff); + this.scene.background = new Color(background?.color || 0xffffff); const { clientWidth, clientHeight } = canvas; this.width = clientWidth; this.height = clientHeight; - this.renderer = new WebGLRenderer({ canvas }); + this.renderer = new WebGLRenderer({ canvas, alpha: background?.transparent }); this.renderer.setSize(clientWidth, clientHeight); this.setCamera(clientWidth, clientHeight); diff --git a/test/e2e/index.ts b/test/e2e/index.ts index 1530157..f5e6425 100644 --- a/test/e2e/index.ts +++ b/test/e2e/index.ts @@ -6,7 +6,13 @@ const canvas2 = document.getElementById("canvas2") as HTMLCanvasElement; const canvas3 = document.getElementById("canvas3") as HTMLCanvasElement; const canvas4 = document.getElementById("canvas4") as HTMLCanvasElement; -new Frame(canvas1, 10, { x: false, y: { width: 0.025, label: { text: Greek.betaSymbol } } }, { yz: false }); +new Frame( + canvas1, + 10, + { x: false, y: { width: 0.025, label: { text: Greek.betaSymbol } } }, + { yz: false }, + { color: 0xfaf0f0 } +); const frame2 = new Frame(canvas2, 10); const points = getRandomPoints(200); From 9d5557dab048efc244085e55bbc136bbe508ddb9 Mon Sep 17 00:00:00 2001 From: marnec Date: Wed, 20 Dec 2023 22:36:22 +0000 Subject: [PATCH 2/2] =?UTF-8?q?Deploying=20to=20main=20from=20@=20marnec/t?= =?UTF-8?q?hreeplot@9cb42dbb15e9d408ed94992e44f7c82c8f9f9371=20?= =?UTF-8?q?=F0=9F=9A=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/index.0489cf72.js | 44790 ---------------------------------- docs/index.0489cf72.js.map | 1 - docs/index.19012566.css | 2 + docs/index.19012566.css.map | 1 + docs/index.23137d0f.js | 2 + docs/index.23137d0f.js.map | 1 + docs/index.4bf444f7.js | 1343 - docs/index.4bf444f7.js.map | 1 - docs/index.a1f5851f.css | 16 - docs/index.a1f5851f.css.map | 1 - docs/index.aff33ac7.js | 770 + docs/index.aff33ac7.js.map | 1 + docs/index.html | 34 +- 13 files changed, 778 insertions(+), 46185 deletions(-) delete mode 100644 docs/index.0489cf72.js delete mode 100644 docs/index.0489cf72.js.map create mode 100644 docs/index.19012566.css create mode 100644 docs/index.19012566.css.map create mode 100644 docs/index.23137d0f.js create mode 100644 docs/index.23137d0f.js.map delete mode 100644 docs/index.4bf444f7.js delete mode 100644 docs/index.4bf444f7.js.map delete mode 100644 docs/index.a1f5851f.css delete mode 100644 docs/index.a1f5851f.css.map create mode 100644 docs/index.aff33ac7.js create mode 100644 docs/index.aff33ac7.js.map diff --git a/docs/index.0489cf72.js b/docs/index.0489cf72.js deleted file mode 100644 index a55a634..0000000 --- a/docs/index.0489cf72.js +++ /dev/null @@ -1,44790 +0,0 @@ -// modules are defined as an array -// [ module function, map of requires ] -// -// map of requires is short require name -> numeric require -// -// anything defined in a previous bundle is accessed via the -// orig method which is the require for previous bundles - -(function (modules, entry, mainEntry, parcelRequireName, globalName) { - /* eslint-disable no-undef */ - var globalObject = - typeof globalThis !== 'undefined' - ? globalThis - : typeof self !== 'undefined' - ? self - : typeof window !== 'undefined' - ? window - : typeof global !== 'undefined' - ? global - : {}; - /* eslint-enable no-undef */ - - // Save the require from previous bundle to this closure if any - var previousRequire = - typeof globalObject[parcelRequireName] === 'function' && - globalObject[parcelRequireName]; - - var cache = previousRequire.cache || {}; - // Do not use `require` to prevent Webpack from trying to bundle this call - var nodeRequire = - typeof module !== 'undefined' && - typeof module.require === 'function' && - module.require.bind(module); - - function newRequire(name, jumped) { - if (!cache[name]) { - if (!modules[name]) { - // if we cannot find the module within our internal map or - // cache jump to the current global require ie. the last bundle - // that was added to the page. - var currentRequire = - typeof globalObject[parcelRequireName] === 'function' && - globalObject[parcelRequireName]; - if (!jumped && currentRequire) { - return currentRequire(name, true); - } - - // If there are other bundles on this page the require from the - // previous one is saved to 'previousRequire'. Repeat this as - // many times as there are bundles until the module is found or - // we exhaust the require chain. - if (previousRequire) { - return previousRequire(name, true); - } - - // Try the node require function if it exists. - if (nodeRequire && typeof name === 'string') { - return nodeRequire(name); - } - - var err = new Error("Cannot find module '" + name + "'"); - err.code = 'MODULE_NOT_FOUND'; - throw err; - } - - localRequire.resolve = resolve; - localRequire.cache = {}; - - var module = (cache[name] = new newRequire.Module(name)); - - modules[name][0].call( - module.exports, - localRequire, - module, - module.exports, - this - ); - } - - return cache[name].exports; - - function localRequire(x) { - var res = localRequire.resolve(x); - return res === false ? {} : newRequire(res); - } - - function resolve(x) { - var id = modules[name][1][x]; - return id != null ? id : x; - } - } - - function Module(moduleName) { - this.id = moduleName; - this.bundle = newRequire; - this.exports = {}; - } - - newRequire.isParcelRequire = true; - newRequire.Module = Module; - newRequire.modules = modules; - newRequire.cache = cache; - newRequire.parent = previousRequire; - newRequire.register = function (id, exports) { - modules[id] = [ - function (require, module) { - module.exports = exports; - }, - {}, - ]; - }; - - Object.defineProperty(newRequire, 'root', { - get: function () { - return globalObject[parcelRequireName]; - }, - }); - - globalObject[parcelRequireName] = newRequire; - - for (var i = 0; i < entry.length; i++) { - newRequire(entry[i]); - } - - if (mainEntry) { - // Expose entry point to Node, AMD or browser globals - // Based on https://github.com/ForbesLindesay/umd/blob/master/template.js - var mainExports = newRequire(mainEntry); - - // CommonJS - if (typeof exports === 'object' && typeof module !== 'undefined') { - module.exports = mainExports; - - // RequireJS - } else if (typeof define === 'function' && define.amd) { - define(function () { - return mainExports; - }); - - // - - -

Playground

-
-
-

Axes and Grids

- -
-
-

Scatterplot

- -
-
-

Glyphs

- -
-
-

Vectorplot

- -
-
- - +Threeplot playground and showcase page

Playground

Axes and Grids

Scatterplot

Glyphs

Vectorplot

\ No newline at end of file