[patch] mappaint support for HIDPI screens

[Klumbumbus]

More and more users have HIDPI screens (see e.g. ​recent german forum thread).

While #9995 is about the general HIDPI support, I propose the following solution for the mapview for now, which allows to scale the nodes and text size by the following two josm preference keys:

• node-size-factor
• font-size-summand

Unfortunately I don't have a monitor to test. According to the linked thread the icon size is ok on a 4k screen, so I didn't touch it for now. (edit: see ticket:9995#comment:15 should iconsize.map change the iconsize in the mapview? This does not work for me.)

styles/standard/elemstyles.mapcss

@@ -16 +16 @@
     default-points: false;
 }
 
+* {
+    font-size-summand: JOSM_pref("font-size-summand", 0);
+}
 /*************************/
 /* create style settings */
 /*************************/
@@ -4939 +4942 @@
     set icon_z0;
     text: auto;
     set text_z0;
-    font-size: 10;
+    font-size: 10 + prop("font-size-summand");
     font-weight: bold;
     text-color:black;
     text-halo-color: white;
@@ -4972 +4975 @@
     set icon_z0;
     text: auto;
     set text_z0;
-    font-size: 10;
+    font-size: 10 + prop("font-size-summand");
     font-weight: bold;
     text-color:black;
     text-halo-color: white;
@@ -4984 +4987 @@
     set icon_z0;
     text: auto;
     set text_z0;
-    font-size: 10;
+    font-size: 10 + prop("font-size-summand");
     font-weight: bold;
     text-color:black;
     text-halo-color: white;
@@ -4996 +4999 @@
     set icon_z0;
     text: auto;
     set text_z0;
-    font-size: 10;
+    font-size: 10 + prop("font-size-summand");
     font-weight: bold;
     text-color:black;
     text-halo-color: white;
@@ -5008 +5011 @@
     set icon_z0;
     text: auto;
     set text_z0;
-    font-size: 10;
+    font-size: 10 + prop("font-size-summand");
     font-weight: bold;
     text-color:black;
     text-halo-color: white;
@@ -5020 +5023 @@
     set icon_z0;
     text: auto;
     set text_z0;
-    font-size: 10;
+    font-size: 10 + prop("font-size-summand");
     font-weight: bold;
     text-color:black;
     text-halo-color: white;
@@ -5032 +5035 @@
     set icon_z0;
     text: auto;
     set text_z0;
-    font-size: 10;
+    font-size: 10 + prop("font-size-summand");
     font-weight: bold;
     text-color:black;
     text-halo-color: white;
@@ -5044 +5047 @@
     set icon_z0;
     text: auto;
     set text_z0;
-    font-size: 10;
+    font-size: 10 + prop("font-size-summand");
     font-weight: bold;
     text-color:black;
     text-halo-color: white;
@@ -5056 +5059 @@
     set icon_z0;
     text: auto;
     set text_z0;
-    font-size: 10;
+    font-size: 10 + prop("font-size-summand");
     font-weight: bold;
     text-color:black;
     text-halo-color: white;
@@ -5068 +5071 @@
     set icon_z0;
     text: auto;
     set text_z0;
-    font-size: 10;
+    font-size: 10 + prop("font-size-summand");
     font-weight: bold;
     text-color:black;
     text-halo-color: white;
