如何使用ploty在视图中显示端点数据？

Question

我正在使用情节来显示热图。我可以用硬编码数据显示热图。

但现在我有了端点，这样您就可以看到带有后端数据的热图。

但如果我使用端点数据，我看不到热图。

所以我有这个作为模板：

<plotly-plot [data]="graph.data" [layout]="graph.layout"

</plotly-plot>

和这个打字稿：

Map:map = {};

}

所以这有效，我看到了热图。

但现在如果我这样做：

export interface map { 

  

    map?: Array<Array<number>> | null;

}

 Map() {

    this.Service

        

        });

  }

But then the data is not visible

So what I have to change?

So I have it now like this:

this.showHeadMap().subscribe((res) => {

}

因为它使用源作为图像。

但是，如果我加载页面，我只会看到一个图表一秒钟，并且页面加载是否完成。然后图表消失。但图像未显示。

But if I fill in the z with this:

来自：[[0.000010752661，

you have to do this:

z: [[res.push(this.ok.map[0])]],

but then for all values

Answer 1

将 showHeadMap 更改为以下内容：-showHeadMap() {&nbsp; &nbsp; return this.aggregateCameraHeatmapsService&nbsp; &nbsp; &nbsp; &nbsp; .aggregateHeatmaps('2020-11-09 10:00:00', '2020-12-10 14:15:00', 4, '1')&nbsp; &nbsp; &nbsp; &nbsp; .pipe(map((res) => {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;this.cameraAgretateHeadMap.heatmap = res.heatmap.slice(0, 1);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;return this.cameraAgretateHeadMap.heatmap;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;}));&nbsp; }然后分配图表，例如：-this.showHeadMap().subscribe((res) => {&nbsp;this.graph = {&nbsp; data: [&nbsp; &nbsp; {&nbsp; &nbsp; &nbsp; &nbsp;z: [res],&nbsp; &nbsp; &nbsp; &nbsp;type: 'heatmap',&nbsp; &nbsp; &nbsp; &nbsp;showscale: false,&nbsp; &nbsp; &nbsp; &nbsp;colorscale: colorScale,&nbsp; &nbsp; &nbsp; &nbsp;opacity: 0.7,&nbsp; &nbsp; &nbsp; &nbsp;zsmooth: 'best'&nbsp; &nbsp; }&nbsp; ]&nbsp;}});