Clockface don't show steps - help

[Locke1337]

Hello,

my clockface don't work

I wan't to show steps and distance with this code, but theres nothing in the screen.

APP/INDEX

import { today, goals } from "user-activity";

 // show the user's activity for the day
 var fieldMap = {
 distance: { name: "distance", unit: "m" },
 calories: { name: "calories", unit: "Cal" },
 steps: { name: "steps", unit: "" },
 elevationGain: { name: "elevation", unit: "floors" },
 activeMinutes: { name: "active minutes", unit: "" }
 };
 ["local", "adjusted"].forEach(function (scope) {
 console.log("ANTActivity(" + scope + "):");
 var activity = today[scope];
 for (var field in fieldMap) {
 if (activity[field] !== undefined) {
 console.log(" " + fieldMap[field].name + ": " + activity[field] + " " + fieldMap[field].unit);
 }
 }
 });
 console.log("ANTsteps:" + today.adjusted.steps);

let _steps = document.getElementById("steps");
let _distance = document.getElementById("distance");

Code in Index.gui

<svg id="root" class="background" pointer-events="visible">
 
 <svg id="mainDisplay">
 <image href="MSVimage1.png" /> // Hintergrundbild
 <text id="date"/>
 
 <g id="clockface">
 <text id="clockDigits1" />
 <text id="clockDigits2" />
 </g>

 <g id="heartRateContainer" > 
 <image id="animatedImage" href="icons/heartBlue1.png" width="30" height="30" x="4%" y="87%" opacity="0.85">
 </image>
 
 <text id="heartRate">--</text>
 </g>
 
 <g x="110" y="145" id="stepsContainer"> // Schrittzähler
 <image href="icons/ActiveMinutes80msv.png" width="40" height="40" x="210" y="255"></image>
 <text id="steps" x="280" y="285">--</text>
 </g>
 
 
 <g x="110" y="145" id="distanceContainer"> //Strecke
 <image href="icons/distance.png" width="40" height="40" x="100" y="255"></image>
 <text id="distance" x="180" y="285">--</text>
 </g>
 

If it'S not right placed here, please tell me where I can get help. th

[LeiChat · Accepted solution]

Hi @locke

_steps.text = (today.adjusted.steps || 0);