diff --git a/config/plugins/visualizations/annotate_image/config/annotate_image.xml b/config/plugins/visualizations/annotate_image/config/annotate_image.xml
index 0e6781078cf0..b5bcfe76a7ab 100644
--- a/config/plugins/visualizations/annotate_image/config/annotate_image.xml
+++ b/config/plugins/visualizations/annotate_image/config/annotate_image.xml
@@ -13,5 +13,5 @@
dataset_id
-
+
diff --git a/config/plugins/visualizations/annotate_image/package.json b/config/plugins/visualizations/annotate_image/package.json
index f546269cf52a..ae7cd6a66da9 100644
--- a/config/plugins/visualizations/annotate_image/package.json
+++ b/config/plugins/visualizations/annotate_image/package.json
@@ -19,7 +19,7 @@
},
"scripts": {
"build": "yarn build-css && yarn build-js",
- "build-css": "cp 'node_modules/jquery-contextmenu/dist/jquery.contextMenu.css' 'static/'",
+ "build-css": "cp -f 'node_modules/jquery-contextmenu/dist/jquery.contextMenu.css' 'static/'",
"build-js": "parcel build src/script.js --dist-dir static"
}
}
diff --git a/config/plugins/visualizations/annotate_image/src/script.js b/config/plugins/visualizations/annotate_image/src/script.js
index 443c1932b6cf..b90b3cb1901d 100644
--- a/config/plugins/visualizations/annotate_image/src/script.js
+++ b/config/plugins/visualizations/annotate_image/src/script.js
@@ -5,12 +5,6 @@ import _ from "underscore";
// Use lighter weight 'core' version of paper since we don't need paperscript
import paper from "../node_modules/paper/dist/paper-core.js";
-/* This will be part of the charts/viz standard lib in 23.1 */
-const slashCleanup = /(\/)+/g;
-function prefixedDownloadUrl(root, path) {
- return `${root}/${path}`.replace(slashCleanup, "/");
-}
-
const CommandManager = (function () {
function CommandManager() {}
@@ -60,10 +54,7 @@ const generateUUID = function () {
return uuid;
};
-window.bundleEntries = window.bundleEntries || {};
-window.bundleEntries.load = function (opt) {
- const chart = opt.chart;
- const dataset = opt.dataset;
+function render(downloadUrl) {
const defaults = { color: "red", width: 4, opacity: 0.5 };
$.fn.createCanvas = function (options) {
let settings = $.extend({}, defaults, options || {});
@@ -441,17 +432,13 @@ window.bundleEntries.load = function (opt) {
});
};
- const downloadUrl = prefixedDownloadUrl(opt.root, dataset.download_url);
-
fetch(downloadUrl)
.then((response) => {
if (!response.ok) {
throw new Error("Failed to access dataset.");
}
- return response.text();
- })
- .then((content) => {
- const $chartViewer = $("#" + opt.target);
+
+ const $chartViewer = $("#app");
$chartViewer.html("");
$chartViewer.css("overflow", "auto");
$chartViewer.css("position", "relative");
@@ -470,12 +457,16 @@ window.bundleEntries.load = function (opt) {
img_height: height,
});
});
-
- chart.state("ok", "Chart drawn.");
- opt.process.resolve();
})
.catch((error) => {
- chart.state("failed", error.message);
- opt.process.resolve();
+ console.error(error.message);
});
};
+
+const { root, visualization_config } = JSON.parse(document.getElementById("app").dataset.incoming);
+
+const datasetId = visualization_config.dataset_id;
+
+const downloadUrl = window.location.origin + root + "api/datasets/" + datasetId + "/display";
+
+render(downloadUrl);
diff --git a/config/plugins/visualizations/example/static/script.js b/config/plugins/visualizations/example/static/script.js
index e17270b74957..262765a01502 100644
--- a/config/plugins/visualizations/example/static/script.js
+++ b/config/plugins/visualizations/example/static/script.js
@@ -1,4 +1,4 @@
-const { visualization_config, visualization_plugin, root } = JSON.parse(document.getElementById("app").dataset.incoming);
+const { root, visualization_config, visualization_plugin } = JSON.parse(document.getElementById("app").dataset.incoming);
const div = Object.assign(document.createElement("div"), {
style: "border: 2px solid #25537b; border-radius: 1rem; padding: 1rem"