Voilà le code HTML d'intégration correspondant à la carte interactive ci-dessus !

caller.html (contains the "caller.kml")

 <script onerror = "window.location.href='http://www.owlapps.net/modules/owlapps_apps/embedmap'" src = 'https://www.owlapps.net/modules/owlapps_apps/embedmap/main.js' language="javascript" defer></script>
    
  <iframe name="Combining &amp;lt;Style> and &amp;lt;StyleMap> tags"  style = "border:none;width:100%;min-height:550px;height:100%;" data-owlappsmap = "yes" >
  
    <?xml version="1.0" encoding="UTF-8"?>
    
    <kml xmlns="http://www.opengis.net/kml/2.2">
        
      <Document>
      
        <Snippet>
        
          <![CDATA[
            <div style="padding:5px;background-color:SandyBrown;width:99%;overflow:auto;min-width:250px;height:100%;" > Style and StyleMap tags that are local and from external KML files </div>
          ]]>
          
        </Snippet>
      
        <StyleMap id= "c_stl1" >
        
          <Pair>

            <key>
              normal
            </key>
         
            <styleUrl>
              https://owlapps.000webhostapp.com/modules/owlapps_apps/embedmap/intermed.kml#i_stl1
            </styleUrl>
             
          </Pair>
          
        </StyleMap>
        
        
       <StyleMap id= "c_stl2" >
        
          <Pair>

            <key>
              normal
            </key>
         
            <styleUrl>
              #c_stl3
            </styleUrl>
             
          </Pair>
          
        </StyleMap>
        
         
        <StyleMap id= "c_stl3" >
          
          <Pair>

            <key>
              normal
            </key>
         
            <styleUrl>
              https://owlapps.000webhostapp.com/modules/owlapps_apps/embedmap/intermed2.kml#i2_stl2
            </styleUrl>
             
          </Pair>
          
        </StyleMap>
         
        <Placemark>
        
          <name>
            My polygon
          </name>
          
          <styleUrl>
            #c_stl1
          </styleUrl>
        
         <Style>
         
          <LineStyle>
          
            <richDecos>
            
              <line>
                <color>
                  blue
                </color>
              </line>
            
            </richDecos>
             
          </LineStyle>
          
        </Style>
        
        <description><![CDATA[   ]]> </description>

        <Polygon>
          <outerBoundaryIs>
            <LinearRing>
              <coordinates>
                -4.11091350546312,48.0169631752424,0 -4.111968311330662,48.016795512751,0 -4.112996287467845,48.01619875066696,0 -4.116335978996061,48.01511916621342,0 -4.117159235675508,48.01467071929815,0 -4.119193533073303,48.01319306336958,0 -4.12043173605444,48.01259246629866,0 -4.122260362220679,48.01126397190885,0 -4.123072641956552,48.01067382881821,0 -4.123865921469071,48.00979882508071,0 -4.124465310277188,48.00921407507309,0 -4.126087904227759,48.00803525945474,0 -4.127516295993536,48.00714668961566,0 -4.128133689232359,48.00684729815487,0 -4.13001411102086,48.00637606311322,0 -4.131923178138149,48.00633157933893,0 -4.132983782815333,48.00630685339955,0 -4.134883077000878,48.00612008919195,0 -4.137408656503161,48.0057762396606,0 -4.137822914906741,48.00562413402791,0 -4.139711746731609,48.0052951711824,0 -4.141973814208281,48.00424572586044,0 -4.142175707135008,48.00409868304075,0 -4.142771138045336,48.00351558746947,0 -4.144597144993872,48.00233505008751,0 -4.145786416942792,48.00117012535902,0 -4.146551359132084,48.00001585956961,0 -4.146541058878893,47.99987411111024,0 -4.147124737568923,47.99915063782761,0 -4.147000958581813,47.99745122814895,0 -4.14693912816083,47.99660213599185,0 -4.145789080853105,47.99535408548447,0 -4.14444892348012,47.99439447445729,0 -4.143794395425354,47.99412677417521,0 -4.142898265334432,47.99344035275509,0 -4.141801305061184,47.99290033077803,0 -4.140714746019643,47.9925016146712,0 -4.139367461411556,47.99140251809484,0 -4.137790236181256,47.99002715261097,0 -4.137730967697575,47.98918168834292,0 -4.135522705950444,47.98782289826093,0 -4.134630209408543,47.98713896097919,0 -4.133517560924616,47.98631957809636,0 -4.133297037293929,47.98618387367914,0 -4.132386232835266,47.98521944424321,0 -4.131475984356604,47.98425554680449,0 -4.131255687961758,47.98412000295551,0 -4.130566290746673,47.98329217911074,0 -4.130317503480795,47.98273558783124,0 -4.129839201492089,47.98190349388467,0 -4.129179082833224,47.98149744262432,0 -4.128481348996407,47.98053067005844,0 -4.128041557515404,47.98026017011177,0 -4.126750762944904,47.9798692535771,0 -4.125450994151839,47.97933832667849,0 -4.124133168916632,47.97852749456192,0 -4.12304471328064,47.97799205658596,0 -4.121335017319286,47.97761142971894,0 -4.119424602487776,47.9773756866529,0 -4.117925981520804,47.9769902577855,0 -4.112828440066098,47.97626849156111,0 -4.111155966217864,47.97644739337907,0 -4.108423984012862,47.9765108225475,0 -4.107793534049927,47.97652544938485,0 -4.101901114830781,47.97652193607539,0 -4.10000990637783,47.97656568002537,0 -4.097698452819913,47.9766190961982,0 -4.094966760001116,47.9766821555932,0 -4.092655346463615,47.97673545537504,0 -4.091184453666413,47.9767693457091,0 -4.090133819203704,47.97679353989498,0 -4.088873062594622,47.97682255837609,0 -4.084880682175273,47.97691434600598,0 -4.084460432765211,47.97692399865086,0 -4.081938940679274,47.97698187768319,0 -4.080678196685531,47.97701079353615,0 -4.077953888994394,47.97721324902134,0 -4.076490201810357,47.97738679920079,0 -4.075439493144865,47.97741084197721,0 -4.07357669564735,47.97801370567986,0 -4.072750158201075,47.97831279410843,0 -4.070886431726795,47.97891588931984,0 -4.069856173488344,47.97935991689025,0 -4.069042871726127,47.97993930900576,0 -4.068229294227617,47.98051887697402,0 -4.067001559241791,47.98124838034127,0 -4.066608144866923,47.98181875441266,0 -4.06499929450365,47.98340018932724,0 -4.063789988197008,47.98455204314936,0 -4.063810153187015,47.98497338646465,0 -4.063034616321698,47.98639776918457,0 -4.062653277530893,47.98725101828065,0 -4.062495891884927,47.98838131968017,0 -4.062140821827721,47.98979880298756,0 -4.06216080487355,47.99022138761691,0 -4.0622207826434,47.99148974674067,0 -4.062227449471579,47.9916307311573,0 -4.062320840990608,47.99360569513198,0 -4.062387613013618,47.99501773218989,0 -4.062434385121405,47.996006828029,0 -4.062461123791063,47.99657227404235,0 -4.062487871010402,47.99713790077841,0 -4.063373742952685,47.99796743154912,0 -4.064266831755487,47.99893892181217,0 -4.065372010493932,47.99990612971941,0 -4.06625251431035,48.00059525121427,0 -4.067605089946433,48.00226762210852,0 -4.068493663278627,48.00309957645453,0 -4.069396684780102,48.00421590711464,0 -4.069848427003721,48.00477433911369,0 -4.070978460211049,48.00617120039665,0 -4.071692453467287,48.00772114325332,0 -4.071961436589573,48.00885496280603,0 -4.072025515558524,48.01013683861926,0 -4.072054010858064,48.01070686149702,0 -4.072132422986684,48.01227537825635,0 -4.072153820864104,48.01270339853664,0 -4.072225186786456,48.01413088872723,0 -4.072289468253635,48.01541662340195,0 -4.072325201510298,48.01613132685525,0 -4.072814938196883,48.01740881528026,0 -4.073085098125031,48.01854892710314,0 -4.07420679154332,48.01967033455465,0 -4.07467601199807,48.02052037977872,0 -4.076004585790741,48.02149477716376,0 -4.076907925731072,48.02247946477113,0 -4.078039728893722,48.02374701263575,0 -4.080260903870868,48.02542225847858,0 -4.082453950625883,48.02652370936347,0 -4.083345375776498,48.02722346552142,0 -4.084221803936194,48.02763563521474,0 -4.085517498579981,48.02789416448463,0 -4.085952037933012,48.02802833447369,0 -4.087445796914909,48.02799408378667,0 -4.091302916424007,48.02819387477478,0 -4.093018314912752,48.02829864913893,0 -4.09472571637001,48.02825942053187,0 -4.096646551158846,48.02821526539833,0 -4.097927115085824,48.02818581508215,0 -4.099207684583246,48.02815635392542,0 -4.10111167841936,48.02782420256364,0 -4.102375172486172,48.02750682650968,0 -4.104048084667905,48.02689186804173,0 -4.104884326610307,48.02658445534587,0 -4.105899191657977,48.02569692569206,0 -4.107322602735603,48.02451257865333,0 -4.108318761007873,48.0233388304644,0 -4.108496927506337,48.0227596194681,0 -4.108879345345663,48.02203218576031,0 -4.109244062475231,48.02101821041189,0 -4.109617344092796,48.02014814374662,0 -4.109795124564251,48.01956997547335,0 -4.110797818505487,48.01854265090325,0 -4.110992982658016,48.01825134418336,0 -4.111595998088026,48.01766395161372,0 -4.11091350546312,48.0169631752424,0
              </coordinates>
            </LinearRing>
          </outerBoundaryIs>
        </Polygon>


        <ExtendedData> 
               
          <Data name="width">
          
            <displayName>
              <![CDATA[
                <span style="color:red;" ><b> Width </b></span>
              ]]>
            </displayName>
            
            <value>
              15
            </value>
            
          </Data>
           
        </ExtendedData>

        </Placemark>
        
        <Placemark>
        
          <name><![CDATA[ Polygon, line and point ]]></name>
         
          <styleUrl> #c_stl2 </styleUrl>
          <Style>
          
            <IconStyle>
              
              <richDecos>
                
                <!--
                  Remove or disable this richDecos tag and the label color of these points
                  will be black because of the Style in the final.kml#f_stl2 StyleMap.
                -->
              
               
                <label>
                  <content>
                    <![CDATA[$[name] overridden!]]>
                  </content>
                  <anchor> 0,20  </anchor>
                  <scale>2</scale>
                  <color> red </color>
                </label>
                
              </richDecos>
              
            </IconStyle>
          
          </Style>
          
          <description> __geolink__ </description>
          
          <MultiGeometry>
          
            <Point>
              <coordinates>
                5.075614142544174,47.25905536672283,0
              </coordinates>
            </Point>
            
            <Point>
              <coordinates>
                5.07575,47.25908 
              </coordinates>
            </Point>    
                    
            <LineString>
          
              <coordinates>
                5.075572800690813,47.25913630158269,0 5.075689639317787,47.2589606812192,0
              </coordinates>
            </LineString>
          
            <Polygon>
             
              <outerBoundaryIs>
                <LinearRing>
                  <coordinates>
                    5.075540874379179,47.25902566581779,0 5.075739785686084,47.25899496298661,0 5.075757936424637,47.25908035000109,0 5.075577503345499,47.25911881544968,0 5.075540874379179,47.25902566581779,0
                  </coordinates>
                </LinearRing>
              </outerBoundaryIs>
            </Polygon>
          
          
          </MultiGeometry>
          
         
        </Placemark>
        
      </Document>
          
    </kml>  
      
  </iframe>
 


