Skip to main content
Solved

Database field with SVG image, how to show in Universal


Freddy
Forum|alt.badge.img+16
  • Thinkwise Local Partner Brasil
  • 531 replies

Database field (VARBINARY) with SVG image, how to show in Universal

Best answer by Mark Jongeling

Hi Freddy,

Database stored images have two parts; the Name column and the Data column. When trying to show an icon/image in the GUI, both columns are required to be filled.

The name column can be any name. The data column has to be the <svg> code converted to varbinary and saved inside the [icon]_data field

Below an example that I made work in the Software Factory using a Table icon:

declare @project_id project_id = 'TEST_MJ', @project_vrs_id project_vrs_id = '2.20', @tab_id tab_id = 'customer'  

declare @icon varbinary(max),
        @svg varchar(max) = '<svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 24 24" width="24px" height="24px"><path d="M 15.861328 2.0117188 C 15.581328 2.0537187 8.9980469 3.089 8.9980469 7.5 C 8.9980469 8.987 9.2701563 9.9689688 9.5351562 10.917969 C 9.7731562 11.775969 10 12.586781 10 13.800781 C 10 16.874781 4.0062656 19.348969 1.6972656 20.042969 L 2.2714844 21.957031 C 3.2664844 21.659031 12 18.897781 12 13.800781 C 12 12.314781 11.727891 11.332813 11.462891 10.382812 C 11.223891 9.5248125 10.998047 8.714 10.998047 7.5 C 10.998047 5.011 15.49875 4.108 16.09375 4 L 16.376953 4 C 15.587953 4.857 15.009766 6.007 15.009766 7.5 C 15.009766 9.134 16.06875 10.493594 17.09375 11.808594 C 18.08175 13.076594 19.015625 14.272609 19.015625 15.599609 C 19.015625 18.984609 16.713234 20.037078 16.615234 20.080078 L 17.394531 21.923828 C 17.542531 21.861828 21.015625 20.356609 21.015625 15.599609 C 21.015625 13.585609 19.770875 11.988125 18.671875 10.578125 C 17.816875 9.481125 17.009766 8.446 17.009766 7.5 C 17.009766 4.759 20.106375 4.0055625 20.234375 3.9765625 L 19.796875 2.0253906 C 19.764875 2.0323906 15.861328 2.0117187 15.861328 2.0117188 z M 21 4 C 20 4 19 5.895 19 7 C 19 7.738 19.405 8.3756562 20 8.7226562 L 20 11 L 22 11 L 22 8.7226562 C 22.595 8.3756562 23 7.738 23 7 C 23 5.895 22 4 21 4 z M 4 9 C 2.168 9 1 11.626 1 13 C 1 14.302 1.839 15.402406 3 15.816406 L 3 18 L 5 18 L 5 15.816406 C 6.161 15.402406 7 14.302 7 13 C 7 11.626 5.832 9 4 9 z M 3.9628906 10.996094 C 4.2978906 11.099094 5 12.259 5 13 C 5 13.551 4.551 14 4 14 C 3.449 14 3 13.551 3 13 C 3 12.259 3.7038906 11.099094 3.9628906 10.996094 z"/></svg>'

select @icon = convert(varbinary(max), @svg) -- This is the core, converting the SVG to varbinary

update tab
set icon = 'icons8-path.svg'
  , icon_data = @icon
where project_id = @project_id
  and project_vrs_id = @project_vrs_id
  and tab_id = @tab_id

Hope this gives you an idea ðŸ˜„

View original
Did this topic help you find an answer to your question?
This topic has been closed for replies.

2 replies

Mark Jongeling
Administrator
Forum|alt.badge.img+23
  • Administrator
  • 3945 replies
  • Answer
  • April 7, 2022

Hi Freddy,

Database stored images have two parts; the Name column and the Data column. When trying to show an icon/image in the GUI, both columns are required to be filled.

The name column can be any name. The data column has to be the <svg> code converted to varbinary and saved inside the [icon]_data field

Below an example that I made work in the Software Factory using a Table icon:

declare @project_id project_id = 'TEST_MJ', @project_vrs_id project_vrs_id = '2.20', @tab_id tab_id = 'customer'  

declare @icon varbinary(max),
        @svg varchar(max) = '<svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 24 24" width="24px" height="24px"><path d="M 15.861328 2.0117188 C 15.581328 2.0537187 8.9980469 3.089 8.9980469 7.5 C 8.9980469 8.987 9.2701563 9.9689688 9.5351562 10.917969 C 9.7731562 11.775969 10 12.586781 10 13.800781 C 10 16.874781 4.0062656 19.348969 1.6972656 20.042969 L 2.2714844 21.957031 C 3.2664844 21.659031 12 18.897781 12 13.800781 C 12 12.314781 11.727891 11.332813 11.462891 10.382812 C 11.223891 9.5248125 10.998047 8.714 10.998047 7.5 C 10.998047 5.011 15.49875 4.108 16.09375 4 L 16.376953 4 C 15.587953 4.857 15.009766 6.007 15.009766 7.5 C 15.009766 9.134 16.06875 10.493594 17.09375 11.808594 C 18.08175 13.076594 19.015625 14.272609 19.015625 15.599609 C 19.015625 18.984609 16.713234 20.037078 16.615234 20.080078 L 17.394531 21.923828 C 17.542531 21.861828 21.015625 20.356609 21.015625 15.599609 C 21.015625 13.585609 19.770875 11.988125 18.671875 10.578125 C 17.816875 9.481125 17.009766 8.446 17.009766 7.5 C 17.009766 4.759 20.106375 4.0055625 20.234375 3.9765625 L 19.796875 2.0253906 C 19.764875 2.0323906 15.861328 2.0117187 15.861328 2.0117188 z M 21 4 C 20 4 19 5.895 19 7 C 19 7.738 19.405 8.3756562 20 8.7226562 L 20 11 L 22 11 L 22 8.7226562 C 22.595 8.3756562 23 7.738 23 7 C 23 5.895 22 4 21 4 z M 4 9 C 2.168 9 1 11.626 1 13 C 1 14.302 1.839 15.402406 3 15.816406 L 3 18 L 5 18 L 5 15.816406 C 6.161 15.402406 7 14.302 7 13 C 7 11.626 5.832 9 4 9 z M 3.9628906 10.996094 C 4.2978906 11.099094 5 12.259 5 13 C 5 13.551 4.551 14 4 14 C 3.449 14 3 13.551 3 13 C 3 12.259 3.7038906 11.099094 3.9628906 10.996094 z"/></svg>'

select @icon = convert(varbinary(max), @svg) -- This is the core, converting the SVG to varbinary

update tab
set icon = 'icons8-path.svg'
  , icon_data = @icon
where project_id = @project_id
  and project_vrs_id = @project_vrs_id
  and tab_id = @tab_id

Hope this gives you an idea ðŸ˜„


Freddy
Forum|alt.badge.img+16
  • Author
  • Thinkwise Local Partner Brasil
  • 531 replies
  • April 7, 2022

The icon name did the trick. 


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings