Revert "added word cloud chart operation"

This commit is contained in:
Autumn 2023-12-21 20:39:42 +00:00 committed by GitHub
parent a218f0aa47
commit 69770f9395
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 32 additions and 691 deletions

View file

@ -488,8 +488,7 @@
"Hex Density chart",
"Scatter chart",
"Series chart",
"Heatmap chart",
"Wordcloud chart"
"Heatmap chart"
]
},
{

View file

@ -1,7 +1,3 @@
import * as d3temp from "d3";
const d3 = d3temp.default ? d3temp.default : d3temp;
import cloud from "d3-cloud";
/**
* Various components for drawing diagrams on an HTML5 canvas.
*
@ -206,56 +202,3 @@ export function drawScaleBar(canvas, score, max, markings) {
ctx.fillText(markings[i].label, x0, y0);
}
}
/**
* Draws a word cloud chart.
*
* @param canvas
* @param words
*/
export function drawWordCloudChart(canvas, words) {
const dimension = 500;
let svg = document.createElement("svg");
svg = d3.select(svg)
.attr("width", "100%")
.attr("height", "100%")
.attr("viewBox", `0 0 ${dimension} ${dimension}`);
const margin = {
top: 10,
right: 0,
bottom: 40,
left: 30,
},
width = dimension - margin.left - margin.right,
height = dimension - margin.top - margin.bottom,
marginedSpace = svg.append("g")
.attr("transform", "translate(" + margin.left + "," + margin.top + ")");
marginedSpace.append("clipPath")
.attr("id", "clip")
.append("rect")
.attr("width", width)
.attr("height", height);
marginedSpace.append("g")
.attr("class", "bins")
.attr("clip-path", "url(#clip)");
// Constructs a new cloud layout instance. It run an algorithm to find the position of words that suits your requirements
cloud().size([960, 500])
.canvas(canvas)
.words(words)
.padding(2)
.rotate(() => Math.floor(Math.random() * 2) * 90)
.font("sans-serif")
.fontSize(d => {
return d.size * 30;
})
.fontWeight("lighter")
.on("end", (data) => {
})
.start();
}

View file

@ -1,74 +0,0 @@
/**
* @author tlwr [toby@toby.codes]
* @author Matt C [me@mitt.dev]
* @copyright Crown Copyright 2019
* @license Apache-2.0
*/
import Operation from "../Operation.mjs";
/**
* Wordcloud chart operation
*/
class WordcloudChart extends Operation {
/**
* WordcloudChart constructor
*/
constructor() {
super();
this.name = "Wordcloud chart";
this.module = "Charts";
this.description = "Word Cloud Chart is a visualization method that allows you to quickly see which words appear more frequently in a bunch of text";
this.infoURL = "https://en.wikipedia.org/wiki/Tag_cloud";
this.inputType = "string";
this.outputType = "html";
this.args = [
{
name: "Exclude Words",
type: "string",
values: "A, The, And"
}
];
}
/**
* Wordcloud chart operation.
*
* @param {string} input
* @param {Object[]} args
* @returns {html}
*/
run(input, args) {
const excludeWords = args[0];
const uniqueWords = [...new Set(input.split(" "))].filter((word) => !excludeWords.includes(word));
const count = input.split(" ").reduce((acc, curr) => {
acc[curr] = -~acc[curr];
return acc;
}, {});
const words = uniqueWords
.map(function(d) {
return {text: d, size: count[d]};
});
const output = `<canvas id='chart-area'></canvas><br>
<script>
var canvas = document.getElementById("chart-area"),
parentRect = canvas.closest(".cm-scroller").getBoundingClientRect(),
inputWords = ${JSON.stringify(words)};
canvas.width = parentRect.width * 0.95;
canvas.height = parentRect.height * 0.9;
CanvasComponents.drawWordCloudChart(canvas, inputWords);
</script>`;
return output;
}
}
export default WordcloudChart;