{"id":13468258,"url":"https://github.com/dy/linefont","last_synced_at":"2025-04-06T13:09:13.365Z","repository":{"id":66081313,"uuid":"343425955","full_name":"dy/linefont","owner":"dy","description":"Font for rendering line chart data","archived":false,"fork":false,"pushed_at":"2023-10-29T13:30:17.000Z","size":4773,"stargazers_count":307,"open_issues_count":1,"forks_count":4,"subscribers_count":6,"default_branch":"main","last_synced_at":"2024-05-02T00:03:53.170Z","etag":null,"topics":["datavis","line-chart","opentype","truetype","waveform"],"latest_commit_sha":null,"homepage":"https://dy.github.io/linefont/scripts","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"ofl-1.1","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/dy.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,"governance":null,"roadmap":null,"authors":"AUTHORS.txt"}},"created_at":"2021-03-01T13:28:18.000Z","updated_at":"2024-04-12T18:17:21.000Z","dependencies_parsed_at":null,"dependency_job_id":"f400b570-320c-4915-a4ee-c5de5b427bc7","html_url":"https://github.com/dy/linefont","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dy%2Flinefont","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dy%2Flinefont/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dy%2Flinefont/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dy%2Flinefont/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dy","download_url":"https://codeload.github.com/dy/linefont/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247485287,"owners_count":20946398,"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":["datavis","line-chart","opentype","truetype","waveform"],"created_at":"2024-07-31T15:01:07.764Z","updated_at":"2025-04-06T13:09:13.327Z","avatar_url":"https://github.com/dy.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# linefont [![build](https://github.com/dy/linefont/actions/workflows/build.yaml/badge.svg)](https://github.com/dy/linefont/actions/workflows/build.yaml)\n\nTypeface for rendering small/medium-scale line charts (eg. time series).\n\n\u003cimg width=\"151\" alt=\"image\" src=\"https://github.com/dy/linefont/assets/300067/32827572-d01b-489e-b949-e1454640c3c9\"\u003e\n\n[**Demo**](https://dy.github.io/linefont/scripts)\u0026nbsp;\u0026nbsp;•\u0026nbsp;\u0026nbsp;[**Google fonts**](https://fonts.google.com/specimen/Linefont/tester?query=linefont)\u0026nbsp;\u0026nbsp;•\u0026nbsp;\u0026nbsp;[**V-fonts**](https://v-fonts.com/fonts/linefont)\u0026nbsp;\u0026nbsp;•\u0026nbsp;\u0026nbsp;[**Test**](https://dy.github.io/linefont/out/fontbakery/fontbakery-report)\n\n\n## Usage\n\nPut [Linefont[wdth,wght].woff2](./fonts/variable/Linefont[wdth,wght].woff2) into your project directory and use this code:\n\n```html\n\u003cstyle\u003e\n@font-face {\n\tfont-family: linefont;\n\tfont-display: block;\n\tsrc: url(./Linefont[wdth,wght].woff2) format('woff2');\n}\n.linefont {\n\t--wght: 200;\n\t--wdth: 50;\n\tfont-family: linefont;\n\tfont-variation-settings: 'wght' var(--wght), 'wdth' var(--wdth);\n\tline-height: 1.4; /* match selection, optional */\n}\n\u003c/style\u003e\n\n\u003c!-- Set values manually --\u003e\n\u003ctextarea id=\"linefont\" class=\"linefont\" cols=\"100\"\u003e\nabcdefghijklmnopqrstuvwwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ\n\u003c/textarea\u003e\n\n\u003cscript\u003e\n// Set values programmatically (more precise)\nlinefont.textContent = Array.from({length: 127}, (_,i) =\u003e String.fromCharCode(0x100 + i)).join('')\n\u003c/script\u003e\n```\n\n## Ranges\n\nLinefont values span from 0 to 100, assigned to different characters:\n\n* \u003ckbd\u003e0-9\u003c/kbd\u003e chars for simplified manual input with step 10 (height = number×10).\n* \u003ckbd\u003ea-zA-Z\u003c/kbd\u003e for manual input with step 2, softened at edges \u003ckbd\u003ea\u003c/kbd\u003e and \u003ckbd\u003eZ\u003c/kbd\u003e (height = number of letter).\n* \u003ckbd\u003eU+0100-017F\u003c/kbd\u003e for 0-127 values with step 1 (extra 27 values).\n\n\n## Variable Axes\n\nTag | Range | Meaning\n---|---|---\n`wght` | _1_-_1000_ | Line thickness (quarter upms, linear).\n`wdth` | _25_-_200_ | Width of the font (ie. zoom of the signal).\n\n\n## Features\n\n* Ranges, values and weight is compatible with [wavefont](https://github.com/dy/wavefont), so fonts can be swapped at `wdth=100`, preserving visual coherency.\n* Visible charcodes fall under _marking characters_ unicode category, ie. recognized as word by regexp and can be selected with \u003ckbd\u003eCtrl\u003c/kbd\u003e + \u003ckbd\u003e→\u003c/kbd\u003e or double click. Eg. segments separated by ` ` or `-` are selectable by double click.\n* Characters outside of visible ranges (but within Core Latin) are clipped to _0_, eg. ` `, `\\t` etc.\n* Caret span is -20..120, so line-height = 1.4 is minimal non-overlapping selection.\n\n## npm package\n\n_Linefont_ npm package contains the font and a js function that produces font string from values.\n\n```js\nimport lf from 'linefont'\n\n// get characters for values from 0..127 range\nlf(0, 1, 50, 99, 127, ...) // ĀāIJţŤ...\n```\n\n## Building\n\n`make build`\n\n* [Tests](https://dy.github.io/linefont/out/fontbakery/fontbakery-report)\n* [Glyphs](https://dy.github.io/linefont/out/proof/glyphs)\n* [Text](https://dy.github.io/linefont/out/proof/text)\n* [Waterfall](https://dy.github.io/linefont/out/proof/waterfall)\n\n## Troubleshooting\n\n* The font requires ligatures (`rlig`) enabled for it to be properly rendered. Some environments (eg. MS Word) may not have it enabled by default, in this case enable \"All Ligatures\" in advance font parameters.\n\n## See also\n\n* [wavefont](https://github.com/dy/wavefont) − font-face for rendering waveforms.\n\n\u003cp align=\"center\"\u003e\u003ca href=\"https://github.com/krishnized/license/\"\u003e🕉\u003c/a\u003e\u003cp\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdy%2Flinefont","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdy%2Flinefont","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdy%2Flinefont/lists"}