Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[feature] Allow embedded SVG symbols via base 64 encoding #7433

Merged
merged 5 commits into from
Jul 23, 2018

Conversation

nyalldawson
Copy link
Collaborator

(As outlined in qgis/QGIS-Enhancement-Proposals#126)

Allows SVG images for symbology, labels, etc to be directly embedded inside a project file (or QML style, or QPT print template!) by encoding the svg as a standard base64 string.

Also adds a common widget for SVG sources, with a tool button with some handy options:

  • select file (old behaviour), pick a file from disk
  • embed file (pick a file from disk, is embedded into project/symbol)
  • extract embedded file (for embedded files, allows you to save these back to a disk based svg file)
  • from url (opens a dialog prompting for a url, exposing the previously hidden functionality that svgs can be retrieved from a remote url (eg github))

The vast majority of the churn here is due to the UI - the actual core change is only 4 lines long! But we had multiple different code paths implementing a svg selector line edit and the corresponding logic, so I've taken the opportunity to create a standard widget to share the code between these.

Allows SVG images for symbology, labels, etc to be directly embedded
inside a project file (or QML style, or QPT print template!)
by encoding the svg as a standard base64 string.

Sponsored by SMEC/SJ
Adds a common widget for SVG sources, with a tool button with
some handy options:
- select file (old behaviour), pick a file from disk
- embed file (pick a file from disk, is embedded into project/symbol)
- extract embedded file (for embedded files, allows you to save these
back to a disk based svg file)
- from url (opens a dialog prompting for a url, exposing
the previously hidden functionality that svgs can be retrieved
from a remote url (eg github))

Sponsored by SMEC/SJ
@rduivenvoorde
Copy link
Contributor

rduivenvoorde commented Jul 19, 2018

@nyalldawson nice! I did not look or build the code, but am wondering about colors for the embedded svg's.
If am correct current svg's have some coding in it, to make it possible to change color in QGIS (they show black, but you can make them red etc). Are the base64 images then 'frozen in color'?

Some background: http://blog.sourcepole.com/2011/06/30/svg-symbols-in-qgis-with-modifiable-colors/ and https://gis.stackexchange.com/questions/45180/how-to-create-svg-symbols-that-have-modifiable-fill-color-stroke-color-and-stro

@nyalldawson
Copy link
Collaborator Author

@rduivenvoorde

If am correct current svg's have some coding in it, to make it possible to change color in QGIS (they show black, but you can make them red etc). Are the base64 images then 'frozen in color'?

Nope -- if you embed a "parameterised" svg (those which allow color changing), then it'll still be parameterised and allow color changes after embedding.

@andreasneumann
Copy link
Member

Nice! Thanks a lot!
Now, to really benefit from these changes, I think it would be very useful to have a function in the project menu to embed or extract all SVG references (in layouts and symbols) at once.

Often, projects have many SVG files linked and if one wants to exchange that with others, it would be a lot of work to manually embed or extract all SVG files.

@nirvn
Copy link
Contributor

nirvn commented Jul 20, 2018

@nyalldawson , just tested the PR, nice work.

Few issues:

  • Embedded SVGs in the labelling's background panel has several issues: i/ the text box colors the writing in red (red is used to identify a non-existing file, which shouldn't matter for base64: string), ii/ the fill / stroke color controls are disabled for embedded SVGs.
  • Embedded SVGs in the north arrow decorator aren't working: i/ the text box also uses red color (see above), and a base64: embedded SVG doesn't render at all, the decorator defaults back to the north arrow.

@nyalldawson
Copy link
Collaborator Author

@nirvn
Thanks for the test -- both issues fixed now.

@rduivenvoorde
Copy link
Contributor

Compiled, and tested with a qml + custom icons (bird and bat findings) I just got from a client:

selection_031

Works fine! Thanks

Some usability comments:

  • it is nice that having svg's already, clicking the 'Embed File' goes to the right icon at once!
  • not related to this PR, but: IF you have your svg in the right color and size, selecting it is a little cumbersome, as you have to go to the very bottom of the dialog. While I think (well in my use cases) I only select a svg, and then I'm done. Settings size/rotation/colors/anchorpoints etc are secondary options. So my point: should the 'selecting' part not be above those parts (this goes actually for all marker types)? - to change to embedded I had to scroll to the very bottom of the dialog 20 times :-)
    I would like to have the Path + dropdown item/line Just below the Symbol layer type (if possible?).
  • tested the 'Extract Embedded File...' option too. Works fine, though it is not clear (to me) that I had to give a name. The dialog opening looks like you have to select an svg, instead of saving it somewhere.
  • I second @andreasneumann Feature Request :-) It would be cool to have an option "embed all markers in the project now" (though the other way around: save all markers to disk is harder, as you have to give names to them all...)

Anyway: thanks for this PR

@nyalldawson
Copy link
Collaborator Author

Nice! Thanks a lot!
Now, to really benefit from these changes, I think it would be very useful to have a function in the project menu to embed or extract all SVG references (in layouts and symbols) at once.

@andreasneumann
This is non-trivial unfortunately. I think it would either need to be done as a plugin as a proof of concept first, or possibly it may be possible to do it on project save (but still not trivial).

@nyalldawson
Copy link
Collaborator Author

@rduivenvoorde Thanks for the feedback and testing!

not related to this PR, but: IF you have your svg in the right color and size, selecting it is a little cumbersome, as you have to go to the very bottom of the dialog. While I think (well in my use cases) I only select a svg, and then I'm done. Settings size/rotation/colors/anchorpoints etc are secondary options. So my point: should the 'selecting' part not be above those parts (this goes actually for all marker types)? - to change to embedded I had to scroll to the very bottom of the dialog 20 times :-)

I'm not sure. I'd consider tweaking colors or sizes a more frequent operation than changing the actual SVG file. We probably should discuss this on the list to get more feedback before any changes.

tested the 'Extract Embedded File...' option too. Works fine, though it is not clear (to me) that I had to give a name. The dialog opening looks like you have to select an svg, instead of saving it somewhere.

I'm not sure what we can do here, that sounds like a deficiency in the toolkit dialog itself. (I find this too often with the GNOME/GTK save/open dialogs). We could add a messagebox explanation before the file dialog, but that'd get annoying quickly if you were exporting a few...

I second @andreasneumann Feature Request :-) It would be cool to have an option "embed all markers in the project now" (though the other way around: save all markers to disk is harder, as you have to give names to them all...)

See above :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants