Javascript 更新workCloud数据-amcharts
对于静态数据,单词cloud可以正常工作。Javascript 更新workCloud数据-amcharts,javascript,html,amcharts4,Javascript,Html,Amcharts4,对于静态数据,单词cloud可以正常工作。 当数据改变,我更新html时,云不会更新 这是我的HTML代码 <div id="chartdiv"></div> <script type="text/javascript" src="../wordCloud.js"></script> <script type="text/javascript">wordcloud(myData)</script> 用户可以使用按钮在标记云
当数据改变,我更新html时,云不会更新
这是我的HTML代码
<div id="chartdiv"></div>
<script type="text/javascript" src="../wordCloud.js"></script>
<script type="text/javascript">wordcloud(myData)</script>
用户可以使用按钮在标记云中显示更多或更少的单词然后在后端计算新数据。但是我怎样才能更新云呢
谢谢你的帮助 编辑:
我读了文档,也读了这个。但是这对我没有帮助,因为顺便说一句,word cloud和chart的区别在于数据是通过
系列
变量添加的,而不是图表
变量添加的。链接线程中提到的相同更新规则适用于系列级数据-使用替换数组、调用或就地更新(两者都有系列级方法)将允许您更新WordCloud。您的代码似乎与前一个线程的代码具有相同的限制,您无法访问方法之外的图表变量,因此我不知道您如何在不进行类似更改的情况下准确更新该实例
下面的基本演示使用一个按钮在系列上设置新的数据数组:
var myData=[{
“标记”:“是”,
“计数”:50
}, {
'标记':'否',
“计数”:50
}, {
“tag”:“Maybe”,
“计数”:50
}]
am4core.useTheme(am4themes_动画);
//主题结束
var chart=am4core.create(“chartdiv”,am4plugins_wordCloud.wordCloud);
chart.fontfamine=“Courier New”;
var series=chart.series.push(新的am4plugins_wordCloud.WordCloudSeries());
系列随机性=0.1;
系列旋转阈值=0.5;
series.angles=[0];
series.data=myData;
series.dataFields.word=“tag”;
series.dataFields.value=“count”;
series.heatRules.push({
“目标”:series.labels.template,
“属性”:“填充”,
“最小”:AM4核心颜色(“0000CC”),
“最大”:AM4核心颜色(“CC00CC”),
“数据字段”:“值”
});
series.labels.template.tooltipText=“{word}:{value}”;
var hoverState=series.labels.template.states.create(“悬停”);
hoverState.properties.fill=am4core.color(“#FF0000”);
var title=chart.titles.create();
title.text=“语料库中最常用的单词”;
title.fontSize=20;
title.fontwweight=“800”;
document.getElementById('change')。addEventListener('click',function(){
series.data=[{
“标记”:“是”,
“计数”:50
}, {
'标记':'否',
“计数”:50
}, {
“tag”:“Maybe”,
“计数”:50
}, {
“tag”:“Sorta”,
“计数”:50
}, {
‘tag’:‘Kinda’,
“计数”:50
}]
})
#chartdiv{
宽度:100%;
高度:350px;
}
更改数据
function wordcloud(myData) {
am4core.ready(function () {
// Themes begin
am4core.useTheme(am4themes_animated);
am4core.useTheme(am4themes_kelly);
// Themes end
var chart = am4core.create("chartdiv", am4plugins_wordCloud.WordCloud);
chart.fontFamily = "Courier New";
var series = chart.series.push(new am4plugins_wordCloud.WordCloudSeries());
series.randomness = 0.1;
series.rotationThreshold = 0.5;
series.angles = [0];
series.data = myData;
series.dataFields.word = "tag";
series.dataFields.value = "count";
series.heatRules.push({
"target": series.labels.template,
"property": "fill",
"min": am4core.color("#0000CC"),
"max": am4core.color("#CC00CC"),
"dataField": "value"
});
series.labels.template.tooltipText = "{word}: {value}";
var hoverState = series.labels.template.states.create("hover");
hoverState.properties.fill = am4core.color("#FF0000");
var title = chart.titles.create();
title.text = "Most frequent words in corpus";
title.fontSize = 20;
title.fontWeight = "800";
});
}