{"id":21662804,"url":"https://github.com/higlass/higlass-barbell","last_synced_at":"2026-05-08T08:32:59.974Z","repository":{"id":39924685,"uuid":"395880107","full_name":"higlass/higlass-barbell","owner":"higlass","description":null,"archived":false,"fork":false,"pushed_at":"2022-05-21T03:13:00.000Z","size":1406,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-01-25T07:27:32.523Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/higlass.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2021-08-14T03:49:06.000Z","updated_at":"2022-05-13T04:36:11.000Z","dependencies_parsed_at":"2022-08-25T02:52:02.101Z","dependency_job_id":null,"html_url":"https://github.com/higlass/higlass-barbell","commit_stats":null,"previous_names":[],"tags_count":7,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/higlass%2Fhiglass-barbell","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/higlass%2Fhiglass-barbell/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/higlass%2Fhiglass-barbell/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/higlass%2Fhiglass-barbell/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/higlass","download_url":"https://codeload.github.com/higlass/higlass-barbell/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244560373,"owners_count":20472219,"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":"2024-11-25T10:18:08.978Z","updated_at":"2026-05-08T08:32:54.929Z","avatar_url":"https://github.com/higlass.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Barbell Track for HiGlass\n\n\u003e Display BEDPE data as barbells (two filled regions joined by a line)\n\n[![HiGlass](https://img.shields.io/badge/higlass-😍-red.svg?colorB=7fb4ff\u0026style=flat-square)](http://higlass.io)\n[![npm version](https://img.shields.io/npm/v/higlass-arcs.svg?color=7f94ff\u0026style=flat-square)](https://www.npmjs.com/package/higlass-barbell)\n[![gzipped size](https://img.badgesize.io/https:/unpkg.com/higlass-arcs/dist/higlass-arcs.min.js?color=e17fff\u0026compression=gzip\u0026style=flat-square)](https://bundlephobia.com/result?p=higlass-arcs)\n[![code style prettier](https://img.shields.io/badge/code_style-prettier-f57bf5.svg?style=flat-square)](https://github.com/prettier/prettier)\n\n![Screenshot of the barbell track](https://user-images.githubusercontent.com/2143629/129492480-9a879bd6-deae-4cd6-9c36-10288c2bcbaf.png 'An example of the barbell track')\n\n**Note**: This is the source code for the barbell track only! You might want to check out the following repositories as well:\n\n- HiGlass viewer: https://github.com/higlass/higlass\n- HiGlass server: https://github.com/higlass/higlass-server\n- HiGlass docker: https://github.com/higlass/higlass-docker\n\n## Installation\n\n```\nnpm install higlass-barbell\n```\n\n## Usage\n\nThe live script can be found at:\n\n- https://unpkg.com/higlass-barbell/dist/higlass-barbell.min.js\n\n1. Make sure you load this track prior to `hglib.min.js`. For example:\n\n```html\n\u003cscript src=\"higlass-barbell.min.js\"\u003e\u003c/script\u003e\n\u003cscript src=\"hglib.min.js\"\u003e\u003c/script\u003e\n\u003cscript\u003e\n  ...\n\u003c/script\u003e\n```\n\nIf you build a custom React application, import `higlass-barbell` in your `index.js` as follows:\n\n```javascript\nimport 'higlass-barbell'; // This import is all you have to do\n\nimport React from 'react';\nimport ReactDOM from 'react-dom';\n\nimport App from './App';\n\nReactDOM.render(\u003cApp /\u003e, document.getElementById('root'));\n```\n\n2. Now, configure the track in your view config and be happy! Cheers 🎉\n\n```javascript\n{\n  ...\n  {\n    server: 'http://localhost:8001/api/v1',\n    tilesetUid: 'my-aggregated-bedfile.bedpe',\n    uid: 'some-uid',\n    type: 'barbell',\n    options: {\n      ...\n    },\n  },\n  ...\n}\n```\n\nTake a look at [`src/index.html`](src/index.html) for an example.\n\n\n### Expected data\n\nThis track expects bedpe style data served from either a higlass server or [local tile values](https://docs.higlass.io/view_config.html#raw-tile-values). If local tiles are provided, you can set the following extra properties in each data object:\n\n- mouseOver - Text that should appear when the mouse hovers or a barbell\n- strokeWidth - The width of the outline of each barbell\n- strokeColor - The color of the outline of each barbell\n- strokeOpacity - The opacity of the outline of each barbell\n- color - The fill color of each barbell\n\n```json\n    {\n      \"uid\": 1,\n      \"fill\": \"red\",\n      \"strokeWidth\": 3,\n      \"strokeColor\": \"black\",\n      \"strokeOpacity\": 1,\n      \"xStart\": 412232865,\n      \"xEnd\": 412239391,\n      \"yStart\": 412337941,\n      \"yEnd\": 412351977,\n      \"xChrOffset\": 377585195,\n      \"yChrOffset\": 377585195,\n      \"importance\": 0.8289870449281151,\n      \"mouseOver\": \"\u003cb\u003ethere\u003c/b\u003e\",\n      \"fields\": [\n        \"chr3\",\n        34637670,\n        34644196,\n        \"chr3\",\n        34742746,\n        34756782\n      ]\n    }\n```\n\n## Development\n\n### Installation\n\n```bash\n$ git clone https://github.com/higlass/higlass-barbell \u0026\u0026 higlass-barbell\n$ npm install\n```\n\n### Commands\n\n**Developmental server**: `npm start`\n**Production build**: `npm run build`\n**Deploy demo**: `npm run deploy`\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhiglass%2Fhiglass-barbell","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fhiglass%2Fhiglass-barbell","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fhiglass%2Fhiglass-barbell/lists"}