Могу ли я реализовать анимацию D3 svg на странице AMP?

Question

Как я могу вставить элемент SVG на хорошо сформированной странице AMP со сценарием, использующим библиотеку d3.js для его анимации? Как я могу построить хорошо сформированную страницу AMP с визуализацией данных d3?

Answer 1

Вам нужно будет поместить интерактивную графику в отдельный файл html, а затем вставить его в качестве amp-iframe.

From the documentation:

Загрузите сценарий AMP в голову тег:

<script async custom-element="amp-iframe" src="https://cdn.ampproject.org/v0/amp-iframe-0.1.js"></script> 

Загрузите IFrame на страницу, по крайней мере 600px или 75% от первого видового экрана сверху.

<amp-iframe width=300 height=300 
    sandbox="allow-scripts allow-same-origin allow-popups allow-popups-to-escape-sandbox" 
    layout="responsive" 
    frameborder="0" 
    src="https://www.google.com/maps/embed/v1/place?key=AIzaSyDG9YXIhKBhqclZizcSzJ0ROiE0qgVfwzI&q=Alameda,%20CA"> 
</amp-iframe>