{"id":20660974,"url":"https://github.com/liatemplates/vega","last_synced_at":"2026-03-07T22:05:35.250Z","repository":{"id":107256849,"uuid":"231576837","full_name":"LiaTemplates/Vega","owner":"LiaTemplates","description":"This is a template for integrating Vega visualizations into LiaScript courses.","archived":false,"fork":false,"pushed_at":"2020-12-02T19:36:59.000Z","size":1,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-10T04:29:34.383Z","etag":null,"topics":["liascript","liascript-template","oer","vega","vega-lite"],"latest_commit_sha":null,"homepage":"https://liascript.github.io/course/?https://raw.githubusercontent.com/liaTemplates/vega/master/README.md","language":null,"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/LiaTemplates.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}},"created_at":"2020-01-03T11:48:26.000Z","updated_at":"2024-10-29T15:48:16.000Z","dependencies_parsed_at":null,"dependency_job_id":"d281f804-20be-4e2d-a53a-c98328cee6ad","html_url":"https://github.com/LiaTemplates/Vega","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/LiaTemplates/Vega","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LiaTemplates%2FVega","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LiaTemplates%2FVega/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LiaTemplates%2FVega/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LiaTemplates%2FVega/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/LiaTemplates","download_url":"https://codeload.github.com/LiaTemplates/Vega/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/LiaTemplates%2FVega/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":30233431,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-07T19:01:10.287Z","status":"ssl_error","status_checked_at":"2026-03-07T18:59:58.103Z","response_time":53,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":["liascript","liascript-template","oer","vega","vega-lite"],"created_at":"2024-11-16T19:06:40.755Z","updated_at":"2026-03-07T22:05:35.212Z","avatar_url":"https://github.com/LiaTemplates.png","language":null,"funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003c!--\nauthor:   André Dietrich\n\nemail:    LiaScript@web.de\n\nversion:  0.0.2\n\nlanguage: en\n\nnarrator: US English Male\n\ncomment:  This is a template for integrating Vega visualizations into LiaScript\n          courses. For more information on Vega, visit the project website:\n          https://vega.github.io/vega-lite/examples\n\nscript:   https://cdn.jsdelivr.net/npm/vega@5.9.0\n          https://cdn.jsdelivr.net/npm/vega-lite@4.0.2\n          https://cdn.jsdelivr.net/npm/vega-embed@6.2.1\n\n@Vega.exec: @Vega.exec_(@uid)\n\n@Vega.exec_\n\u003cscript\u003e\n  let vlSpec = @input\n  vegaEmbed('#vis@0', vlSpec);\n  \"LIA: stop\"\n\u003c/script\u003e\n\n\u003cdiv id=\"vis@0\"\u003e\u003c/div\u003e\n\n@end\n\n@Vega.run: @Vega.run_(@uid,```@0```)\n\n@Vega.run_\n\u003cdiv id=\"vis@0\"\u003e\u003c/div\u003e\n\n\u003cscript\u003e\n  setTimeout(function(e) {\n    let vlSpec = @1\n    vegaEmbed('#vis@0', vlSpec)\n  }, 10);\n\n  console.log(\"done\")\n\u003c/script\u003e\n\n@end\n--\u003e\n\n# Vega - Template\n\n                         --{{0}}--\nThis is a template for integrating Vega visualizations into\n[LiaScript](https://liascript.github.io) courses. See the following links for\nfurther information and documentation:\n\n                          {{0-1}}\n* See the Vega docs [here...](https://vega.github.io/vega-lite/example)\n* See the Github version of this document\n  [here...](https://github.com/liaTemplates/vega)\n* See the LiaScript version of this document\n  [here...](https://liascript.github.io/course/?https://raw.githubusercontent.com/liaTemplates/vega/master/README.md)\n\n\n                         --{{1}}--\nThere are three ways to use this template. The easiest way is to use the\n`import` statement and the URL of the raw text-file of the master branch or any\nother branch or version. But you can also copy the required functionality\ndirectly into the header of your Markdown document, see therefor the\n[last slide](#4). And of course, you could also clone this project and change\nit, as you wish.\n\n                           {{1}}\n1. Load the macros via\n\n   `import: https://raw.githubusercontent.com/liaTemplates/vega/master/README.md`\n\n2. Copy the definitions into your Project\n\n3. Clone this repository on GitHub\n\n\n## `@Vega.exec`\n\n                         --{{0}}--\nSimply call the macro `@Vega.exec` below your JSON snippet to make the code\ndirectly executable and editable:\n\n\n```json\n{\n  \"$schema\": \"https://vega.github.io/schema/vega-lite/v4.json\",\n  \"data\": {\"url\": \"https://vega.github.io/vega-lite/examples/data/seattle-weather.csv\"},\n  \"mark\": \"tick\",\n  \"encoding\": {\n    \"x\": {\"field\": \"precipitation\", \"type\": \"quantitative\"}\n  }\n}\n```\n@Vega.exec\n\n---\n\n```json\n{\n  \"$schema\": \"https://vega.github.io/schema/vega-lite/v4.json\",\n  \"data\": {\n    \"values\": [\n      {\"a\": \"C\", \"b\": 2},\n      {\"a\": \"C\", \"b\": 7},\n      {\"a\": \"C\", \"b\": 4},\n      {\"a\": \"D\", \"b\": 1},\n      {\"a\": \"D\", \"b\": 2},\n      {\"a\": \"D\", \"b\": 6},\n      {\"a\": \"E\", \"b\": 8},\n      {\"a\": \"E\", \"b\": 4},\n      {\"a\": \"E\", \"b\": 7}\n    ]\n  },\n  \"mark\": \"bar\",\n  \"encoding\": {\n    \"y\": {\"field\": \"a\", \"type\": \"nominal\"},\n    \"x\": {\n      \"aggregate\": \"average\",\n      \"field\": \"b\",\n      \"type\": \"quantitative\",\n      \"axis\": {\n        \"title\": \"Average of b\"\n      }\n    }\n  }\n}\n```\n@Vega.exec\n\n\n## `@Vega.run`\n\n                         --{{0}}--\nUse `@Vega.run` to immediately render your JSON snippet, without showing its\ncontent to the user. Therefor, simply the macro to the head of your Markdown\nsnippet.\n\n\n```json @Vega.run\n{\n  \"$schema\": \"https://vega.github.io/schema/vega-lite/v4.json\",\n  \"data\": {\"url\": \"https://vega.github.io/vega-lite/examples/data/seattle-weather.csv\"},\n  \"mark\": \"tick\",\n  \"encoding\": {\n    \"x\": {\"field\": \"precipitation\", \"type\": \"quantitative\"}\n  }\n}\n```\n\n---\n\n```json @Vega.run\n{\n  \"$schema\": \"https://vega.github.io/schema/vega-lite/v4.json\",\n  \"data\": {\n    \"values\": [\n      {\"a\": \"C\", \"b\": 2},\n      {\"a\": \"C\", \"b\": 7},\n      {\"a\": \"C\", \"b\": 4},\n      {\"a\": \"D\", \"b\": 1},\n      {\"a\": \"D\", \"b\": 2},\n      {\"a\": \"D\", \"b\": 6},\n      {\"a\": \"E\", \"b\": 8},\n      {\"a\": \"E\", \"b\": 4},\n      {\"a\": \"E\", \"b\": 7}\n    ]\n  },\n  \"mark\": \"bar\",\n  \"encoding\": {\n    \"y\": {\"field\": \"a\", \"type\": \"nominal\"},\n    \"x\": {\n      \"aggregate\": \"average\",\n      \"field\": \"b\",\n      \"type\": \"quantitative\",\n      \"axis\": {\n        \"title\": \"Average of b\"\n      }\n    }\n  }\n}\n```\n\n## Implementation\n\n                         --{{0}}--\nThe delay is currently required, to deal with the loading delay of the all\nJavaScript files. This will be fixed in the next version of LiaScript.\n\n````html\nscript:   https://cdn.jsdelivr.net/npm/vega@5.9.0\n          https://cdn.jsdelivr.net/npm/vega-lite@4.0.2\n          https://cdn.jsdelivr.net/npm/vega-embed@6.2.1\n\n@Vega.exec: @Vega.exec_(@uid)\n\n@Vega.exec_\n\u003cscript\u003e\n  let vlSpec = @input\n  vegaEmbed('#vis@0', vlSpec);\n  \"LIA: stop\"\n\u003c/script\u003e\n\n\u003cdiv id=\"vis@0\"\u003e\u003c/div\u003e\n\n@end\n\n@Vega.run: @Vega.run_(@uid,```@0```)\n\n@Vega.run_\n\u003cdiv id=\"vis@0\"\u003e\u003c/div\u003e\n\n\u003cscript\u003e\n  setTimeout(function(e) {\n    let vlSpec = @1\n    vegaEmbed('#vis@0', vlSpec)\n  }, 1000);\n\u003c/script\u003e\n\n@end\n````\n\n                         --{{1}}--\nIf you want to minimize loading effort in your LiaScript project, you can also\ncopy this code and paste it into your main comment header, see the code in the\nraw file of this document.\n\n{{1}} https://raw.githubusercontent.com/liaTemplates/vega/master/README.md\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fliatemplates%2Fvega","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fliatemplates%2Fvega","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fliatemplates%2Fvega/lists"}