use interactive SVG files on sharepoint site
We would like to use sharepoint as a portal for our customers to view different spareparts of our machines. The way I want to set this up is to export SVG files from Solidworks Composer and upload them in SP, where you cano open the Main image and from there on click on a specific part to open a specific image. The files I'm exporting already have multiple hotspots (links) to other SVG files (other parts of a machine). Is there a way it's possible to create a setup in SP to accomplish this?
Regarding Shadow dom (Closed) issue in Edge browser. SVG graphic feature not working . Working in IE
I am not creating Shadow dom explicitly any where in code. But in Edge I see #shadow-root (Closed)==$0 . Due to this svg graphic feature is not working .But in IE it working IE HTML <g xmlns="http://www.w3.org/2000/svg" class="taskpanel" id="General_RecordApplicationInfoSubFlowchart_2_0" data-bind="event: { click: toggleTaskPanel, mouseover: mouseOver, mouseout: mouseOut }"> <desc>Record Application Information</desc> <g opacity="1" data-bind="attr: { opacity: opacity }"> <rect class="taskcard" style="cursor: pointer;" fill="#ecebeb" stroke="#61605d" x="0" y="0" width="300" height="106" rx="10" data-bind="attr: { fill: fill, stroke: stroke }" data-originalwidth="300" data-originalheight="106" /> <line class="taskcard" stroke="#61605d" x1="15" y1="0" x2="15" y2="106" data-bind="attr: { stroke: stroke }" /> <line class="taskcard" stroke="#61605d" x1="285" y1="0" x2="285" y2="106" data-bind="attr: { stroke: stroke }" /> <text font-weight="bold" style="cursor: pointer;" text-anchor="middle" x="150" y="57" data-originaly="57">Record Application Information</text> <text class="annotation" style="cursor: pointer;" text-anchor="start" x="22" y="102">Risk.Admin</text> <image style="" x="267" y="2" width="16px" height="16px" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="/UI/ODI.Risk.UI/images/active.gif" data-bind="visible: markComplete" /> </g> <use class="content" style="display: none;" x="40" y="50" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#recordApplicationInformationWorkflow" /> </g> Edge HTML <use xlink:href="#General_ProcessApplicationSubFlowchart_2_0" x="339" y="266"> #shadow-root (Closed)==$0 <g id="General_RecordApplicationInfoSubFlowchart_2_0" class="taskpanel" data-bind="event: { click: toggleTaskPanel, mouseover: mouseOver, mouseout: mouseOut }"> <desc>Record Application Information</desc> <g opacity="1" data-bind="attr: { opacity: opacity }"> <rect class="taskcard" x="0" y="0" rx="10" width="300" height="106" data-bind="attr: { fill: fill, stroke: stroke }" fill="#e5e5e5" stroke="#61605d"></rect> <line class="taskcard" x1="15" y1="0" x2="15" y2="106" data-bind="attr: { stroke: stroke }" stroke="#61605d"></line> <line class="taskcard" x1="285" y1="0" x2="285" y2="106" data-bind="attr: { stroke: stroke }" stroke="#61605d"></line> <text x="150" y="57" text-anchor="middle" font-weight="bold">Record Application Information</text> <text class="annotation" x="22" y="102" text-anchor="start">Risk.Admin</text> <image x="267" y="2" width="16px" height="16px" xlink:href="/UI/ODI.Risk.UI/images/active.gif" style="" data-bind="visible: markComplete"></image> </g> <use xlink:href="#recordApplicationInformationWorkflow" class="content" x="40" y="50" style="display: none"></use> </g> </use>