intermed.kml
<?xml version="1.0" encoding="UTF-8"?>

<kml xmlns="http://www.opengis.net/kml/2.2">
  
  <Document>
  
  
    <StyleMap id= "i_stl1" >
       
      <Pair>
      
        <key>
          normal
        </key>
        
        <styleUrl>
          #i_stl3 
        </styleUrl>
         
        <Style id= "i_stl2">
          <LineStyle>
            <color>
              FFFFFFFF <!-- white color -->
            </color>
          </LineStyle>  
        </Style>
         
      </Pair>
       
    </StyleMap>
    

    <StyleMap id= "i_stl3" >
    
      <Pair>
      
        <key>
          normal
        </key>
      
        <styleUrl>
           https://owlapps.000webhostapp.com/modules/owlapps_apps/embedmap/final.kml#f_stl1
        </styleUrl>
        
        <Style>
       
          <LineStyle>
          
            <width>
              <!--
                the $[width] substitute card gets the  value of the Data (name = "width") 
                of the ExtendedData from the Placemark named "My polygon" in caller.html
              -->
              
              $[width]
              
            </width>  
            
          </LineStyle>  
          
        </Style>
        
      </Pair>
     
    </StyleMap>
    
  </Document>
  
</kml> 
  


intermed2.kml
<?xml version="1.0" encoding="UTF-8"?>