@@ -5079 +5082 @@
 node|z-14[place=locality][!setting("hide_icons")] {
     icon-image: "place/locality.png";
     text: auto;
-    font-size: 10;
+    font-size: 10 + prop("font-size-summand");
     font-weight: bold;
     text-color:black;
     text-halo-color: white;
@@ -5090 +5093 @@
     set icon_z0;
     text: auto;
     set text_z0;
-    font-size: 10;
+    font-size: 10 + prop("font-size-summand");
     font-weight: bold;
     text-color:black;
     text-halo-color: white;
@@ -5101 +5104 @@
     set icon_z0;
     text: auto;
     set text_z0;
-    font-size: 10;
+    font-size: 10 + prop("font-size-summand");
     font-weight: bold;
     text-color:black;
     text-halo-color: white;
@@ -5160 +5163 @@
 
 node {
     text: auto;
+    node-size-factor: JOSM_pref("node-size-factor", 1);
 }
 node|z-16[setting("hide_icons")],
 node|z17-[!is_prop_set("icon-image")][setting("hide_icons")]!.maxspeedclass,
 node[!is_prop_set("icon-image")][!setting("hide_icons")]!.maxspeedclass {
-    symbol-size: 2;
+    symbol-size: 2 * prop("node-size-factor");
     symbol-shape: square;
     symbol-stroke-color: node_standard#ffff00;
     major-z-index: 4.95; /* put node squares above line text */
@@ -5180 +5184 @@
     symbol-fill-color: node_tagged#00ffff;
 }
 
-way > node|z16[setting("shrink_nodes")]!:tagged { symbol-size: 1; }
+way > node|z16[setting("shrink_nodes")]!:tagged { symbol-size: 1 * prop("node-size-factor"); }
 
-node|z17[setting("shrink_nodes")]               { symbol-size: 4; }
-way > node|z17[setting("shrink_nodes")]         { symbol-size: 2; }
-node|z17[setting("shrink_nodes")]:connection    { symbol-size: 4; }
-
-node|z18[setting("shrink_nodes")]               { symbol-size: 4; }
-way > node|z18[setting("shrink_nodes")]         { symbol-size: 3; }
-node|z18[setting("shrink_nodes")]:connection    { symbol-size: 5; }
-
-node|z19-[setting("shrink_nodes")]              { symbol-size: 4; }
-way > node|z19-[setting("shrink_nodes")]        { symbol-size: 4; }
-node|z19-[setting("shrink_nodes")]:connection   { symbol-size: 6; }
-
-node[!setting("shrink_nodes")]                  { symbol-size: 4; }
-way > node[!setting("shrink_nodes")]            { symbol-size: 4; }
-node[!setting("shrink_nodes")]:connection       { symbol-size: 6; }
+node|z17[setting("shrink_nodes")]               { symbol-size: 4 * prop("node-size-factor"); }
+way > node|z17[setting("shrink_nodes")]         { symbol-size: 2 * prop("node-size-factor"); }
+node|z17[setting("shrink_nodes")]:connection    { symbol-size: 4 * prop("node-size-factor"); }
+
+node|z18[setting("shrink_nodes")]               { symbol-size: 4 * prop("node-size-factor"); }
+way > node|z18[setting("shrink_nodes")]         { symbol-size: 3 * prop("node-size-factor"); }
+node|z18[setting("shrink_nodes")]:connection    { symbol-size: 5 * prop("node-size-factor"); }
+
+node|z19-[setting("shrink_nodes")]              { symbol-size: 4 * prop("node-size-factor"); }
+way > node|z19-[setting("shrink_nodes")]        { symbol-size: 4 * prop("node-size-factor"); }
+node|z19-[setting("shrink_nodes")]:connection   { symbol-size: 6 * prop("node-size-factor"); }
+
+node[!setting("shrink_nodes")]                  { symbol-size: 4 * prop("node-size-factor"); }
+way > node[!setting("shrink_nodes")]            { symbol-size: 4 * prop("node-size-factor"); }
+node[!setting("shrink_nodes")]:connection       { symbol-size: 6 * prop("node-size-factor"); }
 
 node:selected {
     symbol-shape: square;
-    symbol-size: 6;
+    symbol-size: 6 * prop("node-size-factor");
     symbol-fill-color: node_selected#ff0000;
     symbol-stroke-color: node_selected#ff0000;
 }
@@ -5216 +5220 @@
     text: auto;
 }
 
-node|z19,area|z19   { font-size: 9; }
-node|z20-,area|z20-   { font-size: 10; }
+node|z-18,area|z-18 { font-size: 8 + prop("font-size-summand"); }
+node|z19,area|z19   { font-size: 9 + prop("font-size-summand"); }
+node|z20-,area|z20- { font-size: 10 + prop("font-size-summand"); }
+
 
 /*******************/
 /* way text labels */
@@ -5246 +5252 @@
 way|z17-[highway=road][setting("highway_labels")] {
     text: auto;
     text-color: black;
-    font-size: 9;
+    font-size: 9 + prop("font-size-summand");
     text-position: line;
     text-halo-opacity: 1;
     text-halo-radius: 1.5;
@@ -5310 +5316 @@
     text-halo-color: service#809bc0;
 }
 way|z18[highway][setting("highway_labels")] {
-    font-size: 10;
+    font-size: 10 + prop("font-size-summand");
 }
 way|z19[highway][setting("highway_labels")] {
-    font-size: 11;
+    font-size: 11 + prop("font-size-summand");
 }
 way|z20-[highway][setting("highway_labels")] {
-    font-size: 12;
+    font-size: 12 + prop("font-size-summand");
 }
 
 /*************/

[stoecker]

I don't like this approach to modify the style. The MapCSS code should automatically apply the scaling factor to any supplied font-size. The iconsize.map probably does only affect some of the places with sizes for map display. There may be a lot of places in the code where still hard-coded sizes are used.

[Klumbumbus]

My intention was to provide a solution until #9995 (which should include the map scaling) is fixed since it seems that it will take a while until #9995 is fixed.
It is a bit a regression, that mappaint.node.unselected-size, mappaint.node.selected-size, mappaint.node.tagged-size and mappaint.node.connection-size do no longer work since #10363.

[bastiK]

What about a separate style maintained in the wiki?

[Klumbumbus]

I created an external style: Styles/HiDPISupport