Using Datazoom with AMP
Implementation of Datazoom into AMP. The plugin can be implemented by providing a datazoom
object in the player config:
var config = { plugins: { datazoom: { resources: [ { src: "../akamai/amp/datazoom/Datazoom.min.js", debug: "../akamai/amp/datazoom/Datazoom.js", type: "text/javascript" } ], config: "https://stagingplatform.datazoom.io/beacon/v1/config?configuration_id=81971cf0-e1bc-4213-96a7-2ceac3f9dcb7", metadata: { platform: "html5", width: "#{player.width}", height: "#{player.height}" } } } }; akamai.amp.AMP.create("amp", config);
Custom metadata can be passed by adding each key-value pair in metadata
object, these could either be an existing variable in DOM, static value or an exposed DOM function/method. Player and media data are accessible as well through player data binding. i.e
var config = { plugins: { datazoom: { resources: [ { src: "../akamai/amp/datazoom/Datazoom.min.js", debug: "../akamai/amp/datazoom/Datazoom.js", type: "text/javascript" } ], config: "https://stagingplatform.datazoom.io/beacon/v1/config?configuration_id=81971cf0-e1bc-4213-96a7-2ceac3f9dcb7", metadata: { foo: "bar", test: "#{window.getValue()}", title: "#{media.title}" } } } }; akamai.amp.AMP.create("amp", config);