在Node-red仪表板（在模板上）显示正常图表或D3Js

有人已经实现了显示一个图表，而不是基于时间序列（如仪表板图表），但传递给它的数据？

我想知道是否可以使用模板来做到这一点？ 但我不知道如何去做。 如果有人有一个小例子，那就太好了。

Answer 1

我find了一个解决scheme，使用库中的一些代码示例… msg.payload和数据之间的链接仍然缺失，但不远

<style> #chart svg { width: 800px; height: 600px; } </style> <h3>test</h3> <div id="chart"> <svg></svg> </div> <script src="https://raw.githubusercontent.com/novus/nvd3/master/build/nv.d3.js"></script> <script> (function(scope) { console.log('Position 1'); console.dir(scope); console.log(scope.msg); scope.$watch('msg.payload', function(data) { console.log('Position 2'); console.dir(data); }); })(scope); function data() { var sin = [], cos = []; for (var i = 0; i < 100; i++) { sin.push({x: i, y: Math.sin(i/10)}); cos.push({x: i, y: .5 * Math.cos(i/10)}); } return [ { values: sin, key: 'normal', color: '#ff7f0e' }, { values: cos, key: 'defect', color: '#2ca02c' } ]; } nv.addGraph(function() { var chart = nv.models.lineChart() .useInteractiveGuideline(true) ; chart.xAxis .axisLabel('frequence') .tickFormat(d3.format(',r')) ; chart.yAxis .axisLabel('amplitude') .tickFormat(d3.format('.02f')) ; d3.select('#chart svg') .datum(data()) .transition().duration(500) .call(chart) ; nv.utils.windowResize(chart.update); return chart; }); </script>