fix: DPR in canvas

scaleflex · Mar 16, 2022 · 341aed9 · 341aed9
1 parent 556a654
commit 341aed9
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 3 deletions.
diff --git a/src/ci360.service.js b/src/ci360.service.js
@@ -769,8 +769,8 @@ import {
     }
 
     const ctx = this.canvas.getContext("2d");
-
     ctx.scale(this.devicePixelRatio, this.devicePixelRatio);
+
     this.updateContainerAndCanvasSize(image);
 
     if (this.fullscreenView) {
@@ -835,6 +835,7 @@ import {
     if (!this.hide360Logo && !this.lazyload) this.add360ViewIcon();
 
     const ctx = this.canvas.getContext("2d");
+    ctx.scale(this.devicePixelRatio, this.devicePixelRatio);
     this.updateContainerAndCanvasSize(image);
 
     if (this.fullscreenView) {

diff --git a/src/ci360.utils.js b/src/ci360.utils.js
@@ -48,7 +48,7 @@ const get360ViewProps = (image) => ({
   stopAtEdges: isTrue(image, 'stop-at-edges'),
   hide360Logo: isTrue(image, 'hide-360-logo'),
   logoSrc: attr(image, 'logo-src') || 'https://scaleflex.ultrafast.io/https://scaleflex.airstore.io/filerobot/js-cloudimage-360-view/360_view.svg',
-  ratio: attr(image, 'ratio') || attr(image, 'data-ratio') || null,
+  ratio: attr(image, 'ratio') || attr(image, 'data-ratio'),
   imageInfo: attr(image, 'info')|| attr(image, 'data-info') || isTrue(image, 'info')
 });
 

diff --git a/src/utils/responsive/get-image-aspect-ratio.js b/src/utils/responsive/get-image-aspect-ratio.js
@@ -6,7 +6,7 @@ export const getImageAspectRatio = (image, providedRatio) => {
       imageAspectRatio = providedRatio;
     }
 
-    if (typeof providedRatio === 'object') {
+    if (providedRatio && typeof providedRatio === 'object') {
       const mediaQueries = Object.keys(providedRatio)
         .sort((a, b) => a - b);