Frage

Ich habe eine Tag-Cloud und ich muss wissen, wie kann ich die Schriftgröße für die am häufigsten verwendeten Tags ändern.

Ich brauche einen min-font-size zu setzen und einen max-font-size.

War es hilfreich?

Lösung

Sie können eine lineare oder logarithmische Bewertung der Anzahl der Elemente verwenden, um mit einem bestimmten Tag relativ zugeordnet zu den größten Tag, multiplizieren sie durch die Differenz zwischen Minimum und Maximum Schriftgrößen, dann fügen Sie die Mindestschriftgröße. Zum Beispiel könnte die Mathematik in Pseudo-Code sein:

let min = 12, max = 24
for each tag
    font = (items / items in biggest tag) * (max - min) + min

Andere Tipps

Um @ Delan Antwort mehr lösche ich einige Beispiele in Sprachen erstellt Ich bin vertraut mit.

Beispiel in Javascript

var tags =
[
    { Name: "c#", Uses: 100 },
    { Name: ".net", Uses: 75 },
    { Name: "typescript", Uses: 50 },
    { Name: "lua", Uses: 50 },
    { Name: "javascript", Uses: 25 },
    { Name: "jquery", Uses: 1 },
    { Name: "c++", Uses: 0 },
];

var max = 100; // Should be computed
var min = 0;   // Should be computed

var fontMin = 10;
var fontMax = 20;

for (var i in tags)
{
    var tag = tags[i];

    var size = tag.Uses == min ? fontMin
        : (tag.Uses / max) * (fontMax - fontMin) + fontMin;
}

Beispiel in C #

var tags = new List<Tag>
{
    new Tag { Name = "c#", Uses = 100 },
    new Tag { Name = ".net", Uses = 75 },
    new Tag { Name = "typescript", Uses = 50 },
    new Tag { Name = "lua", Uses = 50 },
    new Tag { Name = "javascript", Uses = 25 },
    new Tag { Name = "jquery", Uses = 5 },
    new Tag { Name = "c++", Uses = 5 },
};

int max = tags.Max(o => o.Uses);
int min = tags.Min(o => o.Uses);

double fontMax = 20;
double fontMin = 10;

foreach (var tag in tags)
{
    double size = tag.Uses == min ? fontMin
        : (tag.Uses / (double)max) * (fontMax - fontMin) + fontMin;
}

Versuchen Sie:

<div data-i2="fontSize:[10,30]">
    <span data-i2="rate:1">A</span>
    <span data-i2="rate:4">B</span>
    <span data-i2="rate:7">C</span>
    <span data-i2="rate:12">G</span>
    <span data-i2="rate:5">H</span>
</div>

Dann

i2.emph();

http://jsfiddle.net/EUaC5/1/

kam ich mit diesem nach oben:

max_word_count = 412  # should count from list
min_word_count = 44   # should count from list
difference = max_word_count - min_word_count
min_weight = 99 / difference * min_word_count

for each tag
    weight = 99 / difference * this_word_count - min_weight + 1

Was mich gab wog Worte zwischen 1 und 100. Es funktioniert für mich perfekt auf znaci.net/arhiv.

HAFTUNGSAUSSCHLUSS:. Ich bin nicht gut in Mathe

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top