博客

jQWidgets是一套功能强大且易于使用的JavaScript库，可用于构建现代网站和Web应用程序。其中的jqxTagCloud插件可以将数据按照权重的大小以云的形式呈现。jqxTagCloud提供了很多配置选项，其中之一就是takeTopWeightedItems属性，用于设置获取权重最大的指定数量的数据项。

takeTopWeightedItems属性详解

语法

takeTopWeightedItems: Number

参数说明

• Number：表示需要获取的权重最大的数据项的数量，必须是正整数。

默认值

• takeTopWeightedItems的默认值为0，表示不限制获取数据项的数量。

示例说明

以下两个示例演示了如何使用takeTopWeightedItems属性来设置获取权重最大的指定数量的数据项。

示例一：设置取得两个权重最大的数据项

<script type="text/javascript">
    $(document).ready(function () {
        // 准备数据
        var items = [
            { label: 'A', weight: 12 },
            { label: 'B', weight: 18 },
            { label: 'C', weight: 9 },
            { label: 'D', weight: 5 },
            { label: 'E', weight: 10 },
            { label: 'F', weight: 15 }
        ];

        // 创建 jqxTagCloud 实例，并设置 takeTopWeightedItems 属性
        $('#tagCloud').jqxTagCloud({
            width: '500px',
            height: '300px',
            source: items,
            takeTopWeightedItems: 2 // 只取得两个权重最大的项
        });
    });
</script>

以上代码展示了如何将数据按照权重大小以云的形式呈现的功能，其中设置了takeTopWeightedItems属性为2，表示取得权重最大的两个数据项“B”和“F”。

示例二：限制只显示所有数据中权重最大的前三项

<script type="text/javascript">
    $(document).ready(function () {
        // 准备数据
        var items = [
            { label: 'A', weight: 12 },
            { label: 'B', weight: 18 },
            { label: 'C', weight: 9 },
            { label: 'D', weight: 5 },
            { label: 'E', weight: 10 },
            { label: 'F', weight: 15 }
        ];

        // 创建 jqxTagCloud 实例，并设置 takeTopWeightedItems 属性
        $('#tagCloud').jqxTagCloud({
            width: '500px',
            height: '300px',
            source: items,
            takeTopWeightedItems: 3 // 取得权重最大的三个数据项
        });
    });
</script>

以上代码展示了如何将数据按照权重大小以云的形式呈现的功能，其中设置了takeTopWeightedItems属性为3，表示取得权重最大的三个数据项“B”、“F”和“A”。