Comment puis-je trouver mon tableau complet dans le noeud Template

Je suis vraiment nouveau dans le domaine du codage avec presque aucune expérience, essayant d'utiliser un nœud Node-Red Template pour créer une présentation visuelle de quelques simples coordonnées 2D en HTML. Tout d'abord, c'est la première fois que j'utilise HTML et Moustache, ce qui me perturbe. Mon entrée en tant que msg.payload est un tableau d'objets JSON (si je l'ai bien compris) et dans ces JSON j'ai stocké les coordonnées X et Y qui seraient utilisées pour dessiner des points représentant les éléments. Voici le code de mon noeud modèle atm:Comment puis-je trouver mon tableau complet dans le noeud Template

<!DOCTYPE html> 
<html> 
<title>Factory floor map</title> 
<h><b>Factory floor map</b></h> 

<script type = "text/javascript"> 

function draw() 
{ 
    var canvas = document.getElementById("canvas"); 
    if (null==canvas || !canvas.getContext) return; 

    var axes={}, ctx=canvas.getContext("2d"); 
    axes.y0 = 100;     // x0 pixels from left to x=0 
    axes.x0 = 100;     // y0 pixels from top to y=0 
    axes.scale = 40;     // 40 pixels from x=0 to x=1 
    axes.doNegativeX = false; 

    showAxes(ctx,axes); 
    plotItems(ctx,axes); 

} 

function plotItems(ctx,axes) 
{ 
    var ID = 0001; 
    for(var i = 0; i < **What here**; i++) 
    { 
    var X = axes.x0 + axes.scale*{**What here**}; 
    var Y = axes.y0 + axes.scale*{**What here**}; 
    drawItem(ID,X,Y,ctx,axes); 
    } 
} 

function drawItem(ID,X,Y,ctx,axes) 
{ 
    var radius = 25; 
    ctx.beginPath(); 
    ctx.arc(Y, X, radius, 0, 2 * Math.PI, false); 
    ctx.fillStyle = 'red'; 
    ctx.fill(); 
    ctx.lineWidth = 2; 
    ctx.strokeStyle = '#003300'; 
    ctx.stroke(); 
} 

function showAxes(ctx,axes) 
{ 
var y0=axes.y0, w=ctx.canvas.width; 
var x0=axes.x0, h=ctx.canvas.height; 
var xmin = axes.doNegativeX ? 0 : x0; 
ctx.beginPath(); 
ctx.strokeStyle = "rgb(128,128,128)"; 
ctx.moveTo(x0,y0); ctx.lineTo(w,y0); // Y axis 
ctx.moveTo(x0,y0); ctx.lineTo(x0,h); // X axis 
ctx.stroke(); 
} 
</script> 

<body onload="draw()"> 
<canvas id="canvas" width="1600" height="800"></canvas> 
</body> 
</html>

je peux trouver des valeurs uniques de mon tableau en utilisant par exemple {{# payload.2}} {{X}} {{/ loadload.2}} dans la fonction PlotItems() -, mais je veux pouvoir parcourir tout le tableau, objet par objet.

S'il vous plaît dites-moi comment je pourrais résoudre ce problème le plus facilement possible.

Pour clarifier les choses, voici le msg.payload qui est l'entrée à mon nœud de modèle, dont je veux o pouvoir utiliser valeurs X et Y:

[ { "_id": "55c099d9067c061d00ff462d", "ID": "0001 ", "X": "100 ", "Y": "4 ", "mass": "10 " }, { "_id": "55c09850067c061d00ff4623", "ID": "0004 ", "X": "15 ", "Y": "5 ", "mass": "10 " }, { "_id": "55c0aaa8067c061d00ff4630", "ID": "5 ", "X": "1 ", "Y": "34 ", "mass": "85 " }, { "_id": "55c0ab78067c061d00ff4631", "ID": "moottori ", "X": "4 ", "Y": "6 ", "mass": "85 " }, { "_id": "55c0b1a7067c061d00ff4645", "ID": "Hannes ", "X": "65 ", "Y": "74.5775 ", "mass": "80 " }, { "_id": "55c1a1e6067c061d00ff4657", "ID": "Roope ", "X": "69 ", "Y": "4 ", "mass": "85 " }, { "_id": "55c1a8b5067c061d00ff4661", "ID": "Roope_2 ", "X": "1 ", "Y": "1 ", "mass": "85 " }, { "_id": "55c1f832067c061d00ff4666", "ID": "Pasi ", "X": "1 ", "Y": "1 ", "mass": "85 " } ]

Source

2015-08-06 stenbro

Mustache est pas vraiment bon pour peuplant code comme ceci, mais vous pouvez essayer quelque chose comme ça

... 
function plotItems(ctx,axes) 
{ 
    var ID = 0001; 
    var X,Y; 
    {{#payload}} 
    X = axes.x0 + axes.scale*{{X}}; 
    Y = axes.y0 + axes.scale*{{Y}}; 
    drawItem(ID,X,Y,ctx,axes); 
    {{/payload}}; 
} 
...

Source

2015-08-06 09:04:07 hardillb

Cela ne semble pas fonctionner ..:/y at-il une meilleure façon de le faire, sans Moustache? – stenbro

Wow hey, enlevé le [] de votre suggestion et il semble fonctionner très bien. Je vous remercie! – stenbro

Si je le faisais, je chargerais le corps principal de la page en tant que HTML statique, puis j'utiliserais une requête HTTP Node-RED pour obtenir la valeur de la charge utile dans la page – hardillb

Comment puis-je trouver mon tableau complet dans le noeud Template

Répondre

Questions connexes