2021.05.21 刘一辰的软件工程随笔
今日目标：使用echart 的 wordCloud 实现热词云。
今日总结：
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="css/bootstrap.min.css" type="text/css" />
<script src="js/jquery-1.11.3.min.js" type="text/javascript"></script>
<script type="text/javascript" src="js/echarts.min.js"></script>
<script type="text/javascript" src="js/china.js"></script>
<script src="js/bootstrap.min.js" type="text/javascript"></script>
<script src='https://cdn.bootcss.com/echarts/3.7.0/echarts.simple.js'></script>
<script src='js/echarts-wordcloud.js'></script>
</head>
<body>
<div id="main" style="width: 100%;height: 400px"></div>
<div>
<table class="table" style="width: 100%;align-content: center;" >
<tr>
<th align="center">论文连接</th>
</tr>
<c:forEach var="item" items="${list}">
<tr>
<td><a href="${item.lianjie }">${item.title}</a></td>
</tr>
</c:forEach>
</table>
</div>
<script>
var chart = echarts.init(document.getElementById('main'));
var dt;
$.ajax({
url : "PaperServlet_",
async : false,
type : "POST",
success : function(data) {
dt = data;
// alert(dt[0].title);
},
error : function() {
alert("请求失败");
},
dataType : "json"
});
var mydata = new Array(0);
for (var i = 0; i < dt.length; i++) {
var d = {};
d["name"] = dt[i].name;
//alert(dt[i].name);
d["value"] = dt[i].value;
mydata.push(d);
}
var option = {
tooltip: {},
series: [ {
type: 'wordCloud',
gridSize: 2,
sizeRange: [20, 50],
rotationRange: [-90, 90],
shape: 'pentagon',
width: 600,
height: 300,
drawOutOfBound: true,
textStyle: {
normal: {
color: function () {
return 'rgb(' + [
Math.round(Math.random() * 160),
Math.round(Math.random() * 160),
Math.round(Math.random() * 160)
].join(',') + ')';
}
},
emphasis: {
shadowBlur: 10,
shadowColor: '#333'
}
},
data: mydata
} ]
};
chart.setOption(option);
chart.on('click', function (params) {
var url = "ClickServlet?geunjian=" + params.name;
window.location.href = url;
});
window.onresize = chart.resize;
</script>
</body>
</html>
明日目标：将关键字分割成单词然后对单词进行去重、计数和排序，装到list，转换为json字符串传递给界面（ajax请求获取的数据）
浙公网安备 33010602011771号