{"id":18376895,"url":"https://github.com/bbc/visualise-videocontext","last_synced_at":"2025-04-06T20:31:46.224Z","repository":{"id":22507958,"uuid":"88618528","full_name":"bbc/visualise-videocontext","owner":"bbc","description":"Library to visualise a VideoContext graph","archived":false,"fork":false,"pushed_at":"2024-11-27T15:14:08.000Z","size":7295,"stargazers_count":4,"open_issues_count":39,"forks_count":1,"subscribers_count":24,"default_branch":"master","last_synced_at":"2025-03-18T15:53:31.279Z","etag":null,"topics":["rd-project","rd-section-apmm","rd-stability-yellow","videocontext"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"bsd-3-clause","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/bbc.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","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":"2017-04-18T11:43:38.000Z","updated_at":"2023-05-01T01:41:30.000Z","dependencies_parsed_at":"2024-11-06T00:27:41.672Z","dependency_job_id":null,"html_url":"https://github.com/bbc/visualise-videocontext","commit_stats":{"total_commits":117,"total_committers":7,"mean_commits":"16.714285714285715","dds":"0.23931623931623935","last_synced_commit":"009c7232734542e7496f8449baef7f466ad8aedb"},"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bbc%2Fvisualise-videocontext","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bbc%2Fvisualise-videocontext/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bbc%2Fvisualise-videocontext/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bbc%2Fvisualise-videocontext/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/bbc","download_url":"https://codeload.github.com/bbc/visualise-videocontext/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247547613,"owners_count":20956585,"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":["rd-project","rd-section-apmm","rd-stability-yellow","videocontext"],"created_at":"2024-11-06T00:25:19.652Z","updated_at":"2025-04-06T20:31:44.743Z","avatar_url":"https://github.com/bbc.png","language":"JavaScript","readme":"# Introduction\n\nThis project provides a visualisation of the graph, showing vertices and edges, from a programmatic configuration of [VideoContext](https://github.com/bbc/videocontext).\n\n`visualise-videocontext` is currently receiving maintenance updates but not under active development.\n\n# Example\n\n```js\nimport VideoContext from 'videocontext'\nimport VideoContextVisualisation from 'visualise-videocontext'\n\n// 1. Set up VideoContext graph\nconst vc = new VideoContext(document.getElementById('canvas'))\nconst v1 = vc.video('http://somewebsite.com/some-video.mp4')\nv1.start(0)\nconst eff = vc.effect(VideoContext.DEFINITIONS.MONOCHROME)\nv1.connect(eff)\neff.connect(vc.destination)\nvc.play()\n\n// 2. Visualise VideoContext graph\n\nconst div = document.getElementById('vis')\n// eg \u003cdiv id=\"vis\"\u003e\u003c/div\u003e with width and height set in css.\n\nconst vis = new VideoContextVisualisation(div)\n\nvis.setData(VideoContext.snapshot(vc))\nvis.render()\n\n// Update regularly - could also use VideoContext's built-in callbacks to trigger this.\nsetInterval(() =\u003e {\n    vis.setData(VideoContext.snapshot(vc))\n    // No need to call render() a second time\n}, 100)\n```\n\n# Development\nDo not use yarn! When you run `yarn` it seems to install dependencies incorrectly. I'm not sure what's causing this, but just use npm, at least for installing dependencies.\n\nHowever it *is* totally fine to use yarn in projects that include `visualise-videocontext` as a dependency.\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbbc%2Fvisualise-videocontext","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbbc%2Fvisualise-videocontext","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbbc%2Fvisualise-videocontext/lists"}