Angular-jQCloud:根据单词数调整单词大小



使用 jqcloud 的角度指令:

<jqcloud words="project.words" auto-resize="true" delay="10" steps="7" font-size="{from:0.06, to:0.04}" style="width:100%; height: 250px;"></jqcloud>

我希望能够根据字数更改字体大小,因为它根据用户所在的页面被赋予不同的单词集。单词集是作为angularjs承诺的一部分创建的。

我尝试font-size="project.wordSize"并传递给它一串{from:0.06, to: 0.04}(根据大小有不同的数字),但是,这不起作用。我假设是因为project.wordSize是承诺的一部分,因此在创建元素时它不可用,因此 fontSize 将等于 null。

我最终使用以下代码修改了jqcloud.js源代码:

drawWordCloud: function() {
  ...
  // Generate font sizes
  this.data.sizes = [];
  if (this.sizeGenerator) {
     // apply a multipler depending on the number of words
     var multiplier = 1.1;
     if(this.word_array.length < 5){
         multiplier = 2.1;
     }
     else if(this.word_array.length < 10){
        multiplier = 2;
     }
     else if(this.word_array.length < 20){
         multiplier = 1.2;
     }
  }
   for (i=0; i<this.options.steps; i++) {
     this.data.sizes.push((this.sizeGenerator(this.options.width, this.options.height, i+1)).replace('px', '') * multiplier + 'px');
   }
  ...
}

不是最好的,但是一个快速的解决方案。

最新更新