Nodes gone in inkscape document

[Kandersen]

Hi all..
I´m very new to Inkscape.

The other day I created a floorplan in Floorplanner, imported it to Inkscape.  In Inkscape I inserted 12 ng-binds using the xml editor.  After done editing, I saved the document in svg format.
The svg is used as GUI in openhab2 Habpanel, and the ng-binds I inserted is working quite well, (see screendump).

Today when I load the very same svg file into inkscape, all my ng-binds are gone except for one, (see other screendump).

Can anyone tell me, how is that possible. Is it me doing something wrong. I cant figure why the ng-binds are working fine in the saved svg file in Habpanel, but when loaded back into Inkscape, they´re gone in the xml editor..
I have attached the svg as well.. I really hope someone can help me here, as this is driving me nuts

Greets
Kim

[Moini]

What is an ng-bind, please?

[brynn]

Oh, rats, Moini!  Reading that message, I was sure you would know!

Although I don't know what ng-bind is either, when I open your SVG file in a text editor, I see, I think I counted 14 ng-bind....I'm not sure if "element" is the right terminology.  They are all within text....well if it was html, it would be text tags.  But I'm not sure if that's the right terminology either.

According to w3Schools, ng-bind seems to be either related to, or at least used with, AngularJS (whatever that is, haha).  https://www.w3schools.com/angular/ng_ng-bind.asp


My best guess about the disappearing ng-bind nodes is that Inkscape just doesn't support that code.  I suppose it's also possible that you didn't use it correctly, but I'm not even close to qualified enough to be able to address that.

Ah-ha!  DDG tells me that ng-bind is an attribute.  Here's a quote from the first search result

The ngBind attribute tells AngularJS to replace the text content of the specified HTML element with the value of a given expression, and to update the text content when the value of that expression changes.

So, Inkscape is a vector graphics editor which strives to support SVG/XML.  To my understanding, SVG is sort of a subset of XML.  Here's a page which lists all the SVG Attributes, and I don't see ng-bind there.  So it seems reasonable to think maybe ng-bind just isn't part of SVG.

Maybe from this point, you need to work in a text editor, rather than in Inkscape?  (That's my non-programmer, non-coder conclusion, based on my brief research.  In other words non-professional comment.)

Edit
Moving this to Beyond the Basics board.

[Kandersen]

Brynn.. Thx for your answer. I understand what you´re saying, but it doesn´t make much sense, because when I load the svg into Inkscape, there is one ng-bind left. If Inkscape didn´t support the Angularjs tagging, I was have thought it either complaint in some way, or simply removed them all. Leaving one behind doesnt make sense to me.
 (And yes, it is a AngularJS tag, which can replace some specific contence from another system, (OpenHab in my situation)). Others are using Inkscape as well for the same purpose. They´havn´t been able to tell me why I have this problem though. Thats why i registered this forum hoping to get some help or answer :-)

 

[brynn]

This is the first time I've heard about ng-bind.

Since I do see all the ng-bind's when I look at your SVG file in a text editor, they clearly are not missing.  But apparently Inkscape's XML Editor cannot display them.  There is some odd code surrounding the one ng-bind which is showing in the XML Editor, which probably Inkscape inserted to try and salvage the code (I'm talking about the

Code: [Select]

=""/>

and

Code: [Select]

="">

).

I don't see that code in the text editor.  My best guess why the XML Editor doesn't display all the ng-bind's properly is because it's not SVG code.

My best guess about how you should proceed, is to leave Inkscape, and start coding in a text editor.  At some point, you'll need to put in the AngularJS code, and for sure Inkscape can't display that code!

Moini may have some comments, once she understands more about ng-bind.  (She will understand it on a higher level than I can understand it.)  So maybe she'll have some helpful comments.

Are you sure that the other users can see the ng-binds in Inkscape's XML Editor?  If they can, then maybe you can compare notes with them?

Or we could always kick your questions up to Inkscape developers.  This message contains info about how to contact developers:  https://forum.inkscapecommunity.com/index.php?topic=628.0  You could try the IRC without too much trouble.  If you want to try the mailing list, but don't want to subscribe, I could relay your questions to them.  That's usually problematic, but I don't mind trying, if that's what you want to do.

[Kandersen]

