-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
12 changed files
with
518 additions
and
94 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,155 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
|
|
||
| <head> | ||
| <title>Numpy JS Demo 2</title> | ||
| <meta charset="utf-8"> | ||
| <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"> | ||
|
|
||
| <script src="https://d3js.org/d3.v7.min.js"></script> | ||
| <script src="https://cdn.jsdelivr.net/npm/@observablehq/plot@0.6/dist/plot.umd.min.js"></script> | ||
| <script src="dist/caph1993-numpy-js.js"></script> | ||
|
|
||
| <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> | ||
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.0/codemirror.min.css"> | ||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.0/codemirror.min.js"></script> | ||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.62.0/mode/javascript/javascript.min.js"></script> | ||
| <script> | ||
| var __console_log = console.log; | ||
| var __log_elem = null; | ||
| console.log = (...args) => { | ||
| __console_log(...args); | ||
| if (__log_elem !== null) { | ||
| $(__log_elem).append(args.join(' ') + '\n'); | ||
| } | ||
| } | ||
| </script> | ||
| <style> | ||
| .hbox { | ||
| display: flex; | ||
| flex-direction: row; | ||
| justify-content: space-between; | ||
| } | ||
| .vbox { | ||
| display: flex; | ||
| flex-direction: column; | ||
| justify-content: space-between; | ||
| } | ||
| body{ | ||
| display: flex; | ||
| flex-direction: row; | ||
| flex-wrap: wrap; | ||
| font-family: 'Courier New', Courier, monospace; | ||
| } | ||
| .justify-start { | ||
| justify-content: flex-start; | ||
| } | ||
| h3{ | ||
| margin: 0; | ||
| } | ||
| </style> | ||
| </head> | ||
|
|
||
| <body> | ||
| <div class="vbox" style="width:100%"> | ||
| <h1>Demo of caph1993-numpy-js</h1> | ||
|
|
||
| <h3>Header:</h3> | ||
| <div style="border: solid 1px black; height: fit-content;"> | ||
| <textarea id="codeHeader" disabled="true" style="width: 90vw; height:6.5em"></textarea> | ||
| <script> | ||
| (()=>{ | ||
| $('#codeHeader').text(` | ||
| ${'<'}script src="https://d3js.org/d3.v7.min.js">${'<'}/script> | ||
| ${'<'}script src="dist/caph1993-numpy-js.js">${'<'}/script> | ||
| // Or | ||
| let d3 = require('d3'); | ||
| let np = require('caph1993-numpy-js'); | ||
| `.trim()); | ||
| })() | ||
| </script> | ||
| </div> | ||
| <h3>Your code (modify at will):</h3> | ||
| <div style="border: solid 1px black; height: fit-content;"> | ||
| <textarea id="codeInput" style="height: fit-content !important;"> | ||
| // Part 1: data creation | ||
|
|
||
| var XY = np.random.randn([1000, 2]) | ||
| var norm = XY.pow(2).sum({ axis: -1, keepdims: true }).pow(0.5) | ||
| var XY_unit = XY.op('/', norm); | ||
|
|
||
| console.log(`First five points:\n${XY.index(`0:5`)}`); | ||
| console.log(`Norm of the first five points (before and after):`); | ||
| console.log(np.stack([norm.index(':', 0), XY_unit.norm(-1)], -1).index(`0:5`)); | ||
|
|
||
| var svg = Plot.plot({ | ||
| grid: true, | ||
| aspectRatio: 1, // undefined | ||
| marks: [ | ||
| Plot.dot(XY.tolist().map(([x,y])=>({x, y})), {x: "x", y: "y", r:1, fill:"#69b369"}), | ||
| Plot.dot(XY_unit.tolist().map(([x,y])=>({x, y})), {x: "x", y: "y", r:1, fill:"#b36969"}), | ||
| ] | ||
| }); | ||
| $(document.body).append(svg); | ||
|
|
||
| </textarea> | ||
| </div> | ||
| <div class="hbox" style="width:100%"> | ||
| <div></div> | ||
| <button onclick="executeCode()" style="padding:1em; margin:1em; font-size: large;">Execute</button> | ||
| <div></div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <div class="vbox justify-start"> | ||
| <div class="vbox"> | ||
| <h3>Errors:</h3> | ||
| <textarea disabled="true" id="stderr" cols="50" style="border:none; min-height: 20vh;"> | ||
| (error logs will appear here) | ||
| </textarea> | ||
| </div> | ||
| <div class="vbox"> | ||
| <h3>Console output:</h3> | ||
| <textarea disabled="true" id="stdout" cols="50" style="border:none; min-height: 20vh;"> | ||
| (console.log logs will appear here) | ||
| </textarea> | ||
| </div> | ||
| </div> | ||
| <script> | ||
| $('#stderr').parent().hide(); | ||
| var codeInput = document.getElementById("codeInput"); | ||
| var codeEditor = CodeMirror.fromTextArea(codeInput, { | ||
| mode: "javascript", | ||
| lineNumbers: true, | ||
| theme: "default", | ||
| autoCloseBrackets: true, | ||
| matchBrackets: true, | ||
| height: '60vh', | ||
| }); | ||
|
|
||
| function executeCode() { | ||
| var code = codeEditor.getValue(); | ||
| $('svg').remove(); | ||
| $('#stdout').html(''); | ||
| $('#stderr').html(''); | ||
| $('#stderr').parent().hide(); | ||
| __log_elem = $('#stdout'); | ||
| try{ | ||
| eval(code); | ||
| } catch(e){ | ||
| $('#stderr').parent().show(); | ||
| $('#stderr').append(e.stack) | ||
| $('#stderr').append('Press F12 for more details') | ||
| throw e; | ||
| } | ||
| } | ||
| </script> | ||
| <!-- <div id="myplot"></div> --> | ||
| <script> | ||
| // const plot = Plot.rectY({length: 10000}, Plot.binX({y: "count"}, {x: Math.random})).plot(); | ||
| // const div = document.querySelector("#myplot"); | ||
| // div.append(plot); | ||
| </script> | ||
| </body> | ||
|
|
||
| </html> |
Large diffs are not rendered by default.
Oops, something went wrong.
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,61 @@ | ||
| import { NDArray } from "../NDArray-class"; | ||
|
|
||
| export type AxisArg = null | number; | ||
|
|
||
| export type ReduceKwargs = { axis?: number, keepdims?: boolean }; | ||
| export type ReduceSignature<T = number> = (axis?: AxisArg | ReduceKwargs, keepdims?: boolean | ReduceKwargs) => NDArray | T; | ||
| export type ReduceSignatureBool = ReduceSignature<boolean>; | ||
| export type ReduceParsedKwargs = [number, boolean]; | ||
|
|
||
| export type ReduceStdKwargs = { axis?: number, keepdims?: boolean, ddof?: number }; | ||
| export type ReduceStdSignature = (axis?: AxisArg | ReduceStdKwargs, keepdims?: boolean | ReduceStdKwargs, ddof?: number | ReduceStdKwargs) => NDArray | number; | ||
| export type ReduceStdParsedKwargs = [number, boolean, number]; | ||
|
|
||
| export type ReduceNormKwargs = { axis?: number, keepdims?: boolean, ord?: number }; | ||
| export type ReduceNormSignature = (axis?: AxisArg | ReduceNormKwargs, keepdims?: boolean | ReduceNormKwargs, ord?: number | ReduceNormKwargs) => NDArray | number; | ||
| export type ReduceNormParsedKwargs = [number, boolean, number]; | ||
|
|
||
|
|
||
| export type RoundKwargs = { decimals?: number }; | ||
| export type RoundSignature = (decimals?: number) => NDArray; | ||
| export type RoundParsedKwargs = [number]; | ||
|
|
||
| type WithArray<Signature extends (...args: any[]) => any> = (arr: NDArray, ...args: Parameters<Signature>) => ReturnType<Signature>; | ||
|
|
||
| export class KwParser<Signature extends (...args: any[]) => any, Parsed extends any[]> { | ||
| defaults: [string, any][]; | ||
|
|
||
| constructor(defaults: [string, any][]) { | ||
| this.defaults = defaults; | ||
| } | ||
|
|
||
| parse(...args: Parameters<Signature>): Parsed { | ||
| let defaults = this.defaults; | ||
| let kwargs = Object.assign(Object.fromEntries(defaults)); | ||
| for (let i = 0; i < args.length; i++) { | ||
| let value = args[i]; | ||
| if (value instanceof Object) Object.assign(kwargs, value); | ||
| else if (value !== undefined) kwargs[defaults[i][0]] = value; | ||
| } | ||
| let sortedArgs = defaults.map(([key, _]) => kwargs[key]); | ||
| return sortedArgs as Parsed; | ||
| } | ||
|
|
||
| decorator_func<F extends (arr: NDArray, ...args: Parsed) => ReturnType<Signature>>(func: F): WithArray<Signature> { | ||
| return function (arr: NDArray, ...args: Parameters<Signature>) { | ||
| const parsed = this.parse(...args); | ||
| return func(arr, ...parsed); | ||
| }; | ||
| } | ||
|
|
||
| decorator_method<F extends (arr: NDArray, ...args: Parsed) => ReturnType<Signature>>(func: F): Signature { | ||
| let self = this; | ||
| return function (...args: Parameters<Signature>) { | ||
| const parsed = self.parse(...args); | ||
| return func(this, ...parsed); | ||
| } as any; | ||
| } | ||
| decorators<F extends (arr: NDArray, ...args: Parsed) => ReturnType<Signature>>(func: F) { | ||
| return { as_function: this.decorator_func(func), as_method: this.decorator_method(func) }; | ||
| } | ||
| } |
Oops, something went wrong.