fix(labels): reverts sources order (#18)

When multiple sources are used, labels were defined in rendering order. That means that the bottom layer labels had precedence over the top layer ones. This changes it to make the top ones have precedence
felt · Mar 28, 2022 · e1c1f35 · e1c1f35
1 parent 9368667
commit e1c1f35
Show file tree

Hide file tree

Showing 5 changed files with 9 additions and 5 deletions.
diff --git a/dist/frontends/leaflet.js b/dist/frontends/leaflet.js
@@ -325,7 +325,9 @@ const leafletLayer = (options) => {
                     console.warn("Overwritting the basemap using updateDataSources will result in duplicated rules");
                 this.views.set(d.name, sourceToView(d.options));
                 this.paint_rules = this.paint_rules.concat(d.paintRules);
-                dataLabelRules.push(...d.labelRules);
+                // We want top layer labels to be shown first so we need to reverse label rules
+                // order
+                dataLabelRules.unshift(...d.labelRules);
             });
             if (dataLabelRules.length !== 0) {
                 this.label_rules = dataLabelsOnTop

diff --git a/dist/protomaps.js b/dist/protomaps.js
@@ -5105,7 +5105,7 @@ var protomaps = (() => {
             console.warn("Overwritting the basemap using updateDataSources will result in duplicated rules");
           this.views.set(d.name, sourceToView(d.options));
           this.paint_rules = this.paint_rules.concat(d.paintRules);
-          dataLabelRules.push(...d.labelRules);
+          dataLabelRules.unshift(...d.labelRules);
         });
         if (dataLabelRules.length !== 0) {
           this.label_rules = dataLabelsOnTop ? dataLabelRules.concat(this.label_rules) : this.label_rules.concat(dataLabelRules);

diff --git a/dist/protomaps.min.js b/dist/protomaps.min.js
diff --git a/dist/protomaps.module.js b/dist/protomaps.module.js
@@ -5030,7 +5030,7 @@ var leafletLayer = (options) => {
           console.warn("Overwritting the basemap using updateDataSources will result in duplicated rules");
         this.views.set(d.name, sourceToView(d.options));
         this.paint_rules = this.paint_rules.concat(d.paintRules);
-        dataLabelRules.push(...d.labelRules);
+        dataLabelRules.unshift(...d.labelRules);
       });
       if (dataLabelRules.length !== 0) {
         this.label_rules = dataLabelsOnTop ? dataLabelRules.concat(this.label_rules) : this.label_rules.concat(dataLabelRules);

diff --git a/src/frontends/leaflet.ts b/src/frontends/leaflet.ts
@@ -464,7 +464,9 @@ const leafletLayer = (options: any): any => {
           );
         this.views.set(d.name, sourceToView(d.options));
         this.paint_rules = this.paint_rules.concat(d.paintRules);
-        dataLabelRules.push(...d.labelRules);
+        // We want top layer labels to be shown first so we need to reverse label rules
+        // order
+        dataLabelRules.unshift(...d.labelRules);
       });
 
       if (dataLabelRules.length !== 0) {