Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

svg-pan-zoom/demo/object.html issue with Chrome

See original GitHub issue

Bug report

git clone  https://github.com/ariutta/svg-pan-zoom.git

I just git clone as that, and opened svg-pan-zoom/demo/object.html with my chrome 71.0.3578.98(64) in Window7 computer for test, then get this error:

svg-pan-zoom.js:1714 Uncaught TypeError: Cannot read property 'documentElement' of null
    at Object.getSvg (svg-pan-zoom.js:1714)
    at svgPanZoom (svg-pan-zoom.js:1241)
    at window.onload (object.html:15)

I just download and not change the code of object.html. but object.html work with IE. now embed also not work with chrome, but inline work well with chrome.

Configuration

svg-pan-zoom version: git clone just now
Browser(s): chrome 71.0.3578.98(64)
Operating system(s): Window7
A relevant example URL: svg-pan-zoom/demo/object.html in my disk

Issue Analytics

State:
Created 5 years ago
Comments:7 (1 by maintainers)

Top GitHub Comments

2reactions

FrankBuchholzcommented, Apr 15, 2020

Is it possiable access the content of local file by HTML File Upload API then assign the content to innerHTML of a svg？

This is what I do in my project: I read a local XML file via HTML File Upload API which contains graphical elements like line, arc, cubic, clothoid, helix as well as some texts. Then I convert them into svg path elements which I add to the svg DOM element.

You can run the program locally via file:///C:/…/EEP_Gleisplan.html as well as via GitHub pages in Chrome and Firefox (but not in Edge).

1reaction

michtoencommented, Mar 30, 2020

I saw a bug report about local files poiting to this, so i assume its the same.

Modern Browsers updated their CORS rules. You can’t load nested files using the file: protocol mixed with js or media anymore. The browser will refuse loading AND set any javascript file path to null. Thats part of the browser security.

Do not try to trick this out - its now a base part of the browser security. You can’t give file: urls any CORS rule - the browser will always skip this.

You can try it out by starting chrome.exe without the web security like this:

“<YOUR_PATH_TO>\Chrome\Application\chrome.exe” --disable-web-security --disable-site-isolation-trials --disable-gpu --user-data-dir=C:/TEMP/chromeTemp

With that local html with js and media will execute again.

Top Results From Across the Web

Issue with Chrome and IE · Issue #109 · bumbu/svg-pan-zoom

Hello there, I'm having some weird issues with Chrome and IE. ... since it considers the element as html object instead as svg...

SVG pan and zoom JS-plugin fires strange error?

The provided online demo just works fine but whenever I try to ... at p (svg-pan-zoom.min.js:3) at enablePANandZOOM (embed.html:16) at ...

svg-pan-zoom library - npm

On-screen zoom controls. It works cross-browser and supports both inline SVGs and SVGs in HTML object or embed elements. If you're looking for ......

Using Object to load svg has issue in chrome they get ...

Hello, I am using object because I need interactive SVG's. I don't want to use in line SVG's because in my project I...

Libraries / svg-pan-zoom - GitLab

For more details take a look at demo/limit-pan.html example. Public API. When you call svgPanZoom method it returns an object with following methods:...