<%@ page import="wl.*"%>
<%@ page import="com.model.Key"%>
<%@ page import="com.dao.KeyDao"%>
<%@ page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>词云</title>
<link rel="stylesheet" href="css/linearicons.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/magnific-popup.css">
<link rel="stylesheet" href="css/nice-select.css">
<link rel="stylesheet" href="css/animate.min.css">
<link rel="stylesheet" href="css/owl.carousel.css">
<link rel="stylesheet" href="css/main.css">
<script type="text/javascript">
function bj(){
alert("下载成功!");
}
</script>
<script src="cloudJs/echarts.min.js"></script>
<script src="cloudJs/echarts-wordcloud.min.js"></script>
</head>
<body>
<%
String word = request.getParameter("name");
String mean3;
if (word == null) {
word = "";
mean3 = "";
} else {
mean3 =dao.find_mean(word);
}
%>
<!-- Start Header Area -->
<header id="header">
<div class="container">
<div class="row align-items-center justify-content-between d-flex">
<div id="logo">
<a href=""><img src="img/logo.png" alt="" title="" /></a>
<div style="position:absolute;right:3px;top:20px">
<a href="index.jsp" style="color:white" >搜索</a>
<%
KeyDao keyDaoI=new KeyDao();
List<String> typeIndex=null;
typeIndex=keyDaoI.loadKeyType();
int ni=typeIndex.size();
String []ti=new String[ni];
typeIndex.toArray(ti);
for(int i=0;i<ni;i++)
{
%>
<a href="chengXuRenSheng.jsp?word=<%= ti[i]%>" style="color:white" ><%= ti[i]%></a>
<%} %>
<a href="Connection.jsp" style="color:#f77" >联系图</a>
<a href="temp.jsp" style="color:#f77">词云</a>
</div>
</div>
</div>
</div>
</header>
<!-- End Header Area -->
<!-- Start Banner Area -->
<section class="home-banner-area relative">
<div class="container">
<div
class="row fullscreen d-flex align-items-center justify-content-center">
<div class="banner-content col-lg-8 col-md-12">
<div class="panel panel-default">
<div style=" 450px; height: 450px;background-color:white;margin-left:100px;margin-top:1.5cm;" >
<div id="worldCloud" style=" 100%; height: 100%"></div>
</div>
</div>
</div>
</div>
</div>
<div align="center">
<img src="img/rocket.png" alt="">
</div>
</section>
<!-- End Banner Area -->
<% if(!"".equals(word)&&word!=null&&!"".equals(mean3)&&mean3!=null){%>
<!-- Start About Area -->
<section class="about-area section-gap">
<div class="container">
<div class="row align-items-center justify-content-center">
<div class="col-lg-5 col-md-6 about-left">
<img class="img-fluid" src="img/about.jpg" alt="">
</div>
<div class="offset-lg-1 col-lg-6 offset-md-0 col-md-12 about-right">
<h1>
<%=word %>
</h1>
<div class="wow fadeIn" data-wow-duration="1s">
<p>
<%=mean3 %>
</p>
</div>
</div>
</div>
</div>
</section>
<!-- End About Area -->
<%} %>
<!-- End Courses Area -->
<%
KeyDao keyDao = new KeyDao();
List<Key> keys = keyDao.loadKey();
%>
<script type="text/javascript">
var worldCloudcharts=echarts.init(document.getElementById('worldCloud'));
var worldCloudoption = {
title: {
text: '热词TOP50',
x: 'center',
textStyle: {
fontSize: 50,
color:'#FFFFFF'
}
},
tooltip: {
show: true
},
series: [{
name: '热词TOP50',
type: 'wordCloud',
sizeRange: [6, 66],
rotationRange: [-45, 90],
textPadding: 0,
autoSize: {
enable: true,
minSize: 6
},
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: [
<%int i = 0;
for (Key key : keys) {%>
{
name: "<%=key.getKey()%>",
value: "<%=key.getNum()%>"
<%i++;%>
}
<%if (i != keys.size()) {%>
,
<%}
}%>
]
}]
};
var JosnList = [];
JosnList.push(
<%i = 0;
for (Key key : keys) {%>
{
name: "<%=key.getKey()%>",
value: "<%=key.getNum()%>"
<%i++;%>
}
<%if (i != keys.size()) {%>
,
<%}
}%>
);
worldCloudoption.series[0].data = JosnList;
worldCloudcharts.setOption(worldCloudoption);
//添加点击事件(单击),还有其他鼠标事件和键盘事件等等
worldCloudcharts.on("click",function(param){
var name=param.name;
window.location.href="temp.jsp?name="+name;
});
</script>
<!--点击按钮-->
<!-- Start Footer Area -->
<footer class="footer-area section-gap">
<div class="container">
<div class="col-lg-4 col-md-6 single-footer-widget">
<p class="footer-text m-0 col-lg-8 col-md-12">
Copyright ©
<script>
document.write(new Date().getFullYear());
</script>
</p>
</div>
</div>
</footer>
<!-- End Footer Area -->
<div id="back-top">
<a title="Go to Top" href="#"></a>
</div>
<!-- ####################### End Scroll to Top Area ####################### -->
<script src="js/vendor/jquery-2.2.4.min.js"></script>
<script src="js/vendor/bootstrap.min.js"></script>
<script src="js/easing.min.js"></script>
<script src="js/hoverIntent.js"></script>
<script src="js/superfish.min.js"></script>
<script src="js/jquery.ajaxchimp.min.js"></script>
<script src="js/jquery.magnific-popup.min.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/owl-carousel-thumb.min.js"></script>
<script src="js/jquery.sticky.js"></script>
<script src="js/jquery.nice-select.min.js"></script>
<script src="js/parallax.min.js"></script>
<script src="js/waypoints.min.js"></script>
<script src="js/wow.min.js"></script>
<script src="js/jquery.counterup.min.js"></script>
<script src="js/mail-script.js"></script>
<script src="js/main.js"></script>
</body>
</html>