My first plotly with angular

plotly.js
1

setInterval(() => {this.bot.ob2().valueChanges().subscribe(data=> {this.bitcoin=data; Plotly.purge(this.el.nativeElement)
this.ternaryChart(data)})},8000);
}

ternaryChart(data) {
var arr = Object.keys(data)
.map(function(key) { return data[key] });
console.log(arr);
var value=arr[3];
const element = this.el.nativeElement
const formattedData = [{
type: ‘candlestick’,
mode: ‘line’,
y: arr.map(d => d.rate_float),

marker: {
    symbol: 100,
    color: '#DB7365',
    size: 14,
    line: { width: 2 }
},

}]

const style = {
line: {
sum: 100000,
yaxis: this.makeAxis(‘rate_float’, 10000),
xaxis: this.makeAxis(‘Developer’, 10000),
bgcolor: ‘#fff1e0’
}
}

Plotly.plot(element, formattedData, style);
}

this is my code i try makea live data feed.but stumble on lots of problems
i update firebase every second or so with a bitcoin object.
then i take the data subscribe and get @data on that object make it an array.
and map it to correct value in array but no markaers or lines or livechart appears
only the y n x axis what can i do to progress from here
i noticed documentatiopn is poor also on angular with plotly
thank for any help

2

You might want to look up https://github.com/plotly/angular-plotly.js

But I doubt your problems are caused by your angular environment. Unfortunately, you issue is a little hard to debug without a sample of your data.

3

thanks for trying but data is simple rate_float value in an object updating in firebase
i dont see a problem trying to make static graphs but miss whole point of update feed…

4

I sure your data is fine. I meant it’d be nice to have access to some sample of your data to (1) make your snippet reproducible (2) have an idea how it’s formatted.