Sorry, I am out of ideas. The only thing I would again try to move the lower right corner downwards as far as you can (keep holding downwards outside the window far beyond the actual svg.). That worked for me.
I had the same issue and I can see that you have a lot of white space in the top section of your floorplan.
In my case all of this whitespace belongs to the svg image.
To resolve, select all items in Inkscape and select âEdit >> Resize Page to Selectionâ. This action then crops the image to the items you have and it should also display OK in habpanel
Just in case you did not solve your problem, the problem is with type casting. The first is concatenating strings, the second is transforming the Temperatura item to a number and then substracting 1.
I would like to see a feedback when I clicked a button (unrelated to the ng class and css that actually changes the color of a button when a item state changes.
purely along with a sendcmd I would like the button to e.g. change color for a few seconds to get feedback that the click was recognized.
@Kim_Andersen: I was struggling to implement it as well, but for me it worked when I inserted the following (using itemValue and shuffling a bit with the quotes) in the ng-bind of the XML:
Thank you, Yannik. Great work! Iâm missing the CSS to get rid of this little blue box, but thatâs not a big issue to me. Following your tutorial (and this tutorial for getting paper floorplan into inkscape) I was able to do a good first job.
I´m trying to exchange an image (object on my floorplan) from one svg to another based on state⌠I cant really figure how to to with in Inkscape or CSSâŚ
This is the default svg.
And when motion is detected, I would like it show this one:
I´m not even sure if it makes sense to exchange the image like that or if there are other ways to do it.
In inkscape I have defined an ng-class like this:
Correct, thatâs not how CSS is supposed to work. Get rid of the html, change the colon into a dash, but the proper quotation marks around the path and you are good to go.
I´m not sure about which quotation marks to use around the path. I have seen lots of css examples with and withoutâŚI have tried everything⌠But it just doesn´t show.
Furthermore you will have to add a default class before the ng-class that sets the motion-off icon.
If that still doesnât work, check the state of the item and check if the path is correct, as I canât test that for you.
That was related to your comment about not being sure about the quotation marks, and using none whatsoever while my previous post was that you should use quotation marks. Then at least try something
Then also include that in your .motion-on class, just for debugging:
Then whenever the itemState is not equal to ON, the class of that div is set to motion-off, and whenever the itemState becomes ON, the class is âoverruledâ with the motion-on class.
Just first try if you can get the mechanism working with the fills, and when that works, remove the fills from the CSS and see why the background images are not working (if they still arenât). My first guess would be the path being wrong then.