mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-12-24 17:10:29 +00:00
Code Issues Releases Wiki Activity

Add "spiral" attribute to wordcloud widget

Browse Source
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() { CloudWidget.prototype.generate = function() {
// Get the parameters // Get the parameters
this.data = this.renderer.getAttribute("data"); this.data = this.renderer.getAttribute("data");
this.grouped = this.renderer.getAttribute("grouped","no"); this.spiral = this.renderer.getAttribute("spiral","archimedean");
// Set the return element // Set the return element
this.tag = "div"; this.tag = "div";
this.attributes = { this.attributes = {
@ -50,9 +50,9 @@ CloudWidget.prototype.refreshInDom = function(changedAttributes,changedTiddlers)
var oldDomNode = this.renderer.domNode, var oldDomNode = this.renderer.domNode,
newDomNode = this.renderer.renderInDom(); newDomNode = this.renderer.renderInDom();
oldDomNode.parentNode.replaceChild(newDomNode,oldDomNode); oldDomNode.parentNode.replaceChild(newDomNode,oldDomNode);
} else if(changedAttributes.grouped) { } else if(changedAttributes.spiral) {
// Update the chart if the grouping setting has changed // Update the chart if the spiral setting has changed
this.grouped = this.renderer.getAttribute("grouped","no"); this.spiral = this.renderer.getAttribute("spiral","archimedean");
if(this.updateChart) { if(this.updateChart) {
this.updateChart(); this.updateChart();
} }
@ -61,29 +61,39 @@ CloudWidget.prototype.refreshInDom = function(changedAttributes,changedTiddlers)
CloudWidget.prototype.createChart = function() { CloudWidget.prototype.createChart = function() {
var self = this;
var domNode = this.renderer.domNode; var domNode = this.renderer.domNode;
var fill = d3.scale.category20(); var fill = d3.scale.category20();
d3.layout.cloud().size([300, 300])
.words( var data = this.renderer.renderTree.wiki.getTiddlerData(this.data);
"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) {
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}; 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) .padding(5)
.rotate(function() { return ~~(Math.random() * 2) * 90; }) .rotate(function() { return ~~(Math.random() * 5) * 30 - 60; })
.font("Impact") .font("Impact")
.fontSize(function(d) { return d.size; }) .fontSize(function(d) { return d.size*2; })
.on("end", draw) .on("end", draw)
.start(); .start();
function draw(words) { function draw(words) {
d3.select(domNode).append("svg") svg.selectAll("text")
.attr("width", 300)
.attr("height", 300)
.append("g")
.attr("transform", "translate(150,150)")
.selectAll("text")
.data(words) .data(words)
.enter().append("text") .enter().append("text")
.style("font-size", function(d) { return d.size + "px"; }) .style("font-size", function(d) { return d.size + "px"; })
@ -96,6 +106,12 @@ CloudWidget.prototype.createChart = function() {
.text(function(d) { return d.text; }); .text(function(d) { return d.text; });
} }
function updateChart() {
layout.spiral(self.spiral);
}
return updateChart;
}; };
exports.d3cloud = CloudWidget; exports.d3cloud = CloudWidget;