Login
logo
Compare

Viewon : Why my objects are not properly displayed in Chrome and Edge ?

10 Jul 2025

This article describes what you can do if you recently faced a rendering issue of your Viewon dashboards in Chrome or Edge (not in Firefox) : 

Viewon:

Result in Firefox : OK

Result in Edge : NOK

This rendering issue is caused by a bug introduced in version 136.0.0.0 of the Chromium engine, which powers browsers such as Edge, Chrome, and others (Chromium issue #416091463).

The bug occurs when using Viewon's rotation feature to rotate objects and symbols.

Below is a temporary workaround you can apply within Viewon while the Chromium community works on a permanent fix.

 

APPLICABLE PRODUCTS

Viewon Software

Ewon: Flexy

Ewon: xxxxCD

 

ISSUE

Wrong rendering of the Viewon dashboard due to a bug in Chromium.

 

WORKAROUND

  1. Edit the file C:\Program Files (x86)\ViewON\htmlsources\css\viewon-core-1.2.0.css and add the following lines at the top of it : 
     

    .is-chromium svg {
 will-change: transform;
 transform: translateZ(0);
}



  2. Edit the file C:\Program Files (x86)\ViewON\htmlsources\js\viewon-core-1.2.0.js and the following lines at the end of the file and save it : 
     

    function isChromium() {
  const ua = navigator.userAgent;

  const hasWindowChrome = typeof window.chrome !== "undefined";
  console.log("window.chrome exists:", hasWindowChrome);

  const hasChromiumUA = ua.includes("Chromium");
  console.log("User-Agent includes 'Chromium':", hasChromiumUA);

  const hasChromeUA = ua.includes("Chrome");
  console.log("User-Agent includes 'Chrome':", hasChromeUA);

  const hasEdgeUA = ua.includes("Edg");
  console.log("User-Agent includes 'Edg':", hasEdgeUA);

  const isFirefox = ua.includes("Firefox");
  console.log("User-Agent includes 'Firefox':", isFirefox);

  const isSafari = ua.includes("Safari") && !ua.includes("Chrome") && !ua.includes("Chromium") && !ua.includes("Edg");
  console.log("User-Agent is Safari:", isSafari);

  const result =
    hasWindowChrome &&
    (hasChromeUA || hasChromiumUA || hasEdgeUA) &&
    !isFirefox &&
    !isSafari;

  console.log("✅ isChromium result:", result);
  return result;
}

  if (isChromium()) {
    document.documentElement.classList.add('is-chromium');
  }


  3. Recompile and resend your project to your Flexy 

© HMS Networks AB 2025