Generate a Rectangular Grid

kohonen-stars github is an example for our library kohonen github , a basic implementation of SOM algorithm in JavaScript.

Based on Nicolas Mondon's src/hexagon.ts , we generate a rectangular grid of sizeX * sizeY hexagonal neurons with normalized euclidian distance of 1 between each neighbor:

pages/generate-a-rectangular-grid

I've forked grid.html, created svg from pos data, assigned random colors, and added a click hander to create a ghost page. github >> script click ghost

http://ward.dojo.fed.wiki/assets/pages/generate-a-rectangular-grid/grid.html HEIGHT 333

We fix the message: "_ is not defined":

[…] return _.flatten( _.range(0, sizeY) .map(y => y * stepY) .map(y => y + margin) .map((y, i) => generateRow(y, i)) ); […]

by importing _ from Lodash. site , cdn

<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.21/lodash.min.js" integrity="sha256-qXBd/EfAdjOA2FGrGAG+b3YBn2tn5A6bhz+LSgYD96k=" crossorigin="anonymous"></script>

or

import _ from 'lodash/fp';

~

Often an layout engine places nodes on undesired locations. Weighted invisible edges allow to manipulate nodes location. This graph defines rigid grid of heavy weighted nodes and arbitrary path on the grid. You can rename and hide nodes to have graph which looks like matrix or table. graphviz

~

TypeScript mdn , site , support for Sublime github

JavaScript code is valid TypeScript code; TypeScript is a superset of JavaScript. You can rename most of your .js files to .ts files and they will just work. Our TypeScript code will be able to run everywhere JavaScript can run. How is that possible? TypeScript "transpiles" our code to vanilla JavaScript. That means that it parses TypeScript code and produces the equivalent vanilla JavaScript code for browsers to run.

Defining Types typescriptlang

You can explicitly describe an object’s shape using an interface declaration:

interface Neuron { pos: [number, number]; v?: number[]; } export { Neuron };

You can then declare that a JavaScript object conforms to the shape of your new interface by using syntax like : TypeName after a variable declaration:

// generate a rectangular grid of sizeX * sizeY hexagonal neurons // with normalized euclidian distance of 1 between each neighbor const generateGrid = (sizeX, sizeY): Neuron[] => { […]

A simple guide to “interface” data type in TypeScript post

Optional Properties: An interface can contain optional properties and we use ?:Type annotation to represent them, just like the optional function parameters.

Lodash site , fp github

Deno: Using npm packages with CDNs page

Overview of TypeScript in Deno page