如何覆盖 jqcloud 中的 css？答案

【问题标题】：How to override the css in jqcloud?如何覆盖 jqcloud 中的 css？
【发布时间】：2016-06-10 12:14:38
【问题描述】：

我正在尝试使用 jqcloud 在同一个词云中显示三个不同的词列表，这样来自同一个列表的词应该以相同的颜色显示，并且每个列表的颜色应该不同。

【问题讨论】：

【解决方案1】：

说，你有两个数组；

 var word_list1 = new Array(
        {text: "Dolor", weight: 9.4},
        {text: "Sit", weight: 8},
        {text: "Amet", weight: 6.2}};
 var word_list2 = new Array(
        {text: "Consectetur", weight: 5},
        {text: "Adipiscing", weight: 5},
        {text: "Elit", weight: 5},
        {text: "Nam et", weight: 5},
        {text: "Leo", weight: 4}};

您可以添加颜色属性，如;

for (var i = 0; i < word_list1.length; i++) {
    word_list1[i].color = "green";      //i.e. {text: "Leo", weight: 4, color:"green"}};
}       

for (var i = 0; i < word_list2.length; i++) {
    word_list2[i].color = "red";
}

终于

$("#wordcloud").jQCloud(word_list1.concat(word_list2.concat));

【讨论】：

这不起作用，因为 Jqcloud 不接受任何颜色属性。我解决问题。请在下面找到答案

【解决方案2】：

我终于解决了这个问题。步骤如下：

首先根据需要创建两个具有颜色属性的 css 类。喜欢：
```
.customclass{color:red}
```
.customclass2{color:green}
然后在你的 word 数组中添加一个额外的元素 html 并将 css 类分配给它

var word_list1 = new Array({text: "Dolor", weight: 9.4, html:{class:'customclass'}},{text: "Sit", weight: 8,html{class:'customclass'}},{text: "Amet", weight:6.2,html{class:'customclass'}}); var word_list2 = new Array({text: "Consectetur", weight: 5, html:{class:'customclass2'}},{text: "Adipiscing", weight: 5,html{class:'customclass2'}},{text: "Elit", weight: 5, html:{class:'customclass2'}},{text: "Nam et", weight: 5, html:{class:'customclass2'}},{text: "Leo", weight: 4,html:{class:'customclass2'}});
然后像这样渲染云 $("#demo").jQCloud(word_list1.concat(word_list2.concat));

【讨论】：