mobxjs / mobx-angular

The MobX connector for Angular.
MIT License
483 stars 59 forks source link

Computed of Computed ? #161

Closed gelinger777 closed 2 years ago

gelinger777 commented 2 years ago

I have a complex case where I have a store which stores several sensor data magnetometer, acceleration etc.

@Injectable()
export class ScannerStore {

    @observable NS2S: number = 1.0 / 1000000000.0;
    @observable EPSILON: number = 0.000000001;
    @observable FILTER_COEFFICIENT: number = 0.9;
    @observable poiArray: any = [];
    @observable poiFilteredArray: any = [];
    @observable magnetometer: Magnetometer = { coordinates: { x: null, y: null, z: null }, error: false };
    @observable gyroscope: Gyroscope = { coordinates: { x: null, y: null, z: null, timestamp: null }, error: false };
    @observable accelerometer: Accelerometer = { coordinates: { x: null, y: null, z: null }, error: false };
    @observable fusionOrientation: any = { coordinates: { alpha: null, beta: null, gama: null }, error: false };
    @observable deviceOrientation: any = { coordinates: { alpha: null, beta: null, gama: null }, error: false };
    @observable gps: Gps = { coordinates: { latitude: null, longitude: null }, distanceFilteredCoordinates: false };

}

So only when all sensor data is set (gyroscope,magnetometer, accelerometer) I can then compute the fusionOrientation data (alpha,beta,gama) and only then when those values are calculated , I can take all Points of Interest in poiArray and filter them, enrich them to show on the map.

So what is the right way to to approach this?

I was thinking to make several @computed variables , one referencing to another (if the former is set) . Also another way is to subscibe to changes on three observables and on any change of any of them if all three are set the run action

calculateFusionOrientation() , set the value to fusionOrientation . Then also subscribe to changes to fusionOrientation and as soon as it changes and set calculate poiFilteredArray based on poiArray and fusionOrientation .

What would you suggest on this case ?

adamkleingit commented 2 years ago

It depends how fast is this calculation and how granular you want the reactions.

Without any performance considerations, computed is the way to go because it keeps the single source of truth:

@computed get fusionOrientation() { calculate from gyroscope,magnetometer, accelerometer }
@computed get poiArray() { calculate from fusionOrientation }
etc...

Closing as this is not an issue, you can continue the discussion ❤️

gelinger777 commented 2 years ago

hi @adamkleingit . I am almost done with integration. Thank you very much for your comment. The only thing I don't yet understand is how I can do following. In Angular-redux which is now depreciated we had

    @select(["accelerometer", "coordinates"])
    accelerometerCoordinates$: Observable<MotionDTO>;

which in a Controller was linking a variable in store with a local Obervable. How to reach the same with mobx-angular?