diff --git a/dist/ol-ext.js b/dist/ol-ext.js
index f4483fdc..79e7f53e 100644
--- a/dist/ol-ext.js
+++ b/dist/ol-ext.js
@@ -1,7 +1,7 @@
 /**
  * ol-ext - A set of cool extensions for OpenLayers (ol) in node modules structure
  * @description ol3,openlayers,popup,menu,symbol,renderer,filter,canvas,interaction,split,statistic,charts,pie,LayerSwitcher,toolbar,animation
- * @version v4.0.23
+ * @version v4.0.24
  * @author Jean-Marc Viglino
  * @see https://github.com/Viglino/ol-ext#,
  * @license BSD-3-Clause
diff --git a/dist/ol-ext.min.js b/dist/ol-ext.min.js
index f244a272..04f8c138 100644
--- a/dist/ol-ext.min.js
+++ b/dist/ol-ext.min.js
@@ -1,7 +1,7 @@
 /**
  * ol-ext - A set of cool extensions for OpenLayers (ol) in node modules structure
  * @description ol3,openlayers,popup,menu,symbol,renderer,filter,canvas,interaction,split,statistic,charts,pie,LayerSwitcher,toolbar,animation
- * @version v4.0.23
+ * @version v4.0.24
  * @author Jean-Marc Viglino
  * @see https://github.com/Viglino/ol-ext#,
  * @license BSD-3-Clause
diff --git a/examples/layer/map.layer.gppvtile.js b/examples/layer/map.layer.gppvtile.js
index 64cdd470..b36a7133 100644
--- a/examples/layer/map.layer.gppvtile.js
+++ b/examples/layer/map.layer.gppvtile.js
@@ -58,6 +58,7 @@ var vlayer = new ol.layer.VectorTile({
     url : "https://data.geopf.fr/tms/1.0.0/PLAN.IGN/{z}/{x}/{y}.pbf",
     // url : "https://wxs.ign.fr/essentiels/geoportail/tms/1.0.0/PLAN.IGN/{z}/{x}/{y}.pbf",
     // url: "https://vectortiles.ign.fr/rok4server/1.0.0/PLAN.IGN/{z}/{x}/{y}.pbf",
+    // url: "https://tiles.openfreemap.org/planet/20241002_001001_pt/{z}/{x}/{y}.pbf",
     attributions: '<a href="https://geoservices.ign.fr/blog/2018/07/08/nouveautes_vecteur.html">&copy; IGN-Géoportail</a>',
   }),
   declutter: true
@@ -78,6 +79,7 @@ ol.ext.Ajax.get({
   //url: 'http://calac-4.ign.fr/pyramide_ecran/style_mapbox.json',
   // url: 'https://vectortiles.ign.fr/demonstrateur/styles/gris.json',
   // url: 'https://vectortiles.ign.fr/demonstrateur/styles/muet.json',
+  // url: '../data/liberty.json',
   success: function(style) {
     /* add sens circu * /
     style.layers.push(rdirect);
@@ -115,7 +117,10 @@ drop.on('loadend', function(e) {
     var json = JSON.parse(e.result);
     reset();
     setBaseStyle(json);
-  } catch(e) { /* ok */ }
+  } catch(e) { 
+    console.log(e)
+    /* ok */ 
+  }
 })
 
 // Set base style
@@ -132,8 +137,16 @@ function setBaseStyle(n) {
     }
   }
   currentStyle.layers.forEach(function(l) {
-    var source = l['source-layer'];
+    var source = l['source-layer'] || l.id;
     var theme = source.split('_')[0];
+    console.log(source, theme)
+    if (!config[theme]) {
+      config[theme] = { style: {}}
+    }
+    if (!config[theme].style[source]) {
+      config[theme].style[source] = { layers: [] }
+    }
+    if (!l.layout) l.layout = {}
     config[theme].style[source].layers.push(l);
     config[theme].style[source].visible = l.layout.visibility!=='none';
     $('.options input.'+source).prop('checked', l.layout.visibility!=='none')
@@ -187,9 +200,10 @@ function applyStyle() {
       style = config[theme].style[st];
       if (!style.savePaintColor) style.savePaintColor = [];
       style.layers.forEach(function(l, i) {
+        if (!l.layout) l.layout = {};
         l.layout.visibility = (vis && style.visible) ? 'visible' : 'none';
         ['text-color', /*'text-halo-color',*/ 'fill-color', 'fill-outline-color', 'line-color', 'circle-color', 'circle-stroke-color', 'icon-color'].forEach(function(c) {
-          if (!l.paint[c]) return;
+          if (!l.paint || !l.paint[c]) return;
           if (!style.savePaintColor[i]) style.savePaintColor[i] = {};
           var savePaintColor = style.savePaintColor[i];
           // Init
@@ -286,7 +300,6 @@ function showLayers() {
     }
   });
   var ul = $('.options ul');
-  console.log(sources)
   Object.keys(sources).forEach(function(s) {
     config[s] = {
       visible: true,
@@ -348,6 +361,7 @@ function showLayers() {
       var li = $('<li>').appendTo(ul2);
       var source = sources[s][i][0];
       var label = $('<label>').text(i.replace(/toponyme_|routier_|ocs_|hydro_|parcellaire_/, '')).attr('title', i).appendTo(li);
+      if (!source.layout) source.layout = { visibility: 'visible' }
       config[s].style[i] = {
         visible: source.layout.visibility!=='none',
         layers: sources[s][i]
diff --git a/examples/storymap/map.control.imageline.html b/examples/storymap/map.control.imageline.html
index 678c34b3..5bd278f8 100644
--- a/examples/storymap/map.control.imageline.html
+++ b/examples/storymap/map.control.imageline.html
@@ -83,23 +83,26 @@ <h1>ol-ext: Image line control</h1>
 
   <div class="options">
     <ul>
-      <li>
+     <li>
         <label>
-          <input id="extent" type="checkbox" onclick="iline.useExtent($(this).prop('checked'));" />
-          Show only visible images
+          Links
         </label>
+        <select onchange="iline.set('linkColor', this.value); iline.refresh()">
+          <option value="">none</option>
+          <option value="rgba(255,0,0,.7)">red</option>
+          <option value="rgba(0,255,0,.7)">green</option>
+          <option value="rgba(0,0,255,.7)">blue</option>
+          <option value="rgba(0,0,0,.7)">black</option>
+          <option value="rgba(255,255,255,.7)">white</option>
+        </select>
       </li>
       <li>
         <label>
-          <input 
-            id="link" 
-            type="checkbox" 
-            onclick="iline.set('linkColor', $(this).prop('checked') ? 'rgba(255,255,255,.7)':false);" 
-          />
-          Draw links
+          <input id="extent" type="checkbox" onclick="iline.useExtent($(this).prop('checked'));" />
+          Show only visible images
         </label>
       </li>
-      <li>
+       <li>
         <label>
           <input id="hover" type="checkbox" onclick="iline.set('hover',$(this).prop('checked'));" 
           />