Members
(constant) CopyShader
Full-screen textured quad shader
.- Description:
Full-screen textured quad shader
- Source:
Full-screen textured quad shader
(constant) HEX_CHARS
.- Description:
- Source:
- Version:
- 0.10.1
- Copyright:
- Chen, Yi-Cyuan 2014-2023
- License:
- MIT
(constant) LuminosityHighPassShader
Luminosity http://en.wikipedia.org/wiki/Luminosity
.- Description:
Luminosity http://en.wikipedia.org/wiki/Luminosity
- Source:
Luminosity http://en.wikipedia.org/wiki/Luminosity
(constant) __4294967296
© 2016 Nathan Rugg nmrugg@gmail.com Code extracted from https://github.com/LZMA-JS/LZMA-JS
.- Description:
© 2016 Nathan Rugg nmrugg@gmail.com Code extracted from https://github.com/LZMA-JS/LZMA-JS
- Source:
© 2016 Nathan Rugg nmrugg@gmail.com Code extracted from https://github.com/LZMA-JS/LZMA-JS
(constant) version
version id and date
- Description:
Produced by concatenation of
version_id
andversion_date
Like '7.0.0 14/04/2022'
- Source:
Produced by concatenation of version_id
and version_date
Like '7.0.0 14/04/2022'
(constant) version_date
version date
Release date in format day/month/year like '14/04/2022'
(constant) version_id
version id
- Description:
For the JSROOT release the string in format 'major.minor.patch' like '7.0.0'
- Source:
For the JSROOT release the string in format 'major.minor.patch' like '7.0.0'
Methods
(protected) addDrawFunc(args)
Register draw function for the class
- Description:
List of supported draw options could be provided, separated with ';'
- Source:
Parameters:
Name | Type | Description | ||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
args |
object | arguments Properties
|
addUserStreamer()
Add custom streamer
binl2rstr(input) → {string}
Convert an array of little-endian words to a string
.- Description:
Convert an array of little-endian words to a string
- Source:
Parameters:
Name | Type | Description |
---|---|---|
input |
Array.<number> | MD5 Array |
Returns:
MD5 string
- Type
- string
build(obj, optopt) → {object}
Build three.js model for given geometry object
- Source:
Example
import { build } from 'https://root.cern/js/latest/modules/geom/TGeoPainter.mjs';
let obj3d = build(obj);
// this is three.js object and can be now inserted in the scene
Parameters:
Name | Type | Attributes | Description | |||||||||||||||||||||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
obj |
Object | TGeo-related object |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||
opt |
Object |
<optional> |
options Properties
|
Returns:
Object3D with created model
- Type
- object
(async) buildGUI(gui_element, gui_kind) → {Promise}
Build main GUI
Example
import { buildGUI } from 'https://root.cern/js/latest/modules/gui.mjs';
buildGUI('guiDiv');
Parameters:
Name | Type | Description |
---|---|---|
gui_element |
String | id of the |
gui_kind |
String | either 'online', 'nobrowser', 'draw' |
Returns:
with HierarchyPainter
instance
- Type
- Promise
cleanup(dom)
Safely remove all drawings from specified element
- Source:
Example
import { cleanup } from 'https://root.cern/js/latest/modules/base/ObjectPainter.mjs';
cleanup('drawing');
cleanup(document.querySelector('#drawing'));
Parameters:
Name | Type | Description |
---|---|---|
dom |
string | object | id or DOM element |
closeMenu(menunameopt)
Close previousely created and shown JSROOT menu
- Source:
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
menuname |
string |
<optional> |
optional menu name |
(async) connectWebWindow(arg) → {Promise}
Method used to initialize connection to web window.
- Source:
Parameters:
Name | Type | Description | ||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
arg |
object | arguments Properties
|
Returns:
for ready-to-use WebWindowHandle
instance
- Type
- Promise
convertDate()
Convert Date object into string used preconfigured time zone
- Description:
Time zone stored in settings.TimeZone
- Source:
create(typename)
Create some ROOT classes
- Description:
Supported classes:
TObject
,TNamed
,TList
,TAxis
,TLine
,TText
,TLatex
,TPad
,TCanvas
- Source:
Example
import { create } from 'https://root.cern/js/latest/modules/core.mjs';
let obj = create('TNamed');
obj.fName = 'name';
obj.fTitle = 'title';
Parameters:
Name | Type | Description |
---|---|---|
typename |
string | ROOT class name |
createHistogram(typename, nbinsx, nbinsyopt, nbinszopt) → {Object}
Create histogram object of specified type
Example
import { createHistogram } from 'https://root.cern/js/latest/modules/core.mjs';
let h1 = createHistogram('TH1I', 20);
h1.fName = 'Hist1';
h1.fTitle = 'Histogram title';
h1.fXaxis.fTitle = 'xaxis';
h1.fYaxis.fTitle = 'yaxis';
h1.fXaxis.fLabelSize = 0.02;
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
typename |
string | histogram typename like 'TH1I' or 'TH2F' |
|
nbinsx |
number | number of bins on X-axis |
|
nbinsy |
number |
<optional> |
number of bins on Y-axis (for 2D/3D histograms) |
nbinsz |
number |
<optional> |
number of bins on Z-axis (for 3D histograms) |
Returns:
created histogram object
- Type
- Object
createMenu(evntopt, handleropt, menunameopt)
Create JSROOT menu
- Description:
See
JSRootMenu
class for detailed list of methods
- Source:
Example
import { createMenu } from 'https://root.cern/js/latest/modules/gui/menu.mjs';
let menu = await createMenu());
menu.add('First', () => console.log('Click first'));
let flag = true;
menu.addchk(flag, 'Checked', arg => console.log(`Now flag is ${arg}`));
menu.show();
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
evnt |
object |
<optional> |
event object like mouse context menu event |
handler |
object |
<optional> |
object with handling function, in this case one not need to bind function |
menuname |
string |
<optional> |
optional menu name |
createTGraph(npoints, xptsopt, yptsopt)
Creates TGraph object
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
npoints |
number | number of points in TGraph |
|
xpts |
array |
<optional> |
array with X coordinates |
ypts |
array |
<optional> |
array with Y coordinates |
createTHStack()
Creates THStack object
- Description:
As arguments one could specify any number of histograms objects
- Source:
Example
import { createHistogram, createTHStack } from 'https://root.cern/js/latest/modules/core.mjs';
let nbinsx = 20;
let h1 = createHistogram('TH1F', nbinsx);
let h2 = createHistogram('TH1F', nbinsx);
let h3 = createHistogram('TH1F', nbinsx);
let stack = createTHStack(h1, h2, h3);
createTMultiGraph()
Creates TMultiGraph object
- Description:
As arguments one could specify any number of TGraph objects
- Source:
Example
import { createTGraph, createTMultiGraph } from 'https://root.cern/js/latest/modules/core.mjs';
let gr1 = createTGraph(100);
let gr2 = createTGraph(100);
let gr3 = createTGraph(100);
let mgr = createTMultiGraph(gr1, gr2, gr3);
createTPolyLine(npoints, use_int32opt)
Creates TPolyLine object
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
npoints |
number | number of points |
|
use_int32 |
boolean |
<optional> |
use Int32Array type for points, default is Float32Array |
decodeUrl(urlopt) → {Object}
decodes URL options after '?' mark
Example
import { decodeUrl } from 'https://root.cern/js/latest/modules/core.mjs';
let d = decodeUrl('any?opt1&op2=3');
console.log(`Has opt1 ${d.has('opt1')}`); // true
console.log(`Get opt1 ${d.get('opt1')}`); // ''
console.log(`Get opt2 ${d.get('opt2')}`); // '3'
console.log(`Get opt3 ${d.get('opt3','-')}`); // '-'
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
url |
string |
<optional> |
URL string with options, document.URL will be used when not specified |
Returns:
with .has(opt)
and .get(opt,dflt)
methods
- Type
- Object
decompress()
decompress ROOT LZMA buffer
- Description:
ROOT buffer has internal header of 29 bytes long which can be simply ignored
- Source:
(async) draw(dom, obj, opt) → {Promise}
Draw object in specified HTML element with given draw options.
- Description:
An extensive list of support draw options can be found on examples page
- Source:
Example
import { openFile } from 'https://root.cern/js/latest/modules/io.mjs';
import { draw } from 'https://root.cern/js/latest/modules/draw.mjs';
let file = await openFile('https://root.cern/js/files/hsimple.root');
let obj = await file.readObject('hpxpy;1');
await draw('drawing', obj, 'colz;logx;gridx;gridy');
Parameters:
Name | Type | Description |
---|---|---|
dom |
string | object | id of div element to draw or directly DOMElement |
obj |
object | object to draw, object type should be registered before with |
opt |
string | draw options separated by space, comma or semicolon |
Returns:
with painter object
- Type
- Promise
drawingJSON(dom) → {string}
Save object, drawn in specified element, as JSON.
- Description:
Normally it is TCanvas object with list of primitives
- Source:
Parameters:
Name | Type | Description |
---|---|---|
dom |
string | object | id of top div element or directly DOMElement |
Returns:
produced JSON string
- Type
- string
(async) ensureTCanvas(painter, frame_kind)
Ensure TCanvas and TFrame for the painter object
- Description:
Assign dom, creates TCanvas if necessary, add to list of pad painters
- Source:
Parameters:
Name | Type | Description |
---|---|---|
painter |
Object | painter object to process |
frame_kind |
string | boolean | false for no frame or '3d' for special 3D mode |
graph2DTooltip()
Function handles tooltips in the mesh
- Source:
hexMD5(s) → {string}
Encodes input string as Hex encoded string
.- Description:
Encodes input string as Hex encoded string
- Source:
Parameters:
Name | Type | Description |
---|---|---|
s |
string | Input string |
Returns:
Hex encoded string
- Type
- string
(async) httpRequest(url, kind, post_dataopt) → {Promise}
Submit asynchronoues http request
- Description:
Following requests kind can be specified:
- 'bin' - abstract binary data, result as string
- 'buf' - abstract binary data, result as ArrayBuffer (default)
- 'text' - returns req.responseText
- 'object' - returns parse(req.responseText)
- 'multi' - returns correctly parsed multi.json request
- 'xml' - returns req.responseXML
- 'head' - returns request itself, uses 'HEAD' request method
- 'post' - creates post request, submits req.send(post_data)
- 'postbuf' - creates post request, expectes binary data as response
- Source:
Example
import { httpRequest } from 'https://root.cern/js/latest/modules/core.mjs';
httpRequest('https://root.cern/js/files/thstack.json.gz', 'object')
.then(obj => console.log(`Get object of type ${obj._typename}`))
.catch(err => console.error(err.message));
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
url |
string | URL for the request |
|
kind |
string | kind of requested data |
|
post_data |
string |
<optional> |
data submitted with post kind of request |
Returns:
Promise for requested data, result type depends from the kind
- Type
- Promise
isBatchMode()
Indicates if running in batch mode
isNodeJs()
Indicates if running inside Node.js
(async) loadScript(url) → {Promise}
Load script or CSS file into the browser
Parameters:
Name | Type | Description |
---|---|---|
url |
String | script or css file URL (or array, in this case they all loaded sequentially) |
Returns:
- Type
- Promise
(async) makeImage(args) → {Promise}
Create SVG/PNG/JPEG image for provided object.
- Description:
Function especially useful in Node.js environment to generate images for supported ROOT classes, but also can be used from web browser
- Source:
Example
// how makeImage can be used in node.js
import { openFile, makeImage } from 'jsroot';
let file = await openFile('https://root.cern/js/files/hsimple.root');
let object = await file.readObject('hpxpy;1');
let png64 = await makeImage({ format: 'png', object, option: 'colz', width: 1200, height: 800 });
let pngbuf = await makeImage({ format: 'png', as_buffer: true, object, option: 'colz', width: 1200, height: 800 });
Parameters:
Name | Type | Description | ||||||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
args |
object | function settings Properties
|
Returns:
with image code - svg as is, png/jpeg as base64 string or buffer (if as_buffer) specified
- Type
- Promise
(async) makeSVG(args) → {Promise}
Create SVG image for provided object.
- Description:
Function especially useful in Node.js environment to generate images for supported ROOT classes
- Source:
Example
// how makeSVG can be used in node.js
import { openFile, makeSVG } from 'jsroot';
let file = await openFile('https://root.cern/js/files/hsimple.root');
let object = await file.readObject('hpxpy;1');
let svg = await makeSVG({ object, option: 'lego2,pal50', width: 1200, height: 800 });
Parameters:
Name | Type | Description | ||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
args |
object | function settings Properties
|
Returns:
with svg code
- Type
- Promise
openFile(arg) → {object}
Open ROOT file for reading
- Description:
Generic method to open ROOT file for reading Following kind of arguments can be provided:
- string with file URL (see example). In node.js environment local file like 'file://hsimple.root' can be specified
- File instance which let read local files from browser
- ArrayBuffer instance with complete file content
FileProxy
let access arbitrary files via tiny proxy API
- Source:
Example
import { openFile } from 'https://root.cern/js/latest/modules/io.mjs';
let f = await openFile('https://root.cern/js/files/hsimple.root');
console.log(`Open file ${f.getFileName()}`);
Parameters:
Name | Type | Description |
---|---|---|
arg |
string | object | argument for file open like url, see details |
Returns:
- Promise with
TFile
instance when file is opened
- Type
- object
parse(json) → {object}
Should be used to parse JSON string produced with TBufferJSON class
Parameters:
Name | Type | Description |
---|---|---|
json |
object | string | object where references will be replaced |
Returns:
parsed object
- Type
- object
parseMulti(json) → {Array}
Parse response from multi.json request
- Description:
Method should be used to parse JSON code, produced by multi.json request of THttpServer
- Source:
Parameters:
Name | Type | Description |
---|---|---|
json |
string | string to parse |
Returns:
array of parsed elements
- Type
- Array
produceRenderOrder(toplevel, origin, method)
Set rendering order for created hierarchy
- Description:
depending from provided method sort differently objects
- Source:
Parameters:
Name | Type | Description |
---|---|---|
toplevel |
top element |
|
origin |
camera position used to provide sorting |
|
method |
name of sorting method like 'pnt', 'ray', 'size', 'dflt' |
rawMD5(s) → {string}
Encodes input string as raw MD5 string
.- Description:
Encodes input string as raw MD5 string
- Source:
Parameters:
Name | Type | Description |
---|---|---|
s |
string | Input string |
Returns:
Raw MD5 string
- Type
- string
reconstructObject(class_name, obj_rawdata, sinfo_rawdata) → {object}
Reconstruct ROOT object from binary buffer
- Description:
Method can be used to reconstruct ROOT objects from binary buffer which can be requested from running THttpServer, using root.bin request To decode data, one has to request streamer infos data after object data as it shown in example.
Method provided for convenience only to see how binary IO works. It is strongly recommended to use root.json request to get data directly in JSON format
- Source:
Example
import { httpRequest } from 'http://localhost:8080/jsrootsys/modules/core.mjs';
import { reconstructObject } from 'http://localhost:8080/jsrootsys/modules/io.mjs';
let obj_data = await httpRequest('http://localhost:8080/Files/job1.root/hpx/root.bin', 'buf');
let si_data = await httpRequest('http://localhost:8080/StreamerInfo/root.bin', 'buf');
let histo = await reconstructObject('TH1F', obj_data, si_data);
console.log(`Get histogram with title = ${histo.fTitle}`);
// request same data via root.json request
httpRequest('http://localhost:8080/Files/job1.root/hpx/root.json', 'object')
.then(histo => console.log(`Get histogram with title = ${histo.fTitle}`));
Parameters:
Name | Type | Description |
---|---|---|
class_name |
string | Class name of the object |
obj_rawdata |
binary | data of object root.bin request |
sinfo_rawdata |
binary | data of streamer info root.bin request |
Returns:
- created JavaScript object
- Type
- object
(async) redraw(dom, obj, opt) → {Promise}
Redraw object in specified HTML element with given draw options.
- Description:
If drawing was not done before, it will be performed with
draw
. Otherwise drawing content will be updated
- Source:
Example
import { openFile } from 'https://root.cern/js/latest/modules/io.mjs';
import { draw, redraw } from 'https://root.cern/js/latest/modules/draw.mjs';
let file = await openFile('https://root.cern/js/files/hsimple.root');
let obj = await file.readObject('hpxpy;1');
await draw('drawing', obj, 'colz');
let cnt = 0;
setInterval(() => {
obj.fTitle = `Next iteration ${cnt++}`;
redraw('drawing', obj, 'colz');
}, 1000);
Parameters:
Name | Type | Description |
---|---|---|
dom |
string | object | id of div element to draw or directly DOMElement |
obj |
object | object to draw, object type should be registered before with |
opt |
string | draw options |
Returns:
with painter object
- Type
- Promise
(protected) registerForResize(handle, delayopt)
Register handle to react on window resize
- Description:
function used to react on browser window resize event While many resize events could come in short time, resize will be handled with delay after last resize event
- Source:
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
handle |
object | string | can be function or object with checkResize function or dom where painting was done |
|
delay |
number |
<optional> |
one could specify delay after which resize event will be handled |
resize(dom, arg)
Check resize of drawn element
- Description:
As first argument dom one should use same argument as for the drawing As second argument, one could specify 'true' value to force redrawing of the element even after minimal resize Or one just supply object with exact sizes like { width:300, height:200, force:true };
- Source:
Example
import { resize } from 'https://root.cern/js/latest/modules/base/ObjectPainter.mjs';
resize('drawing', { width: 500, height: 200 });
resize(document.querySelector('#drawing'), true);
Parameters:
Name | Type | Description |
---|---|---|
dom |
string | object | id or DOM element |
arg |
boolean | object | options on how to resize |
rstr2binl(input) → {Array.<number>}
Convert a raw string to an array of little-endian words Characters >255 have their high-byte silently ignored.
- Description:
Convert a raw string to an array of little-endian words Characters >255 have their high-byte silently ignored.
- Source:
Parameters:
Name | Type | Description |
---|---|---|
input |
string | Raw input string |
Returns:
Array of little-endian words
- Type
- Array.<number>
rstr2hex(input) → {string}
Convert a raw string to a hex string
.- Description:
Convert a raw string to a hex string
- Source:
Parameters:
Name | Type | Description |
---|---|---|
input |
string | Raw input string |
Returns:
Hex encoded string
- Type
- string
rstrMD5(s) → {string}
Calculate the MD5 of a raw string
.- Description:
Calculate the MD5 of a raw string
- Source:
Parameters:
Name | Type | Description |
---|---|---|
s |
string | Input string |
Returns:
Raw MD5 string
- Type
- string
setDefaultDrawOpt()
Set default draw option for provided class
Example
import { setDefaultDrawOpt } from 'https://root.cern/js/latest/modules/draw.mjs';
setDefaultDrawOpt('TH1', 'text');
setDefaultDrawOpt('TH2', 'col');
setHistogramTitle()
Set histogram title
- Description:
Title may include axes titles, provided with ';' symbol like "Title;x;y;z"
- Source:
str2rstrUTF8(input) → {string}
Encode a string as UTF-8
.- Description:
Encode a string as UTF-8
- Source:
Parameters:
Name | Type | Description |
---|---|---|
input |
string | Input string |
Returns:
UTF8 string
- Type
- string
toJSON(obj, spacingopt) → {string}
Method converts JavaScript object into ROOT-like JSON
- Description:
When performed properly, JSON can be used in TBufferJSON::fromJSON() method to read data back with C++ Or one can again parse json with
parse
function
- Source:
Example
import { openFile, draw, toJSON } from 'https://root.cern/js/latest/modules/main.mjs';
let file = await openFile('https://root.cern/js/files/hsimple.root');
let obj = await file.readObject('hpxpy;1');
obj.fTitle = 'New histogram title';
let json = toJSON(obj);
Parameters:
Name | Type | Attributes | Description |
---|---|---|---|
obj |
object | JavaScript object to convert |
|
spacing |
number |
<optional> |
optional line spacing in JSON |
Returns:
produced JSON code
- Type
- string
(async) treeDraw(args) → {Promise}
implementation of TTree::Draw
Parameters:
Name | Type | Description | ||||||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
args |
object | string | different setting or simply draw expression Properties
|
Returns:
with produced object
- Type
- Promise
(async) treeProcess(tree, selector, argsopt) → {Promise}
Process selector for the tree
Parameters:
Name | Type | Attributes | Description | ||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
tree |
object | instance of TTree class |
|||||||||||||
selector |
object | instance of |
|||||||||||||
args |
object |
<optional> |
different arguments Properties
|
Returns:
with TSelector instance
- Type
- Promise