Publicēts: 24.02.2021.
Piktochart Responsive

<div class="piktowrapper-embed" style="height: 300px; position: relative;" data-uid="51911158-demografija_decembris"><div class="pikto-canvas-wrap"><div class="pikto-canvas"><div class="embed-loading-overlay" style="width: 100%; height: 100%; position: absolute; text-align: center;"><img width="60px" alt="Loading..." style="margin-top: 100px" src="https://create.piktochart.com/loading.gif"/><p style="margin: 0; padding: 0; font-family: Lato, Helvetica, Arial, sans-serif; font-weight: 600; font-size: 16px">Loading...</p></div></div></div></div><script>(function(d){var js, id="pikto-embed-js", ref=d.getElementsByTagName("script")[0];if (d.getElementById(id)) { return;}js=d.createElement("script"); js.id=id; js.async=true;js.src="https://create.piktochart.com/assets/embedding/embed.js";ref.parentNode.insertBefore(js, ref);}(document));</script>

Loading...(function(d){var js, id="pikto-embed-js", ref=d.getElementsByTagName("script")[0];if (d.getElementById(id)) { return;}js=d.createElement("script"); js.id=id; js.async=true;js.src="https://create.piktochart.com/assets/embedding/embed.js";ref.parentNode.insertBefore(js, ref);}(document));
Piktochart

<iframe width="800" height="2601" frameborder="0"scrolling="no" style="overflow-y:hidden;" src="https://create.piktochart.com/embed/51911158-demografija_decembris" ></iframe>

Prezi

<script async src="https://e.prezicdn.net/v1/design.js"></script><div class="prezi-design-embed" data-project-id="m7vnpc6_dpqy"></div>

Hichart Statistikas portāls

<iframe src="https://stat.gov.lv/lv/grafiks/pr2021izglitiba1" width="700" height="500"></iframe>

ISK embed

<style type="text/css">
.iframe-resizable{
  width: 1px;
  height: 1px;
  border: 0 !important;
  overflow: hidden !important;
  }
 .iframe-container {
    position: relative;
    overflow: hidden;
    padding-top: 100%;
 }
</style>
<script>
  const updateIframeSize=(ob)=>{
    /*
    data:
    dom_id: "xyz"
    func: "updateIframeSize"
    width: 100
    height: 1200
    */
    console.log('****************');
    console.log('PAGE - updateIframeSize id:'+ob.dom_id+' w:'+ob.width+' h:'+ob.height);
    console.dir(ob);
    console.log('****************');
    const element = document.getElementById(ob.dom_id);
    element.width = ob.width+'px';
    element.height = ob.height+'px';
    element.style.width = ob.width+'px';
    element.style.height = ob.height+'px';
  };
  window.onmessage = (e) => {
    if (e.data.func == 'updateIframeSize'){
      updateIframeSize(e.data);
    }
    e.stopPropagation();
    e.preventDefault();
  };
</script>

<div class="iframe-container">
  <iframe id="xyz" class="iframe-resizable" src="https://tools.csb.gov.lv/isk/lv?embed=1&dom_id=xyz&title=1&footer=1" style="border:none;"></iframe>
</div>

.iframe-resizable{ width: 1px; height: 1px; border: 0 !important; overflow: hidden !important; } .iframe-container { position: relative; overflow: hidden; padding-top: 100%; } const updateIframeSize=(ob)=>{ /* data: dom_id: "xyz" func: "updateIframeSize" width: 100 height: 1200 */ console.log('****************'); console.log('PAGE - updateIframeSize id:'+ob.dom_id+' w:'+ob.width+' h:'+ob.height); console.dir(ob); console.log('****************'); const element = document.getElementById(ob.dom_id); element.width = ob.width+'px'; element.height = ob.height+'px'; element.style.width = ob.width+'px'; element.style.height = ob.height+'px'; }; window.onmessage = (e) => { if (e.data.func == 'updateIframeSize'){ updateIframeSize(e.data); } e.stopPropagation(); e.preventDefault(); };