<kml xmlns="http://www.opengis.net/kml/2.2">
  
  <Document>
    
    <StyleMap id= "i2_stl2" >
    
      <Pair>
        <key>
          normal
        </key>
      
        <styleUrl>
          https://owlapps.000webhostapp.com/modules/owlapps_apps/embedmap/final.kml#f_stl2
        </styleUrl>
        
        
      </Pair>
    
    </StyleMap>
    
    
    
    <StyleMap id= "i2_stl3" >
    
      <Pair>
        <key>
          normal
        </key>
      
        <styleUrl>
          #i2_stl1
        </styleUrl>
        
      </Pair>
    
    </StyleMap>
    
    
    <Style id= "i2_stl1">
    
      <PolyStyle>
        <outline> 0 </outline>
        <richDecos>
        
          <inner>
          
            <patternTags>
              <append>
                <![CDATA[
                  <pattern patternUnits="userSpaceOnUse" width="22.5" height="22.5" patternTransform="rotate(45)">
                    <line x1="0" y="0" x2="0" y2="22.5" stroke-opacity="1" stroke="green" stroke-width="25" />
                  </pattern>
                ]]> 
              </append>
            </patternTags>
        
            <colorize>
              <color> white </color> 
            </colorize>
            
          </inner>
          
        </richDecos>  
        
      </PolyStyle>
      
    </Style>
 
  </Document>
  
