Opened 10 years ago

Last modified 10 years ago

#12495 closed enhancement

[patch] mappaint support for HIDPI screens — at Initial Version

Reported by: Klumbumbus Owned by: team
Priority: normal Milestone:
Component: External mappaint style Version:
Keywords: hidpi Cc: bastiK

Description

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.

  • styles/standard/elemstyles.mapcss

     
    1616    default-points: false;
    1717}
    1818
     19* {
     20    font-size-summand: JOSM_pref("font-size-summand", 0);
     21}
    1922/*************************/
    2023/* create style settings */
    2124/*************************/
     
    49394942    set icon_z0;
    49404943    text: auto;
    49414944    set text_z0;
    4942     font-size: 10;
     4945    font-size: 10 + prop("font-size-summand");
    49434946    font-weight: bold;
    49444947    text-color:black;
    49454948    text-halo-color: white;
     
    49724975    set icon_z0;
    49734976    text: auto;
    49744977    set text_z0;
    4975     font-size: 10;
     4978    font-size: 10 + prop("font-size-summand");
    49764979    font-weight: bold;
    49774980    text-color:black;
    49784981    text-halo-color: white;
     
    49844987    set icon_z0;
    49854988    text: auto;
    49864989    set text_z0;
    4987     font-size: 10;
     4990    font-size: 10 + prop("font-size-summand");
    49884991    font-weight: bold;
    49894992    text-color:black;
    49904993    text-halo-color: white;
     
    49964999    set icon_z0;
    49975000    text: auto;
    49985001    set text_z0;
    4999     font-size: 10;
     5002    font-size: 10 + prop("font-size-summand");
    50005003    font-weight: bold;
    50015004    text-color:black;
    50025005    text-halo-color: white;
     
    50085011    set icon_z0;
    50095012    text: auto;
    50105013    set text_z0;
    5011     font-size: 10;
     5014    font-size: 10 + prop("font-size-summand");
    50125015    font-weight: bold;
    50135016    text-color:black;
    50145017    text-halo-color: white;
     
    50205023    set icon_z0;
    50215024    text: auto;
    50225025    set text_z0;
    5023     font-size: 10;
     5026    font-size: 10 + prop("font-size-summand");
    50245027    font-weight: bold;
    50255028    text-color:black;
    50265029    text-halo-color: white;
     
    50325035    set icon_z0;
    50335036    text: auto;
    50345037    set text_z0;
    5035     font-size: 10;
     5038    font-size: 10 + prop("font-size-summand");
    50365039    font-weight: bold;
    50375040    text-color:black;
    50385041    text-halo-color: white;
     
    50445047    set icon_z0;
    50455048    text: auto;
    50465049    set text_z0;
    5047     font-size: 10;
     5050    font-size: 10 + prop("font-size-summand");
    50485051    font-weight: bold;
    50495052    text-color:black;
    50505053    text-halo-color: white;
     
    50565059    set icon_z0;
    50575060    text: auto;
    50585061    set text_z0;
    5059     font-size: 10;
     5062    font-size: 10 + prop("font-size-summand");
    50605063    font-weight: bold;
    50615064    text-color:black;
    50625065    text-halo-color: white;
     
    50685071    set icon_z0;
    50695072    text: auto;
    50705073    set text_z0;
    5071     font-size: 10;
     5074    font-size: 10 + prop("font-size-summand");
    50725075    font-weight: bold;
    50735076    text-color:black;
    50745077    text-halo-color: white;
     
    50795082node|z-14[place=locality][!setting("hide_icons")] {
    50805083    icon-image: "place/locality.png";
    50815084    text: auto;
    5082     font-size: 10;
     5085    font-size: 10 + prop("font-size-summand");
    50835086    font-weight: bold;
    50845087    text-color:black;
    50855088    text-halo-color: white;
     
    50905093    set icon_z0;
    50915094    text: auto;
    50925095    set text_z0;
    5093     font-size: 10;
     5096    font-size: 10 + prop("font-size-summand");
    50945097    font-weight: bold;
    50955098    text-color:black;
    50965099    text-halo-color: white;
     
    51015104    set icon_z0;
    51025105    text: auto;
    51035106    set text_z0;
    5104     font-size: 10;
     5107    font-size: 10 + prop("font-size-summand");
    51055108    font-weight: bold;
    51065109    text-color:black;
    51075110    text-halo-color: white;
     
    51605163
    51615164node {
    51625165    text: auto;
     5166    node-size-factor: JOSM_pref("node-size-factor", 1);
    51635167}
    51645168node|z-16[setting("hide_icons")],
    51655169node|z17-[!is_prop_set("icon-image")][setting("hide_icons")]!.maxspeedclass,
    51665170node[!is_prop_set("icon-image")][!setting("hide_icons")]!.maxspeedclass {
    5167     symbol-size: 2;
     5171    symbol-size: 2 * prop("node-size-factor");
    51685172    symbol-shape: square;
    51695173    symbol-stroke-color: node_standard#ffff00;
    51705174    major-z-index: 4.95; /* put node squares above line text */
     
    51805184    symbol-fill-color: node_tagged#00ffff;
    51815185}
    51825186
    5183 way > node|z16[setting("shrink_nodes")]!:tagged { symbol-size: 1; }
     5187way > node|z16[setting("shrink_nodes")]!:tagged { symbol-size: 1 * prop("node-size-factor"); }
    51845188
    5185 node|z17[setting("shrink_nodes")]               { symbol-size: 4; }
    5186 way > node|z17[setting("shrink_nodes")]         { symbol-size: 2; }
    5187 node|z17[setting("shrink_nodes")]:connection    { symbol-size: 4; }
    5188 
    5189 node|z18[setting("shrink_nodes")]               { symbol-size: 4; }
    5190 way > node|z18[setting("shrink_nodes")]         { symbol-size: 3; }
    5191 node|z18[setting("shrink_nodes")]:connection    { symbol-size: 5; }
    5192 
    5193 node|z19-[setting("shrink_nodes")]              { symbol-size: 4; }
    5194 way > node|z19-[setting("shrink_nodes")]        { symbol-size: 4; }
    5195 node|z19-[setting("shrink_nodes")]:connection   { symbol-size: 6; }
    5196 
    5197 node[!setting("shrink_nodes")]                  { symbol-size: 4; }
    5198 way > node[!setting("shrink_nodes")]            { symbol-size: 4; }
    5199 node[!setting("shrink_nodes")]:connection       { symbol-size: 6; }
     5189node|z17[setting("shrink_nodes")]               { symbol-size: 4 * prop("node-size-factor"); }
     5190way > node|z17[setting("shrink_nodes")]         { symbol-size: 2 * prop("node-size-factor"); }
     5191node|z17[setting("shrink_nodes")]:connection    { symbol-size: 4 * prop("node-size-factor"); }
     5192
     5193node|z18[setting("shrink_nodes")]               { symbol-size: 4 * prop("node-size-factor"); }
     5194way > node|z18[setting("shrink_nodes")]         { symbol-size: 3 * prop("node-size-factor"); }
     5195node|z18[setting("shrink_nodes")]:connection    { symbol-size: 5 * prop("node-size-factor"); }
     5196
     5197node|z19-[setting("shrink_nodes")]              { symbol-size: 4 * prop("node-size-factor"); }
     5198way > node|z19-[setting("shrink_nodes")]        { symbol-size: 4 * prop("node-size-factor"); }
     5199node|z19-[setting("shrink_nodes")]:connection   { symbol-size: 6 * prop("node-size-factor"); }
     5200
     5201node[!setting("shrink_nodes")]                  { symbol-size: 4 * prop("node-size-factor"); }
     5202way > node[!setting("shrink_nodes")]            { symbol-size: 4 * prop("node-size-factor"); }
     5203node[!setting("shrink_nodes")]:connection       { symbol-size: 6 * prop("node-size-factor"); }
    52005204
    52015205node:selected {
    52025206    symbol-shape: square;
    5203     symbol-size: 6;
     5207    symbol-size: 6 * prop("node-size-factor");
    52045208    symbol-fill-color: node_selected#ff0000;
    52055209    symbol-stroke-color: node_selected#ff0000;
    52065210}
     
    52165220    text: auto;
    52175221}
    52185222
    5219 node|z19,area|z19   { font-size: 9; }
    5220 node|z20-,area|z20-   { font-size: 10; }
     5223node|z-18,area|z-18 { font-size: 8 + prop("font-size-summand"); }
     5224node|z19,area|z19   { font-size: 9 + prop("font-size-summand"); }
     5225node|z20-,area|z20- { font-size: 10 + prop("font-size-summand"); }
     5226
    52215227
    52225228/*******************/
    52235229/* way text labels */
     
    52465252way|z17-[highway=road][setting("highway_labels")] {
    52475253    text: auto;
    52485254    text-color: black;
    5249     font-size: 9;
     5255    font-size: 9 + prop("font-size-summand");
    52505256    text-position: line;
    52515257    text-halo-opacity: 1;
    52525258    text-halo-radius: 1.5;
     
    53105316    text-halo-color: service#809bc0;
    53115317}
    53125318way|z18[highway][setting("highway_labels")] {
    5313     font-size: 10;
     5319    font-size: 10 + prop("font-size-summand");
    53145320}
    53155321way|z19[highway][setting("highway_labels")] {
    5316     font-size: 11;
     5322    font-size: 11 + prop("font-size-summand");
    53175323}
    53185324way|z20-[highway][setting("highway_labels")] {
    5319     font-size: 12;
     5325    font-size: 12 + prop("font-size-summand");
    53205326}
    53215327
    53225328/*************/

Change History (0)

Note: See TracTickets for help on using tickets.