Jsroot + custom object

ROOT
1

Hi Experts,
I had a custom class that have Browse method. Thanks to this I could browse the object in TBrowser.
Does somebody now how (if it possible) get such functionality in Jsroot?

2

Hi,

That kind of functionality you are looking for?

Do you want to browse new object kind in web-based TBrowser?

Or browse objects in plain JSROOT - like here:
http://root.cern/js/latest/?file=../files/hsimple.root&item=hpxpy&opt=inspect

In the first case re-implementing of TObject::Browse is sufficient. Of course, if object derived from TObject class. If it is not a case - one could provide browsable classes for such object type and register these browsables to ROOT.

In last case of plain JSROOT inspect draw option let browse objects members directly. Or one can provide small plugin for JSROOT which list all important sub-elements in the object for JSROOT hierarchy painter.

Depending from your needs I can provide more precise information about first or second possibility.
Unfortunately, there is not yet exists complete documentation about this functionality.

Regards,
Sergey

3

Hi,
let’s say that i have class “Ratio” that simply contains two histograms, but I want to draw only result of division. How can I achieve this?

4

Hi,

Mean you need to draw your custom class in plain JSROOT. That require some peace of JavaScript code, which will prepare data - and division of two histograms is most complicated part of it.

There is addDrawFunc function in JSROOT, which defines drawing method for the custom classes.

There is simple demo how custom JavaScript code can be loaded (via inject parameter in URL) and draw function can be registered for the custom class.

Custom code will look like:

JSROOT.addDrawFunc({ name: 'customClassName', func: (dom, obj, opt) => {
   // create new histogram
   const hdiv = JSROOT.createHistogram("hdiv", "title", obj.h1.fXaxis.fNbins, obj.h1.fXaxis.fXmin, obj.h1.fXaxis.fXmax);

   // calculate division of two histograms

   // draw new histogram 
   return JSROOT.draw(dom, hdiv, opt);
} });

I propose that you provide small ROOT file with such custom object and I write JavaScript code which will tries to implement draw function for it. And I include this code to JSROOT demos.

Is it ok?

5

Hi,
this is a file with example data and a root file with custom class.
divhist.C (1,2 KB)
test.root (3,8 KB)

6

Hi,

I add example for simple draw function of such class to jsroot repository.

It makes use of inject URL parameter. Full URL for example:

https://jsroot.gsi.de/dev/?file=demo/custom/divhist.root&inject=demo/custom/divhist.js&item=DivHist

But this is plain drawing.

In the ROOT class you divides canvas on two pads and also draw original histograms.

Are you want to do the same in JSROOT?
Potentially one can implemented this as extra draw option.

7

Hi,
Thank you, basically this is almost what I want. If you could:

  • is there some example of adding num/den to the “browser tree”
  • is there some example of drawing few thinks on pads (e.g. ratio on one, other histogram on second pad)?
8

Hi,

is there some example of adding num/den to the “browser tree”

You want to expand content of your object in the hierarchy browser?
This example I can add.

is there some example of drawing few things on pads

This requires more work. One have to construct TCanvas object, divide it on subpads and draw
objects there. I need to implement few methods in JSROOT to let it work.

9

I extend custom class example in jsroot.
See divhist.js in repository.

It provides expand function to let custom access to object members.
And it implements “pads” draw option
which create TCanvas, divide it on 3 subpads and draw several components there.
All available only in the master branch.

For ratio plots I recommend to use TRatioPlot class directly. See examples. It provides better interactive support for zooming in several pads.
But TRatioPlot should be created already in the ROOT.

10

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.