in src/WordCloud.ts [1432:1501]
private render(wordCloudDataView: WordCloudDataView): void {
if (!wordCloudDataView || !wordCloudDataView.data) {
return;
}
this.scaleMainView(wordCloudDataView);
this.wordsGroupSelection = this.main
.select(WordCloud.Words.selectorName)
.selectAll("g")
.data(wordCloudDataView.data);
let wordGroupSelectionMerged: Selection<WordCloudDataPoint> = this.wordsGroupSelection
.enter()
.append("svg:g")
.merge(this.wordsGroupSelection)
.classed(WordCloud.WordGroup.className, true);
wordGroupSelectionMerged
.append("svg:text")
.style("font-size", WordCloud.DefaultTextFontSize);
wordGroupSelectionMerged
.append("svg:rect");
this.wordsGroupSelection
.exit()
.remove();
wordGroupSelectionMerged
.attr("transform", (dataPoint: WordCloudDataPoint) => {
return `${translate(dataPoint.x, dataPoint.y)} rotate(${dataPoint.rotate})`;
})
.sort((a: WordCloudDataPoint, b: WordCloudDataPoint) => {
return b.height * b.width - a.height * a.width;
});
this.wordsTextUpdateSelection = wordGroupSelectionMerged
.selectAll("text")
.data((dataPoint: WordCloudDataPoint) => [dataPoint]);
this.wordsTextUpdateSelection.text((dataPoint: WordCloudDataPoint) => dataPoint.text);
this.animateSelection(this.wordsTextUpdateSelection, this.durationAnimations)
.style("font-size", ((item: WordCloudDataPoint): string => PixelConverter.toString(item.size)))
.style("fill", ((item: WordCloudDataPoint): string => item.color));
wordGroupSelectionMerged
.selectAll("rect")
.data((dataPoint: WordCloudDataPoint) => [dataPoint])
.attr("x", (dataPoint: WordCloudDataPoint) => -dataPoint.getWidthOfWord() * WordCloud.XOffsetPosition)
.attr("width", (dataPoint: WordCloudDataPoint) => dataPoint.getWidthOfWord())
.attr("y", (dataPoint: WordCloudDataPoint) => -dataPoint.size * WordCloud.YOffsetPosition)
.attr("height", (dataPoint: WordCloudDataPoint) => dataPoint.size * WordCloud.HeightOffsetPosition)
.attr("fill", () => WordCloud.TextFillColor)
.on("click", (dataPoint: WordCloudDataPoint) => {
(<MouseEvent>d3.event).stopPropagation();
this.setSelection(dataPoint);
});
this.clearIncorrectSelection(this.data.dataView);
this.renderSelection();
this.renderTooltip(wordGroupSelectionMerged);
this.isUpdating = false;
if (this.incomingUpdateOptions !== this.visualUpdateOptions) {
this.update(this.incomingUpdateOptions);
}
}