實現原理
標籤雲最終展現出來的效果其實是由兩個html引數來控制的，分別是：font-size和color，如：
django
標籤關聯的文章越多，表示這個標籤被引用的次數越大，font-size的值也越大，color的顏色越深。考慮到體驗效果，font-size不能隨著的標籤的引用次數的增大而無限增大，否則頁面顯得非常醜陋。因此會把font-size控制在某個區間，同理color也是在乙個區間中。
這裡我把font-size設定在12到33之間陣列font_sizes，標籤的font-size屬性只能是裡面的乙個值，colors是與font_sizes對應的乙個陣列，12對應#ccc，15對應#adadad，以此類推。
min_font_size = 12 # 最小尺寸
max_font_size = 33 # 最大尺寸
font_sizes = [min_font_size, 15, 18, 21, 24, 27, 30, max_font_size]
colors = ['#ccc', "#adadad", '#8e8e8e', '#6f6f6f', '#4f4f4f', '#303030', '#111', '#000']
現在關鍵問題就是如何根據標籤的引用次數(tag_ref_count)來確定它的font-size。一旦font-size了，color也隨之確定。要想標籤的font-size能夠均勻分布在陣列font_sizes中，那麼要遵循的乙個原則就是，隨著次數的增加其font-size的取值也增加，而且引用次數最少的標籤使用min_font_size，引用次數最多的標籤使用max_font_size。
因此有乙個公式，min_font_size + n*step = max_font_size，step是步長，n是指引用次數最多的標籤減去引用次數最少的標籤，表示兩者之間總共有多少步step，根據此根式可以算出每一步的step值是多少，知道了步長後，就可以計算出任意乙個標籤的font-size了，任何乙個標籤到最小標籤的步數是兩者之差，因此每乙個標籤的font-size為 min_font_size + (tag_ref_count-min_ref_count)*step
源**：
# encoding: utf-8
__author__ = 'liuzhijun'
class tagcloud(object):
min_font_size = 12
max_font_size = 33
font_sizes = [min_font_size, 15, 18, 21, 24, 27, 30, max_font_size]
colors = ['#ccc', "#adadad", '#8e8e8e', '#6f6f6f', '#4f4f4f', '#303030', '#111', '#000']
def __init__(self, min_ref_count, max_ref_count):
tagcloud.min_ref_count = min_ref_count
# 如果最大標籤和最小標籤相等,那麼認為兩者的步長為0,所有標籤取同樣的font-size.
if max_ref_count == min_ref_count:
tagcloud.step = 0
else:
tagcloud.step = (tagcloud.max_font_size - tagcloud.min_font_size) / (max_ref_count - min_ref_count)
def get_tag_font_size(self, tag_ref_count):
font_size = tagcloud.min_font_size + (tag_ref_count - tagcloud.min_ref_count) * tagcloud.step
# 上面計算出來的font_size並不一定剛好是font_sizes中的某個元素, 可以能某兩個元素之間的某個值
# 因此要取最接近font_sizes中某個元素
font_size = min(tagcloud.font_sizes, key=lambda x: abs(font_size - x))
return font_size
def get_tag_color(self, tag_ref_count):
return tagcloud.colors[(tagcloud.font_sizes.index(self.get_tag_font_size(tag_ref_count)))]
輸出結果：
12,12,12,18,24,18,21,27,33,
如何通過Python實現標籤雲演算法
實現原理 標籤雲最終展現出來的效果其實是由兩個html引數來控制的，分別是 font size和color，如 django 標籤關聯的文章越多，表示這個標籤被引用的次數越大，font size的值也越大，color的顏色越深。考慮到體驗效果，font size不能隨著的標籤的引用次數的增大而無限增...
vue實現標籤雲效果
最近想給自己的部落格上加上乙個3d標籤雲的效果，用來表示自己部落格文章的分組，網上找到了canvas實現的，還有a元素實現的解析3d標籤雲，我想讓標籤可以選擇和點選，又不想在標籤數量較多時操作a標籤導致效能問題，於是svg就成了乙個不錯的選擇。貼上 text a svg div 在模板中，借用指令v...
ECSHOP首頁如何呼叫所有標籤？ 標籤雲效果
首先，讓我們來開啟 index.php 檔案 找到 smarty assign shop notice cfg shop notice 商店公告 在它下邊增加php sql select tag id,user id,tag words,count tag id as tag count from ...