</kml> 
  


final.kml
<?xml version="1.0" encoding="UTF-8"?>

<kml xmlns="http://www.opengis.net/kml/2.2">
  
  <Document>
    
    <Style id= "f_stl1">
    
      <PolyStyle>
      
        <color>
          FF0000FF
        </color>
        
        <richDecos>
        
          <outer>
          
            <label>
            
              <content>
                $[name]
              </content>
              
              <color>
                black
              </color>
              
            </label>
          
          </outer>
          
        </richDecos>
        
      </PolyStyle> 
       
    </Style>
    
    
    
    <StyleMap id= "f_stl2" >
    
      <Pair>
      
        <key>
          normal
        </key>
      
        <styleUrl>
          https://owlapps.000webhostapp.com/modules/owlapps_apps/embedmap/intermed2.kml#i2_stl3
        </styleUrl>
         
        <Style>

          <IconStyle>
          
            <richDecos>
            
              <label>
              
                <content>
                  $[name] 
                </content>
                <anchor>
                  0,10
                </anchor>
                <scale>
                  2
                </scale>
                <color>
                  black
                </color>
              
              </label>
              
            </richDecos>
            
          </IconStyle>
          
          <LineStyle>
          
            <richDecos>
            
              <line>
                <color> black </color>
                <dashArray> 3, 8 </dashArray>
              </line>
            
            </richDecos>
            
          </LineStyle>
        
        </Style>
      
      </Pair>
     
    </StyleMap>
   
  </Document>
  
</kml>  
  


Video demo: