TextRankerJS is a fully client-side JavaScript tool for ranking texts generated by different methods. Designed for human annotation studies, it offers an intuitive drag-and-drop interface, pagination, and local storage for data persistence. Leverage TextRankerJS to streamline your text ranking tasks with ease.
- Fully client-side JavaScript implementation
- Intuitive drag-and-drop interface for ranking texts
- Supports multiple text generation methods
- Pagination for easy navigation through examples
- Local storage to save rankings between sessions
- Export rankings to a JSON file
Try out the TextRankerJS demo here: https://mtreviso.github.io/TextRankerJS/.
If you want to check out the inputtable interface instead, check this link.
To customize TextRankerJS for your specific use case, follow these steps:
- Add or modify examples: Add new examples or modify existing ones in the
js/examples.jsfile. Each example should be an object with keys representing different methods and the texts generated by these methods as their values. Optionally, you can include a "reference" key with the reference text. For example:
const examples = [
{
"reference": "Text generated by a human...",
"methodA": "Text generated by method A...",
"methodB": "Text generated by method B...",
"methodC": "Text generated by method C..."
},
...
];-
Change the page size: To change the number of examples displayed per page, modify the
pageSizevariable in thejs/main.jsfile (default:pageSize = 10). -
Choose between draggable and inputtable interfaces: You can select either a draggable interface (drag and drop to reorder) or an inputtable interface (input numbers to set the ranking). To change the interface, set the
useDraggableInterfacevariable in thejs/main.jsfile totruefor the draggable interface orfalsefor the inputtable interface. -
Shuffle or maintain the order of methods: To shuffle the methods before rendering, set the
shuffleMethodsvariable in thejs/main.jsfile totrue. If you want to maintain the original order of methods as they appear in the examples, set the variable tofalse. -
Control background colors: Set the
colorizeBoxesvariable in thejs/main.jsfile totrueto enable background colors for each box orfalseto disable them. You can further customize the background colors by changing thecolorizePerMethodvariable totrue(one color per method) orfalse(one color per ranking position). -
Show or hide reference texts: To show or hide reference texts in the examples, set the
showReferencesvariable in thejs/main.jsfile totrue(show) orfalse(hide). -
Show or hide the gold label: To toggle the display of gold labels for references, set the
showGoldLabelsflag in thejs/main.jsfile totrue(show) orfalse(hide).
TextRankerJS is released under the MIT License.
