Coder Social home page Coder Social logo

higlass-text's Introduction

Display text in HiGlass

Text

Note: This is the source code for the text track only! You might want to check out the following repositories as well:

Installation

npm install higlass-text

Usage

The live script can be found at:

Client

  1. Load this track before the HiGlass core script. For example:
<script src="/higlass-text.js"></script>
<script src="hglib.js"></script>

<script>
  ...
</script>

Options

The following options are available:

 {
  "uid": "texttrack",
  "type": "text",
  "options": {
    "backgroundColor": "#ededed",
    "textColor": "#333333",
    "fontSize": 14,
    "fontFamily": "Arial",
    "fontWeight": "normal",
    "offsetY": 0, // offset from the top of the track
    "align": "left", // left, middle, right
    "text": "Text to display",
  },
  "width": 568,
  "height": 25
},

ECMAScript Modules (ESM)

We also build out ES modules for usage by applications who may need to import or use higlass-text as a component.

Whenever there is a statement such as the following, assuming higlass-text is in your node_modules folder:

import { TextTrack } from 'higlass-text';

Then TextTrack would automatically be imported from the ./es directory (set via package.json's "module" value).

Support

For questions, please either open an issue or ask on the HiGlass Slack channel at http://bit.ly/higlass-slack

Development

Testing

To run the test suite:

npm run test-watch

Installation

$ git clone https://github.com/higlass/higlass-text.git
$ cd higlass-text
$ npm install

If you have a local copy of higlass, you can then run this command in the higlass-text directory:

npm link higlass

Commands

  • Developmental server: npm start
  • Production build: npm run build

higlass-text's People

Contributors

alexander-veit avatar etowahadams avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.