I honestly dont know if anyone has tried to reload the svg back into Inkscape. I assumed they have, since this is not a five minute operation 
I have no idea if AngularJS tags are "allowed" SVG code. I simply assumed (again), due to this thread in the OpenHab community. (The first message shows it all and howto). 
https://community.openhab.org/t/design-your-svg-floorplan-or-dashboard-for-habpanel-with-inkscape/38441
(Scrolling down shows some pretty heavy examples of how creative some people can be using InkScape).

I did notice the odd code as well. And you´re correct it seems its the one Inkscap do seem to read. But I have no knowledge about this, so I had to assume, (again again  ) this was normal.. Or.. well, nothing does seem normal, so I have no idea 

I could leave Inkscape and do this in a text editor. Problem is finding the specific coordinates of the page where to place these tags.
Openhab is a automatic home control system, this floorplan was suppose to be my dashboard showing me all sorts of information from the OpenHab system, (the first screendumps shows room temperatures in our house. That was as far as I got, untill I discovered this problem). Thats why Inkscape is/was a briliant tool to create this kind of dashboard.

Lets see if Moini got some idea 

[Moini]

If someone could give a quick and correct explanation of what it is and how it is used correctly, so I don't have to learn Angular before I answer, it would be easier to help.

[brynn]

Interesting, I see that the ng-bind code does show  up in the XML Editor, in the screenshots.  Did you enter the exact same code that's showing in the screenshots and their text instructions?  Double-check and all that?  (I don't mean to be rude.  You'd be surprised how often such a reminder solves the problem.)

It looks like you can enter comments or questions to that message.  That might be another place to try to get help.

I could leave Inkscape and do this in a text editor. Problem is finding the specific coordinates of the page where to place these tags.

Why is that a problem?  I'm asking because I'm over my head with most of what you're doing.  I'm not trying to be sarcastic, I really don't know.  I mean, I can clearly see the ng -binds in the text editor.

Oh, do you mean, where the text should go on the image?  Do you mean that you need to add more text with ng-binds?  Well....  I'm thinking that because I can open the image in a text editor, and all the ng-binds are still there....  I wonder what would happen if you added one more text, put in the ng-bind and save.  I wonder if everything would still be preserved for the text editor - just like before?  As long as you save a backup of this file that you attached, just in case it doesn't work.  It can't hurt to try, right?

It should be possible to do it in the text editor, by using the x and y coordinates.  But it's really tricky, because as far as I understand, Inkscape's coordinate system is upside-down, compared to the internet.  But it should be possible, theoretically.

Oops, there's Moini.  Did you see the general definition which I quoted earlier?  Do you need more details than that?

The ngBind attribute tells AngularJS to replace the text content of the specified HTML element with the value of a given expression, and to update the text content when the value of that expression changes.

[Kandersen]

I can not give a quick explanation of this.
The ng-bind tells the dashboard of OpenHab (Habpanel, which is basicly an html browser) to show some statements (values) from the OpenHab system. I believe it´s html/xml tags, or css tags.. (I´m not expert in either).
The best I can explain is the above link to the OpenHab community, where there is a guide in the first message how to use inkscape to create svg´s to show in habpanel (OpenHab´s dashboard), including these tags. 
Basicly it has a very little to do with vector graphics at all. It´s just using the svg format to add these tags where is make any sense. In my example a floorplan of our house. I believe it´s called Text in Inkscape, which allowe these tags, I guess.

[Kandersen]

Interesting, I see that the ng-bind code does show  up in the XML Editor, in the screenshots.  Did you enter the exact same code that's showing in the screenshots and their text instructions?  Double-check and all that?  (I don't mean to be rude.  You'd be surprised how often such a reminder solves the problem.)

I did..

It looks like you can enter comments or questions to that message.  That might be another place to try to get help.

I did try asking in the same thread.

I could leave Inkscape and do this in a text editor. Problem is finding the specific coordinates of the page where to place these tags.

Why is that a problem?  I'm asking because I'm over my head with most of what you're doing.  I'm not trying to be sarcastic, I really don't know.  I mean, I can clearly see the ng -binds in the text editor.

