{"id":1140,"date":"2023-02-12T03:48:40","date_gmt":"2023-02-12T07:48:40","guid":{"rendered":"https:\/\/jausoft.com\/blog\/?p=1140"},"modified":"2023-02-28T17:27:54","modified_gmt":"2023-02-28T21:27:54","slug":"graph-type-rendering-update-1","status":"publish","type":"post","link":"https:\/\/jausoft.com\/blog\/2023\/02\/12\/graph-type-rendering-update-1\/","title":{"rendered":"Graph Type Rendering Update 1"},"content":{"rendered":"<p>After releasing <a href=\"https:\/\/jogamp.org\/wiki\/index.php\/Release_2.4.0\">JogAmp 2.4.0 <\/a>(see <a href=\"https:\/\/jogamp.org\/wiki\/index.php\/SW_Tracking_Report_Objectives_for_the_release_2.4.0\">feature\/buglist<\/a>), it was time to tackle an outstanding issue once again: <em>Type Rendering<\/em>. Motivation was born again by finding the most interesting feature to use Java with JOGL on Desktop, Mobile and Embedded Devices. At least for my taste, I identified this to be <a href=\"https:\/\/jogamp.org\/wiki\/index.php\/SW_Tracking_Report_Feature_Objectives_Overview#Graph_UI\"><i>Graph UI,\u00a0<\/i> an immersive UI<\/a> within the 3D scene including text and UI objects and user interaction.<!--more--><\/p>\n<p><i>Graph UI<\/i> shall allow an application to utilize one viewport or window, exposing the scene including the UI w\/o the need for any external toolkit. Think of an integrated QT or OpenJFX in your 2D\/3D application working on desktop and embedded devices even w\/o any windowing system on top of a plain console <a class=\"external text\" href=\"https:\/\/jogamp.org\/bugzilla\/show_bug.cgi?id=1156\" rel=\"nofollow\">DRM\/GBM as support by JOGL(EGL) and NEWT<\/a>.<\/p>\n<p>Early examples from 2012 are available in these videos around the <a class=\"external text\" href=\"https:\/\/youtu.be\/7mBi7psP7VM?t=165\" rel=\"nofollow\">2:45 minute mark<\/a> and here <a class=\"external text\" href=\"https:\/\/youtu.be\/4gWStKCioi8?t=16\" rel=\"nofollow\">at the 16s mark<\/a>.<\/p>\n<p>Edit: <a href=\"https:\/\/jausoft.com\/blog\/2023\/02\/22\/reimagine-java-on-desktop-bare-metal-devices\/\">This blog entry<\/a> demonstrates this use-case in more detail (now being <a href=\"https:\/\/jausoft.com\/blog\/tag\/graph_type_rendering\/\">part of this series<\/a>).<\/p>\n<p style=\"text-align: center;\">***<\/p>\n<p><strong><em>Graph UI<\/em> utilizes <a href=\"https:\/\/jausoft.com\/blog\/2011\/10\/05\/jogljogamp-red-square-moscow-nurbs-graphicon2011\/\">Resolution Independent NURBS Curves Rendering using Programmable Graphics Pipeline<\/a>, i.e. rendering curves directly on the GPU, resolution independent <\/strong>as found by Rami Santina (see [ <a href=\"https:\/\/jogamp.org\/doc\/gpunurbs2011\/p70-santina.pdf\">paper<\/a>, <a href=\"https:\/\/jogamp.org\/doc\/gpunurbs2011\/graphicon2011-slides.pdf\">slides<\/a> ] ). Back in 2011 Rami and I implemented this method, used for <strong>fonts (types) and UI elements<\/strong>. The first draft of <em>Graph UI was born<\/em>.<\/p>\n<p>Well, nothing is perfect nor bug free, hence certain aspects were simply not well implemented and others not yet working bug free within Curve Rendering.<\/p>\n<p>Hence I tackle <em>Type Rendering <\/em>first, as it is the most important part of any UI and it also exposes weaknesses in our Curve Rendering implementation. The following steps have been achieved so far<\/p>\n<ul>\n<li>Update <a href=\"https:\/\/github.com\/dcsch\/typecast\">David Schweinsberg&#8217;s Typecast library<\/a> within our JOGL codebase\n<ul>\n<li>Created our<a href=\"https:\/\/jogamp.org\/cgit\/typecast.git\/log\/?h=jogl_patches\"> jogl_patches branch<\/a> to better track changes in the future<\/li>\n<\/ul>\n<\/li>\n<li>Finally producing resolution independent <em>outline shapes<\/em> used by the <em>Curve Renderer<\/em> in font-units (I might change this to fractional font em-size. Scaling to target size via scaling to font-pixel-size is performed simply by applying it to the <em>PMV matrix<\/em> when rendering the <em>GLRegion<\/em>.<\/li>\n<li>Added kerning for inter-word horizontal advance layout.<\/li>\n<li>Improved unit test TestTextRendererNEWT01 to produce validation snapshots against <em>LibreOffice<\/em>&#8216;s print-preview snapshots. The latter was used as a reference, as it properly renders fonts and layout with correct monitor DPI &#8211; same as our <em>Graph rendering<\/em>.<\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<p style=\"text-align: center;\">***<\/p>\n<p><em>Graph rendering<\/em> device metrics using <em>Ubuntu-Light<\/em> 12pt for below examples are: vertical dpi 159.03 6.26 px\/mm, font 12pt 26.50px 4.23mm. Internal 4x <em>vbaa sampling<\/em> was used.<\/p>\n<p>Below results demonstrate pixel accurate layout including kerning. Also the font rendering artifacts itself are almost matching the LibreOffice reference. I verified the layout using overlay with transparency at 2x magnitude.<\/p>\n<p>You can click on each screenshot below to see them in full size &#8230;<\/p>\n<h3>Reference LibreOffice Ubuntu-Light 12pt Text-1<a href=\"https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/libreoffice-ubuntu_light_12-text1.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1141\" src=\"https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/libreoffice-ubuntu_light_12-text1.png\" alt=\"\" width=\"1147\" height=\"326\" srcset=\"https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/libreoffice-ubuntu_light_12-text1.png 1147w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/libreoffice-ubuntu_light_12-text1-300x85.png 300w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/libreoffice-ubuntu_light_12-text1-1024x291.png 1024w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/libreoffice-ubuntu_light_12-text1-768x218.png 768w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/libreoffice-ubuntu_light_12-text1-1088x309.png 1088w\" sizes=\"auto, (max-width: 1147px) 100vw, 1147px\" \/><\/a>Graph Type Rendering Ubuntu-Light 12pt Text-1, sampling vbaa-4<\/h3>\n<p><a href=\"https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/text-vbaa1-msaa0-Ubuntu_Light-text1-S04.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1143\" src=\"https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/text-vbaa1-msaa0-Ubuntu_Light-text1-S04.png\" alt=\"\" width=\"1147\" height=\"326\" srcset=\"https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/text-vbaa1-msaa0-Ubuntu_Light-text1-S04.png 1147w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/text-vbaa1-msaa0-Ubuntu_Light-text1-S04-300x85.png 300w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/text-vbaa1-msaa0-Ubuntu_Light-text1-S04-1024x291.png 1024w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/text-vbaa1-msaa0-Ubuntu_Light-text1-S04-768x218.png 768w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/text-vbaa1-msaa0-Ubuntu_Light-text1-S04-1088x309.png 1088w\" sizes=\"auto, (max-width: 1147px) 100vw, 1147px\" \/><\/a><\/p>\n<h3>Reference LibreOffice Ubuntu-Light 12pt Text-2 (kerning)<a href=\"https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/libreoffice-ubuntu_light_12-text2.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1145\" src=\"https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/libreoffice-ubuntu_light_12-text2.png\" alt=\"\" width=\"1584\" height=\"296\" srcset=\"https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/libreoffice-ubuntu_light_12-text2.png 1584w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/libreoffice-ubuntu_light_12-text2-300x56.png 300w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/libreoffice-ubuntu_light_12-text2-1024x191.png 1024w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/libreoffice-ubuntu_light_12-text2-768x144.png 768w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/libreoffice-ubuntu_light_12-text2-1536x287.png 1536w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/libreoffice-ubuntu_light_12-text2-1088x203.png 1088w\" sizes=\"auto, (max-width: 1584px) 100vw, 1584px\" \/><\/a>Graph Type Rendering Ubuntu-Light 12pt Text-2 (kerning), sampling vbaa-4<a href=\"https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/text-vbaa1-msaa0-Ubuntu_Light-text2-S04.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1146\" src=\"https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/text-vbaa1-msaa0-Ubuntu_Light-text2-S04.png\" alt=\"\" width=\"1584\" height=\"296\" srcset=\"https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/text-vbaa1-msaa0-Ubuntu_Light-text2-S04.png 1584w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/text-vbaa1-msaa0-Ubuntu_Light-text2-S04-300x56.png 300w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/text-vbaa1-msaa0-Ubuntu_Light-text2-S04-1024x191.png 1024w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/text-vbaa1-msaa0-Ubuntu_Light-text2-S04-768x144.png 768w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/text-vbaa1-msaa0-Ubuntu_Light-text2-S04-1536x287.png 1536w, https:\/\/jausoft.com\/blog\/wp-content\/uploads\/2023\/02\/text-vbaa1-msaa0-Ubuntu_Light-text2-S04-1088x203.png 1088w\" sizes=\"auto, (max-width: 1584px) 100vw, 1584px\" \/><\/a><\/h3>\n<p>&#8230; more to come in the next update.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>After releasing JogAmp 2.4.0 (see feature\/buglist), it was time to tackle an outstanding issue once again: Type Rendering. Motivation was born again by finding the most interesting feature to use Java with JOGL on Desktop, Mobile and Embedded Devices. At least for my taste, I identified this to be Graph UI,\u00a0 an immersive UI within&hellip; <a class=\"more-link\" href=\"https:\/\/jausoft.com\/blog\/2023\/02\/12\/graph-type-rendering-update-1\/\">Continue reading <span class=\"screen-reader-text\">Graph Type Rendering Update 1<\/span> <span class=\"meta-nav\" aria-hidden=\"true\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[7,3,8,1],"tags":[9,13,22,71,16,44,33,31,17,46,68],"class_list":["post-1140","post","type-post","status-publish","format-standard","hentry","category-3d-opengl","category-computer-stuff","category-jogamp","category-uncategorized","tag-3d","tag-embedded-device","tag-fonts","tag-graph_type_rendering","tag-java","tag-jogamp","tag-linux","tag-mobile","tag-opengl","tag-openjdk","tag-type-rendering"],"_links":{"self":[{"href":"https:\/\/jausoft.com\/blog\/wp-json\/wp\/v2\/posts\/1140","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/jausoft.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/jausoft.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/jausoft.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/jausoft.com\/blog\/wp-json\/wp\/v2\/comments?post=1140"}],"version-history":[{"count":11,"href":"https:\/\/jausoft.com\/blog\/wp-json\/wp\/v2\/posts\/1140\/revisions"}],"predecessor-version":[{"id":1220,"href":"https:\/\/jausoft.com\/blog\/wp-json\/wp\/v2\/posts\/1140\/revisions\/1220"}],"wp:attachment":[{"href":"https:\/\/jausoft.com\/blog\/wp-json\/wp\/v2\/media?parent=1140"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/jausoft.com\/blog\/wp-json\/wp\/v2\/categories?post=1140"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/jausoft.com\/blog\/wp-json\/wp\/v2\/tags?post=1140"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}