03-22-2022 15:31
03-22-2022 15:31
Hello
I am trying to use the Cycle View for the first time and am trying to figure out how to replace the fixed information from the example with a label and the actual info. I can get the actual information OR the first few letters of the label...but not both.
Thoughts?
From index.js:
const mySteps = document.getElementById("mySteps");
...
let stepCt = today.adjusted.steps;
mySteps.text = `mySteps ${stepCt}`;
From index.view:
<use href="#cycleview-item" class="cycle-item">
<text id="mySteps" />
</use>
From styles.css:
#mySteps {fill: white;}
03-22-2022 15:39
03-22-2022 15:39
Might need text-length.
03-22-2022 15:54
03-22-2022 15:54
Thanks for the thought. I added text-length to my css and changed its value (between 30 and 5) and it had zero effect on the display.
If I change my index.view to:
<use href="#cycleview-item" class="cycle-item">
<text>mySteps <text id="mySteps"/></text>
</use>
They display both, but overwrite each other.
03-22-2022 17:26
03-22-2022 17:26
Got it!
In my index.js:
let mSNum = today.adjusted.steps;
let mS = `MSTPS ${mSNum}`;
mySteps.text = mS;
In my styles.css: (Thanks Gondwana!)
#mySteps {text-length: 20;}
I don't know why it would't let me do the concat without the extra definition.