{"id":28157268,"url":"https://github.com/pearmini/apack","last_synced_at":"2025-05-15T08:19:04.315Z","repository":{"id":292662593,"uuid":"959597732","full_name":"pearmini/apack","owner":"pearmini","description":"Write alphabets in the Chinese character style.","archived":false,"fork":false,"pushed_at":"2025-05-11T11:59:28.000Z","size":509,"stargazers_count":0,"open_issues_count":5,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-05-11T12:33:33.309Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://apack.bairui.dev/","language":"JavaScript","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/pearmini.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":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-04-03T03:36:10.000Z","updated_at":"2025-05-11T11:59:30.000Z","dependencies_parsed_at":"2025-05-11T12:43:52.312Z","dependency_job_id":null,"html_url":"https://github.com/pearmini/apack","commit_stats":null,"previous_names":["pearmini/apack"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pearmini%2Fapack","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pearmini%2Fapack/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pearmini%2Fapack/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pearmini%2Fapack/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/pearmini","download_url":"https://codeload.github.com/pearmini/apack/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254301557,"owners_count":22047908,"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":[],"created_at":"2025-05-15T08:16:58.531Z","updated_at":"2025-05-15T08:19:04.296Z","avatar_url":"https://github.com/pearmini.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cimg src=\"./img/poem.png\" /\u003e\n\n# APack: Alphabet Packing Writing System\n\n**APack** is a writing system that explores writing alphabets in a Chinese character style. Instead of placing letters sequentially, APack packs letters for one word into a single grid.\n\nEnglish and Chinese use fundamentally different writing systems. In English or other Latin scripts, letters are pre-defined and arranged in a linear sequence. In contrast, Chinese characters are spatially composed using strokes rather than following a strict left-to-right structure.\n\nWhat if we could write English in a Chinese-style manner—arranging the letters of a word spatially into a single unified character? Potential applications include stamps, wallpapers, concrete poems, icons, and more.\n\n\u003cimg src=\"./img/stamps.png\" width=\"600\"/\u003e\n\n## Get started\n\nYou can create your own piece using the online [APack editor](https://apack.bairui.dev/). If you’d like to use APack in your project, it’s also available as a JavaScript package, just follow the instructions below to get started.\n\n```bash\n$ npm install apackjs -S\n```\n\n```js\nimport * as ap from \"apackjs\";\n\nconst node = ap.text(\"hello world\").render();\n\ndocument.body.append(node);\n```\n\n## API Reference\n\n\u003ca href=\"#ap-text\" id=\"ap-text\"\u003e#\u003c/a\u003e ap.**text**(_content[, options]_)\n\nRenders the given content with optional styling and layout options.\n\n```js\nap.text(\"hello world\");\n```\n\n![example-render-content](./output/renderContent.svg)\n\n\u003ca href=\"#options-cellsize\" id=\"options-cellsize\"\u003e#\u003c/a\u003e options.**cellSize**\n\nSets the size of each cell.\n\n```js\nap.text(\"hello world\", {cellSize: 200});\n```\n\n![example-options-cellsize](./output/optionCellSize.svg)\n\n\u003ca href=\"#options-cellwidth\" id=\"options-cellwidth\"\u003e#\u003c/a\u003e options.**cellWidth**\n\n\u003ca href=\"#options-cellheight\" id=\"options-cellheight\"\u003e#\u003c/a\u003e options.**cellHeight**\n\nSets the dimensions of each cell, defaults to [options.cellSize](#options-cellsize).\n\n```js\nap.text(\"hello world\", {\n  cellWidth: 320,\n  cellHeight: 320,\n  style: {styleBackground: \"#F1BB4D\"},\n  word: {stroke: \"#492577\", strokeWidth: 10},\n  font: \"astrology\",\n});\n```\n\n![example-options-dimension](./output/optionDimensions.svg)\n\n\u003ca href=\"#options-font\" id=\"options-font\"\u003e#\u003c/a\u003e options.**font**\n\nSpecifies the font to use for rendering.\n\n```js\nap.text(\"hello world\", {font: \"astrology\"});\n```\n\n![example-options-font](./output/optionFont.svg)\n\n\u003ca href=\"#options-layout\" id=\"options-layout\"\u003e#\u003c/a\u003e options.**layout**\n\nSet the layout for packing.\n\n```js\nap.text(\"hello world\", {\n  layout: {type: \"treemap\", grid: true},\n});\n```\n\n![example-options-layout](./output/optionLayout.svg)\n\n\u003ca href=\"#options-word\" id=\"options-word\"\u003e#\u003c/a\u003e options.**word**\n\nCustomizes the word styling.\n\n```js\nap.text(\"hello world\", {\n  word: {\n    stroke: \"red\",\n    strokeWidth: 3,\n    fill: \"none\",\n  },\n});\n```\n\n![example-options-word](./output/optionWord.svg)\n\n\u003ca href=\"#options-style\" id=\"options-style\"\u003e#\u003c/a\u003e options.**style**\n\nConfigures the overall style of the output.\n\n```js\nap.text(\"hello world\", {\n  style: {\n    styleBackground: \"red\",\n  },\n});\n```\n\n![example-options-style](./output/optionStyle.svg)\n\n\u003ca href=\"#options-grid\" id=\"options-grid\"\u003e#\u003c/a\u003e options.**grid**\n\nAdds and customizes a grid overlay.\n\n```js\nap.text(\"hello world\", {\n  grid: {\n    stroke: \"#ccc\",\n    fill: \"none\",\n  },\n});\n```\n\n![example-options-grid](./output/optionGrid.svg)\n\n\u003ca href=\"#options-padding\" id=\"options-padding\"\u003e#\u003c/a\u003e options.**padding**\n\nSets the padding around the content.\n\n```js\nap.text(\"hello world\", {padding: 0.2, grid: true});\n```\n\n![example-options-padding](./output/optionPadding.svg)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpearmini%2Fapack","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpearmini%2Fapack","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpearmini%2Fapack/lists"}