mirrors
/
TiddlyWiki5
mirror of https://github.com/Jermolene/TiddlyWiki5
1
0
Fork 0
Code Issues Releases Wiki Activity

Add "spiral" attribute to wordcloud widget

This commit is contained in:
Jeremy Ruston 2013-08-02 22:04:50 +01:00
parent 107f6e4261
commit 1fed9e7eee
1 changed files with 32 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
plugins/tiddlywiki/d3/cloudwidget.js vendored
View File

@ -30,7 +30,7 @@ var CloudWidget = function(renderer) {
CloudWidget.prototype.generate = function() {
// Get the parameters
this.data = this.renderer.getAttribute("data");
this.grouped = this.renderer.getAttribute("grouped","no");
this.spiral = this.renderer.getAttribute("spiral","archimedean");
// Set the return element
this.tag = "div";
this.attributes = {
@ -50,9 +50,9 @@ CloudWidget.prototype.refreshInDom = function(changedAttributes,changedTiddlers)
var oldDomNode = this.renderer.domNode,
newDomNode = this.renderer.renderInDom();
oldDomNode.parentNode.replaceChild(newDomNode,oldDomNode);
} else if(changedAttributes.grouped) {
// Update the chart if the grouping setting has changed
this.grouped = this.renderer.getAttribute("grouped","no");
} else if(changedAttributes.spiral) {
// Update the chart if the spiral setting has changed
this.spiral = this.renderer.getAttribute("spiral","archimedean");
if(this.updateChart) {
this.updateChart();
}
@ -61,29 +61,39 @@ CloudWidget.prototype.refreshInDom = function(changedAttributes,changedTiddlers)
CloudWidget.prototype.createChart = function() {
var self = this;
var domNode = this.renderer.domNode;
var fill = d3.scale.category20();
d3.layout.cloud().size([300, 300])
.words(
"As Apple patiently iterates its hardware design for the iPhone, we can extrapolate where they are heading And it looks awfully likely that the Platonic ideal of the iPhone is a slab of black glass for us to touch and look at with a disembodied voice to talk to No ports or grilles, just an array of radios printed onto the glass".split(" ").map(function(d) {
var data = this.renderer.renderTree.wiki.getTiddlerData(this.data);
if(!data) {
// Use dummy data if none provided
data = "This word cloud does not have any data in it".split(" ").map(function(d) {
return {text: d, size: 10 + Math.random() * 90};
}))
})
}
var svg = d3.select(domNode).append("svg")
.attr("width", 600)
.attr("height", 400)
.append("g")
.attr("transform", "translate(300,200)");
var layout = d3.layout.cloud().size([600, 400])
.words(data)
.padding(5)
.rotate(function() { return ~~(Math.random() * 2) * 90; })
.rotate(function() { return ~~(Math.random() * 5) * 30 - 60; })
.font("Impact")
.fontSize(function(d) { return d.size; })
.fontSize(function(d) { return d.size*2; })
.on("end", draw)
.start();
function draw(words) {
d3.select(domNode).append("svg")
.attr("width", 300)
.attr("height", 300)
.append("g")
.attr("transform", "translate(150,150)")
.selectAll("text")
svg.selectAll("text")
.data(words)
.enter().append("text")
.style("font-size", function(d) { return d.size + "px"; })
@ -96,6 +106,12 @@ CloudWidget.prototype.createChart = function() {
.text(function(d) { return d.text; });
}
function updateChart() {
layout.spiral(self.spiral);
}
return updateChart;
};
exports.d3cloud = CloudWidget;