Oh, do you mean, where the text should go on the image?  Do you mean that you need to add more text with ng-binds?  Well....  I'm thinking that because I can open the image in a text editor, and all the ng-binds are still there....  I wonder what would happen if you added one more text, put in the ng-bind and save.  I wonder if everything would still be preserved for the text editor - just like before?  As long as you save a backup of this file that you attached, just in case it doesn't work.  It can't hurt to try, right?

It should be possible to do it in the text editor, by using the x and y coordinates.  But it's really tricky, because as far as I understand, Inkscape's coordinate system is upside-down, compared to the internet.  But it should be possible, theoretically.

Doing this in a text editor I assume would be very hard to place the text in the correct coordinates. Ofcouse those which are already there is easy enough. But this is just a draft, and in time there would have been alot more stuff going on, (like showing when a light turns on/off, windows open/closed, garagedoor open/closed etc). This is why Inkscape is a powerfull tool to use, to place the text where it is suppose to be on the image.

I know this is probably not a common question for vector graphic people, since this is mainly everything else than the graphic itself. I just had to try ask somewhere, since noone seemed to know in the OpenHab community, which made me rather frustrating.

[brynn]

I wonder if there might be a forum somewhere about XML?  I remember when I was learning just some simple html, I found a forum somewhere....it might have been w3Schools forum.  And w3Schools has XML tutorials, so maybe they could help?  Yeah, here's their forum, and I see they even have an XML board.  Or maybe you don't like w3Schools, I don't know, people are always telling me to go somewhere else.  But they meet my simple needs.

It might turn out to be a bug, that Inkscape's XML Editor doesn't display the ng-bind code.  Or it might be a bug that it does, haha!  Unless Moini knows, we'd have to ask developers.  (Actually, Moini is a developer, in some ways.)

[brynn]

Hey, I just had an idea!  For the ng-bind code that's missing -- do you still see the text on the canvas?  If so, I'd be curious what happens when you select it.  Selecting an object on the canvas automatically selects it in the XML Editor.  I wonder what Inkscape would do?  Would it suddenly "compute" the correct code?  Or, I just wonder.

I know you shared the file, but I have no idea which text to select.  Or is the text all missing from the canvas as well?

Edit
I don't see any text....

[Kandersen]

There are no text in the canvas.
Right now I´m trying to figure out, using Notepad++ (text editor) whats going on. I think I have found a possible reason why Inkscape do read one of the ng-binds. It´s place inside at <Rect. Where as the others are place inside a <Text.

[brynn]

Ooh yeah, good catch!

Not only is in <rect, but the <rect has no closing tag.

Let us know if that fixes it.

[Kandersen]

It didn´t..
Have to try something else tomorrow.

[Moini]

Works for me, see attached SVG. Maybe you didn't get the quotes right?

[Moini]

(what I'd have needed to get for helping more quickly would have been a list of attributes and their values, to copy-paste into the file for testing. This was what I meant by quick explanation. I don't want to have to go to another forum and read up articles, if someone can just summarize the important points, which are: "I need to insert attribute xy with value yz into my SVG file, but Inkscape deletes it".)

[Kandersen]

Works for me, see attached SVG. Maybe you didn't get the quotes right?

I didn´t, thats for sure. I just used Inkscape to insert the code, having no idea of any quotes needed.

[Kandersen]

(what I'd have needed to get for helping more quickly would have been a list of attributes and their values, to copy-paste into the file for testing. This was what I meant by quick explanation. I don't want to have to go to another forum and read up articles, if someone can just summarize the important points, which are: "I need to insert attribute xy with value yz into my SVG file, but Inkscape deletes it".)

I tried explain the best I could. I knew none of you had any need to go to another forum to read up. But I simply couldn´t explain myself any better. Sorry!

[Moini]

Just try again following the given instructions on that forum slowly, and make sure there's a closing quote for every one that opens.

[Kandersen]

So Inkscape doesn´t insert these quotes itself?

[Moini]

Take a look at the screenshots in that forum post. You need to insert the exact same type of info as is given in the screenshots of the xml editor dialog, so it will look the exact same way in your own xml editor dialog.

[brynn]

Hey, I just came across this extension.  It sounds a lot like what you want to do, but I'm not totally clear.  It might not be exactly the same as what you're doing.  But just in case, I thought I'd mention it.

https://github.com/fsantini/inkscape_LinkSVG