score:1

Accepted answer

you can use observable or subject to listen data stream in realtime. your your socket service probably will be like below.

export class mqttservice {
private mqttclient:any;//any mqtt implementation library
  connect(params:any): {
    this.mqttclient = mqtt.connect('connection url');
  }
  ontopic(topic: string,header:any): observable<any> {
  //subscribe any topic here.
    return observable.create((observer) => {
          this.mqttclient.observe(topic).subscribe((message) => {
              observer.next(json.parse(message.payload.tostring()));
            },header);
    });
  }
}

after you wrote your service, use it inside any component you wish.

export class tab1page {

@viewchild("barcanvas", { static: true }) barcanvas: elementref;
private barchart: chart;

constructor(private mqttservice:mqttservice){}

ngoninit() {
    this.barchart = new chart(this.barcanvas.nativeelement)//no idea how to init this class,
  this.mqttservice.ontopic("app/chart").subscribe(data=>{
     this.refreshchart(this.barchart,data)
   })
}

 refreshchart(chart:chart,data){
 //refresh the chart
 }

}

Related Query

More Query from same tag