2016-02-11 2 views
1

Используя angular directive для 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> 

Я хочу, чтобы иметь возможность изменить размер шрифта в зависимости от количества слов, как это дано другое набор слов на основе того, на какой странице находится пользователь. Набор слов создается как часть углового обещания.

Я пробовал font-size="project.wordSize" и передал ему строку {from:0.06, to: 0.04} (с разными номерами в зависимости от размера), однако это не сработало. Я предполагаю, что поскольку project.wordSize является частью обещания, он недоступен, когда элемент создан, и поэтому fontSize будет равен нулю.

ответ

1

Я в конечном итоге изменения исходного кода 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'); 
    } 

    ... 
} 

Не самый лучший, но быстрое решение.

Смежные вопросы