fixes #1878 supports id attribute for container
diff --git a/README.md b/README.md
index 72c4f88..e814f66 100644
--- a/README.md
+++ b/README.md
@@ -244,7 +244,8 @@
clearCanvas: false,
progressiveLoad: false, // Boolean, only svg renderer, loads dom elements when needed. Might speed up initialization for large number of elements.
hideOnTransparent: true, //Boolean, only svg renderer, hides elements when opacity reaches 0 (defaults to true)
- className: 'some-css-class-name'
+ className: 'some-css-class-name',
+ id: 'some-id',
}
});
```
diff --git a/player/js/renderers/CanvasRenderer.js b/player/js/renderers/CanvasRenderer.js
index c8c21fe..1b406a3 100644
--- a/player/js/renderers/CanvasRenderer.js
+++ b/player/js/renderers/CanvasRenderer.js
@@ -6,7 +6,8 @@
progressiveLoad: (config && config.progressiveLoad) || false,
preserveAspectRatio: (config && config.preserveAspectRatio) || 'xMidYMid meet',
imagePreserveAspectRatio: (config && config.imagePreserveAspectRatio) || 'xMidYMid slice',
- className: (config && config.className) || ''
+ className: (config && config.className) || '',
+ id: (config && config.id) || '',
};
this.renderConfig.dpr = (config && config.dpr) || 1;
if (this.animationItem.wrapper) {
@@ -148,6 +149,9 @@
if(this.renderConfig.className) {
this.animationItem.container.setAttribute('class', this.renderConfig.className);
}
+ if(this.renderConfig.id) {
+ this.animationItem.container.setAttribute('id', this.renderConfig.id);
+ }
}else{
this.canvasContext = this.renderConfig.context;
}
diff --git a/player/js/renderers/SVGRenderer.js b/player/js/renderers/SVGRenderer.js
index bd21084..86838a2 100644
--- a/player/js/renderers/SVGRenderer.js
+++ b/player/js/renderers/SVGRenderer.js
@@ -36,6 +36,7 @@
viewBoxOnly: (config && config.viewBoxOnly) || false,
viewBoxSize: (config && config.viewBoxSize) || false,
className: (config && config.className) || '',
+ id: (config && config.id) || '',
focusable: config && config.focusable
};
@@ -95,10 +96,13 @@
this.svgElement.style.height = '100%';
this.svgElement.style.transform = 'translate3d(0,0,0)';
}
- if(this.renderConfig.className) {
+ if (this.renderConfig.className) {
this.svgElement.setAttribute('class', this.renderConfig.className);
}
- if(this.renderConfig.focusable !== undefined) {
+ if (this.renderConfig.id) {
+ this.svgElement.setAttribute('id', this.renderConfig.id);
+ }
+ if (this.renderConfig.focusable !== undefined) {
this.svgElement.setAttribute('focusable', this.renderConfig.focusable);
}
this.svgElement.setAttribute('preserveAspectRatio',this.renderConfig.preserveAspectRatio);