{"id":19479503,"url":"https://github.com/alesgenova/colormap","last_synced_at":"2025-04-25T15:31:12.669Z","repository":{"id":39747769,"uuid":"183956319","full_name":"alesgenova/colormap","owner":"alesgenova","description":"A flexible library to map numerical values to colors","archived":false,"fork":false,"pushed_at":"2023-01-06T01:49:23.000Z","size":1778,"stargazers_count":12,"open_issues_count":23,"forks_count":2,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-04-18T19:52:01.996Z","etag":null,"topics":["color-mapping","colormap","colors","javascript","matplotlib","opacity-mapping","scientific-visualization","typescript","viridis","visualization"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/alesgenova.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-04-28T20:37:03.000Z","updated_at":"2024-09-18T08:03:37.000Z","dependencies_parsed_at":"2023-02-05T02:00:29.491Z","dependency_job_id":null,"html_url":"https://github.com/alesgenova/colormap","commit_stats":null,"previous_names":[],"tags_count":8,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alesgenova%2Fcolormap","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alesgenova%2Fcolormap/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alesgenova%2Fcolormap/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/alesgenova%2Fcolormap/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/alesgenova","download_url":"https://codeload.github.com/alesgenova/colormap/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250844258,"owners_count":21496536,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["color-mapping","colormap","colors","javascript","matplotlib","opacity-mapping","scientific-visualization","typescript","viridis","visualization"],"created_at":"2024-11-10T19:55:48.494Z","updated_at":"2025-04-25T15:31:12.210Z","avatar_url":"https://github.com/alesgenova.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"[![CircleCI](https://circleci.com/gh/alesgenova/colormap/tree/master.svg?style=shield)](https://circleci.com/gh/alesgenova/colormap/tree/master)\n[![codecov](https://codecov.io/gh/alesgenova/colormap/branch/master/graph/badge.svg)](https://codecov.io/gh/alesgenova/colormap)\n[![Language grade: JavaScript](https://img.shields.io/lgtm/grade/javascript/g/alesgenova/colormap.svg)](https://lgtm.com/projects/g/alesgenova/colormap/context:javascript)\n[![lerna](https://img.shields.io/badge/maintained%20with-lerna-cc00ff.svg)](https://lerna.js.org/)\n\n# ColorMap\nA flexible library to map numerical values to colors\n\n\u003cimg src='img/demo.png'/\u003e\n\n## Packages\n| Package | Version | Description |\n| ------- | ------- |:-----:|\n| [`@colormap/core`](packages/core) | [![npm package](https://img.shields.io/npm/v/@colormap/core.svg)](https://www.npmjs.com/package/@colormap/core) | Core functions and utilities\n| [`@colormap/presets`](packages/presets) | [![npm package](https://img.shields.io/npm/v/@colormap/presets.svg)](https://www.npmjs.com/package/@colormap/presets) | Popular predefined colormaps\n\n## Install\nInstall the `@colormap/core` package\n```\nnpm install @colormap/core\n```\n\nOptionally install `@colormap/preset` to have popular colormaps from [matplotlib](https://matplotlib.org/tutorials/colors/colormaps.html) readily available\n```\nnpm install @colormap/preset\n```\n\n## Basic Usage\n```javascript\nimport { createColorMap, createOpacityMap, createColorOpacityMap, linearScale } from \"@colormap/core\";\n\nlet colors = [\n  [1, 0, 0],\n  [0, 1, 0],\n  [0, 0, 1]\n];\nlet opacities = [1, 0, 1];\nlet domain = [0, 100];\nlet range = [0, 1];\nlet scale = linearScale(domain, range);\nlet colorMap = createColorMap(colors, scale);\nlet opacityMap = createOpacityMap(opacities, scale);\nlet colorOpacityMap = createColorOpacityMap(colorMap, opacityMap);\nlet values = [0, 25, 50, 75, 100];\nconsole.log(values.map(v =\u003e colorMap(v)));\n// [[1, 0, 0], [0.5, 0.5, 0], [0, 1, 0], [0, 0.5, 0.5], [0, 0, 1]]\nconsole.log(values.map(v =\u003e opacityMap(v)));\n// [1, 0.5, 0, 0.5, 1]\nconsole.log(values.map(v =\u003e colorOpacityMap(v)));\n// [[1, 0, 0, 1], [0.5, 0.5, 0, 0.5], [0, 1, 0, 0], [0, 0.5, 0.5, 0.5], [0, 0, 1, 1]]\n```\n\n## Advanced Usage\n### Specify color/opacity maps by arbitrary nodes\nColors and opacities array don't necessarily need to span evenly the `[0, 1]` interval.\nMaps can be generated from arbitrary nodes.\n```javascript\nimport { createColorMap, linearScale } from \"@colormap/core\";\n\nlet colors = [\n  { value: -1.0, mapped: [0, 0, 1] },\n  { value: 0.0, mapped: [1, 0, 0] },\n  { value: 0.5, mapped: [0, 1, 0] },\n  { value: 2.0, mapped: [0, 0, 1] }\n];\nlet domain = [0, 100];\nlet range = [-1, 2];\nlet scale = linearScale(domain, range);\nlet colorMap = createColorMap(colors, scale);\nlet values = [0, 25, 50, 75, 100];\nconsole.log(values.map(v =\u003e colorMap(v)));\n// [[0, 0, 1], [0.75, 0, 0.25], [0, 1, 0], [0, 0.5, 0.5], [0, 0, 1]]\n```\n\n### Node Mixers\nWhen the scalar value is between two colormap nodes, we can have several strategies to mix the colors in the two nodes. By default a linear interpolation between nodes will be done. But this behavior can be overridden by passing a function as a third parameter to `createColorMap(colors, scale, mixer)`.\n\nThe signature of the mixer function is: `function(value: number, lowerNodeValue: number, upperNodeValue: number) : [number, number]`.\n\nFour mixers are provided for convenience.\n```javascript\nimport { linearMixer, roundMixer, floorMixer, ceilMixer } from '@colormap/core';\n\nlet colors = [[1, 0, 0], [1, 1, 0], [0, 1, 0], [0, 1, 1], [0, 0, 1]];\nlet scale = linearScale([0, 1], [0, 1]);\nlet colorMap = createColorMap(colors, scale, linearMixer);\n```\nBelow is the effect these mixers have on the same 5-node colormap:\n- `linearMixer` (default)\n\u003cimg src='img/linear_mixer.png'/\u003e\n\n- `roundMixer`\n\u003cimg src='img/round_mixer.png'/\u003e\n\n- `floorMixer`\n\u003cimg src='img/floor_mixer.png'/\u003e\n\n- `ceilMixer`\n\u003cimg src='img/ceil_mixer.png'/\u003e\n\n## Preset Colormaps\nA set of popular colormaps from `matplotlib` are exported by the `@colormap/presets` package.\n```javascript\nimport { createColorMap, linearScale } from \"@colormap/core\";\nimport { viridis, cividis, plasma, inferno, magma, blackWhite } from \"@colormap/presets\";\n\nlet scale = linearScale([0, 100], [0, 1]);\nlet colorMap = createColorMap(viridis, scale);\nconsole.log([0, 100].map(v =\u003e colorMap(v)));\n// [[0.267004, 0.004874, 0.329415], [0.993248, 0.906157, 0.143936]]\n```\n\n- `viridis`\n\u003cimg src='img/viridis.png'/\u003e\n\n- `cividis`\n\u003cimg src='img/cividis.png'/\u003e\n\n- `plasma`\n\u003cimg src='img/plasma.png'/\u003e\n\n- `inferno`\n\u003cimg src='img/inferno.png'/\u003e\n\n- `magma`\n\u003cimg src='img/magma.png'/\u003e\n\n- `blackWhite`\n\u003cimg src='img/blackWhite.png'/\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falesgenova%2Fcolormap","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Falesgenova%2Fcolormap","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falesgenova%2Fcolormap/lists"}