How to preserve manually selected draw option in JSROOT canvas?

ROOT
1

Hello

I have been using JSROOT to draw histograms in a web browser. The configuration of the web page is saved in a database (e.g., colors and font parameters of the histograms interactively selected by the user).

However, if a user interactively selects a non-default draw option for some histograms, I haven’t found a way to extract and preserve this information. Is it possible to retrieve this information from the canvases and save it in permanent storage so that the next time the same page is loaded, the last-used draw options will be applied to the histograms?

Cheers

2

Hi,

When object drawn correspondent painter is created.
This painter returned with the promise from draw function like:

   const file = await openFile('https://root.cern/js/files/hsimple.root');
   const obj = await file.readObject('hpxpy;1');
   const painter = await draw('drawing', obj, 'colz');

Painter object has method ObjectPainter.getDrawOpt
So one can use it to ask actual draw options. One can do it so:

   painter.original_redraw = painter.redraw;
   painter.redraw = function(arg) {
      this.original_redraw(arg);
      console.log('Draw options', this.getDrawOpt());
   }

Regards,
Sergey

3

Hi Sergey

Thank you for the suggestion. I have tried to implement it, but unless I’m doing something wrong, it was unsuccessful. The Painter.getDrawOpt() always returns the original draw option that I passed to the draw() function (‘hist’ in my case). Any interactive modifications which have been done via the “Draw with” drop-down menu command are ignored.

Cheers

PS: I’ using version 7.9.1 which seems to be the latest.

4

Hi,

If you are using draw function - all previous painter objects are removed and then created new.
You can use redraw function instead. Or always remember last painter object returned from last draw call. Also small update how redraw method should be used:

painter.original_redraw = painter.redraw;
   painter.redraw = function(arg) {
      const res = this.original_redraw(arg);
      console.log('Draw options', this.getDrawOpt());
      return res;
   }
5

Yes, I know that if I redraw a histograms the manually chosen draw option will be preserved in the current session. My question is if I can get the value of currently manually selected draw option to save it to some persistent storage and reuse when the web page with the histograms is reloaded?

6

Provided example return actual draw options - also after modified with context menu.

Here temporary link to working code:

Related part is:

     const painter = await draw('drawing', obj, 'colz');

     painter.original_redraw = painter.redraw;
     painter.redraw = function(arg) {
        const res = this.original_redraw(arg);
        console.log('Redraw with', this.getDrawOpt());
        return res;
     }

     setInterval(() => console.log('Draw options', painter.getDrawOpt()), 1000);
7

Thank you for providing this example - it was very helpful for understanding the issue.

It does indeed work with 2D histograms but not with 1D, which is what I have been using in my tests.

8

Is it?

Here example with TH1 histogram. It works for me too.

9

Yes, it is.

I think I understand the difference between your example and my tests. In your example, you are drawing a histogram object (JSON obtained with type=compact), while in my application I draw a Canvas (JSON obtained with type=json). In that case, getDrawOpt() always returns an empty string.

In fact, my earlier claim about 2D histograms was incorrect. When drawing a Canvas instead of a histogram, getDrawOpt() always returns an empty string, regardless of the histogram dimension.

10

When you draw canvas - you got canvas painter after draw.
To get individual painter of each object - use painter.findPainterFor(null,'hist_name')
If only histogram drawn on the canvas - also painter.getMainPainter() can be used.

11

Thank you, this work exactly as I need.

12

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