jsGraph icon indicating copy to clipboard operation
jsGraph copied to clipboard

react jsgraph component and required features

Open lpatiny opened this issue 6 years ago • 7 comments

We would need in order to implement one of the react component we need to be allowed to have this kind of code:

// options.width, options.height
const jsgraph = new JSGraph(options);

// options.keepState: if on we keep the axis values (zoom and span in fact)
// this method would replace ALL the data (annotations and series)
jsGraph.setJSON(json, options);

// this last method could be repeated without having to recreate a new jsgraph instance

// could we also add listener on track, zoom change, pan, etc ?
jsGraph.addListener('track', () => {});

lpatiny avatar Mar 22 '19 13:03 lpatiny

For the first line, I started with:

constructor( wrapper, options, axis = undefined ) {
    super();

    /*
      The unique ID of the graph
      @name Graph#uniqueid
      @type String
    */
    this._creation = util.guid();
    this._drawn = false;

    if ( wrapper === Object( wrapper ) && !( wrapper instanceof HTMLElement ) ) {
      // Wrapper is options
      options = wrapper;
      wrapper = undefined;
    } 
    
    if( ! options.axes ) {
      options.axes = axis;
    }

Which should allow you to use a single object. But those options are not the ones you are expecting.

You will need to use

const jsgraph = new Graph();
jsgraph.setJSON( firstOptions );
jsgraph.setJSON( secondOptions, { keepState: true } );

jsgraph.setWrapper( domElement );
jsgraph.draw();

NPellet avatar Aug 04 '19 11:08 NPellet

I make another branch (setJSON) that you can try out

Corresponding example is in other/setJSON.html

NPellet avatar Aug 04 '19 12:08 NPellet

Added the keepState option for min max of the axis

NPellet avatar Aug 04 '19 13:08 NPellet

I don't see a setJSON branch

targos avatar Aug 09 '19 14:08 targos

Ah damn this was committed on branch 2.2. My mistake.

Le ven. 9 août 2019 à 16:51, Michaël Zasso [email protected] a écrit :

I don't see a setJSON branch

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/NPellet/jsGraph/issues/237?email_source=notifications&email_token=AALKLW2TMO4VRGLDBC42GX3QDV75PA5CNFSM4HAOFBNKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD364VGI#issuecomment-519948953, or mute the thread https://github.com/notifications/unsubscribe-auth/AALKLWZ63CAL6TJ7ONVSBN3QDV75PANCNFSM4HAOFBNA .

NPellet avatar Aug 09 '19 14:08 NPellet

setJSON works, but even with { keepState: true }, the chart is being zoomed out after each update:

jsgraph

targos avatar Aug 09 '19 16:08 targos

You need to give names to the axes

name: "uniquestring"

in the axis definition

Le ven. 9 août 2019 à 18:26, Michaël Zasso [email protected] a écrit :

setJSON works, but even with { keepState: true }, the chart is being zoomed out after each update:

[image: jsgraph] https://user-images.githubusercontent.com/2352663/62793978-36193c00-bad3-11e9-8697-f09477cd9809.gif

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/NPellet/jsGraph/issues/237?email_source=notifications&email_token=AALKLW45EZZYPVMNEFDY37TQDWLDZA5CNFSM4HAOFBNKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD37ES4Y#issuecomment-519981427, or mute the thread https://github.com/notifications/unsubscribe-auth/AALKLWYQZQMURU2I3PPGMEDQDWLDZANCNFSM4HAOFBNA .

NPellet avatar Aug 09 '19 18:08 NPellet