Fixed #547, add XLink namespace for SVG results.

lib/server/routes/export.js

@@ -23,7 +23,8 @@ import {
   isObjectEmpty,
   isPrivateRangeUrlFound,
   optionsStringify,
-  measureTime
+  measureTime,
+  addXlinkNamespace
 } from '../../utils.js';
 
 import HttpError from '../../errors/HttpError.js';
@@ -249,6 +250,18 @@ const exportHandler = async (request, response, next) => {
       doCallbacks(afterRequest, request, response, { id, body: info.result });
 
       if (info.result) {
+        // This exception is a workaround for #547
+        // The plainly downloaded SVG is not properly formatted -
+        // it lacks the xmlns:xlink so images with "xlink:href" cannot be displayed
+        // and the entire SVG is deemed as incorrect (this may be a Highcharts
+        // problem as well as they should take care of this).
+        // A proper SVG has xlmns:xlink defined if they are used
+        // and Highcharts does not seem to have that for now.
+        // Once they do, we can get rid of this.
+        if (type === 'svg') {
+          info.result = addXlinkNamespace(info.result);
+        }
+
         // If only base64 is required, return it
         if (body.b64) {
           // SVG Exception for the Highcharts 11.3.0 version

lib/utils.js

@@ -448,6 +448,39 @@ export const measureTime = () => {
   return () => Number(process.hrtime.bigint() - start) / 1000000;
 };
 
+/**
+ * This method is used to add the xlink namespace to the SVG string.
+ * This may be a workaround, as Highcharts should take care of this.
+ * @param {string} svgString
+ * @returns {string}
+ */
+export const addXlinkNamespace = (svgString) => {
+  // Check if the xlink namespace is already present
+  const xlinkNamespace = 'xmlns:xlink="http://www.w3.org/1999/xlink"';
+  if (svgString.includes(xlinkNamespace)) {
+    // The namespace is already included, no need to add it
+    return svgString;
+  }
+
+  // Find the position of the opening <svg> tag
+  const svgTagEnd = svgString.indexOf('>');
+
+  // If <svg> is self-closing, find the position accordingly
+  const selfClosing = svgString[svgTagEnd - 1] === '/';
+
+  // Define the insertion point for the namespace attribute
+  const insertionPoint = selfClosing ? svgTagEnd - 1 : svgTagEnd;
+
+  // Insert the xlink namespace declaration
+  const modifiedSvgString =
+    svgString.slice(0, insertionPoint) +
+    ' ' +
+    xlinkNamespace +
+    svgString.slice(insertionPoint);
+
+  return modifiedSvgString;
+};
+
 export default {
   __dirname,
   clearText,