This commit is contained in:
caicai8 2019-12-24 09:30:40 +08:00
parent 8963990c29
commit 82732f610a
2 changed files with 61 additions and 30 deletions

View File

@ -70,16 +70,16 @@
<div class="banner-panel" style="padding-top:60px;"> <div class="banner-panel" style="padding-top:60px;">
<p class="banner-header"></p> <p class="banner-header"></p>
<div class="carouselBottom"> <div class="carouselBottom">
<a class="bottomItem active" href="javscript:void(0)"> <a class="bottomItem active" href="javscript:void(0)">
<img src="./image/1.png" />服务优势 <img src="./image/1.png" />服务优势
</a> </a>
<a class="bottomItem" href="./machine.html"> <a class="bottomItem" href="./machine.html">
<img src="./image/2.png" />AI智能服务 <img src="./image/2.png" />AI智能服务
</a> </a>
<a class="bottomItem" href="javscript:void(0)"> <a class="bottomItem" href="javscript:void(0)">
<img src="./image/3.png" />案例精选 <img src="./image/3.png" />案例精选
</a> </a>
<a class="bottomItem" href="javscript:void(0)"> <a class="bottomItem" href="javscript:void(0)">
<img src="./image/4.png" />快速入门 <img src="./image/4.png" />快速入门
</a> </a>
</div> </div>
@ -89,11 +89,11 @@
<div class="screen-btn screen-open" id="btn"> <div class="screen-btn screen-open" id="btn">
<span class="screen_icon iconfont icon-kuoda"></span> <span class="screen_icon iconfont icon-kuoda"></span>
</div> </div>
<div class="left_echart" id="mainGraph"></div> <div class="left_echart" id="mainGraph"></div>
<div class="video_img"> <div class="video_img">
<div class="div-video" style="background: #1D346F;"> <div class="div-video" style="background: #1D346F;">
<video src="https://www.w3school.com.cn/i/movie.ogg" width="100%" height="100%" controls="controls"> <video src="https://www.w3school.com.cn/i/movie.ogg" width="100%" height="100%" controls="controls">
</video> </video>
</div> </div>
<div class="slider_panel"> <div class="slider_panel">
@ -118,20 +118,51 @@
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div id="maps" style="height: 100%; width: 100%;"></div> <div id="maps" style="height: 100%; width: 100%;"></div>
</div> </div>
<script type="text/javascript" src="./js/jQuery-1.8.3.min.js"></script> <script type="text/javascript" src="./js/jQuery-1.8.3.min.js"></script>
<script type="text/javascript" src="./js/jquery.easy_slides.js"></script> <script type="text/javascript">
$(function(){
$(".show_detail").hover(function(){
$(this).find(".detail_info").show();
},function(){
$(this).find(".detail_info").hide();
})
$(".detail_info").on("click",".info_txt",function(){
var key = $(this).attr("data-key");
$(".search-input-item").removeClass("active");
$("."+key).addClass("active");
if(key === "voice"){
$(".voicePanel").addClass("active");
}
})
$(".carouselBottom").on("click",".bottomItem",function(){
$(".bottomItem").removeClass("active");
$(this).addClass("active");
})
// 放大banner图
$(".photo_icon").on("click",function(){
if($(this).parents(".slider_panel").hasClass("active")){
$(this).parents(".slider_panel").removeClass("active");
}else{
$(this).parents(".slider_panel").addClass("active");
}
})
})
</script>
<script type="text/javascript" src="./js/jquery.easy_slides.js"></script>
<script type="text/javascript" src="./js/demo.js"></script> <script type="text/javascript" src="./js/demo.js"></script>
<script> <script>
$(document).ready(function () { $(document).ready(function () {
//回车 //回车
$(document).keydown(function(event) $(document).keydown(function(event)
@ -159,7 +190,7 @@
myChartGraph.setOption(optionGraph); myChartGraph.setOption(optionGraph);
} }
// 页面加载时,第一次初始化图,以及点击省份后更换数据 // 页面加载时,第一次初始化图,以及点击省份后更换数据
var currentGraph = { var currentGraph = {
nodes: {}, nodes: {},
links: {}, links: {},
@ -263,7 +294,7 @@
return JSON.parse(result) return JSON.parse(result)
}else{ }else{
alert("Error occurred:"+xhr.statusText); alert("Error occurred:"+xhr.statusText);
} }
} }
@ -286,7 +317,7 @@
category = nodeMap[name].category + 1 category = nodeMap[name].category + 1
symbolSize = nodeMap[name].symbolSize - 5 symbolSize = nodeMap[name].symbolSize - 5
} }
nodeLen = graphList.keyword.nodes.length nodeLen = graphList.keyword.nodes.length
linkLen = graphList.keyword.links.length linkLen = graphList.keyword.links.length
source = name source = name
@ -311,9 +342,9 @@
// 处理点击节点展开 // 处理点击节点展开
function append(nodeName) { function append(nodeName) {
// 根据nodeName从nodeMap里拿出对应的nodes和links并append到currentGraph.nodes currentGraph.links // 根据nodeName从nodeMap里拿出对应的nodes和links并append到currentGraph.nodes currentGraph.links
let node = nodeMap[nodeName]; let node = nodeMap[nodeName];
if (node.hasAppend === true || Object.keys(node.nodes).length === 0 || Object.keys(node.links).length === 0) { if (node.hasAppend === true || Object.keys(node.nodes).length === 0 || Object.keys(node.links).length === 0) {
alert("没有数据继续展开"); alert("没有数据继续展开");
return return
@ -433,7 +464,7 @@
myChartGraph.on('click', function(params) { myChartGraph.on('click', function(params) {
if (params.dataType === "node") { if (params.dataType === "node") {
const node = nodeMap[params.data.name]; const node = nodeMap[params.data.name];
if (node.hasAppend === true) { if (node.hasAppend === true) {
remove(node.name) remove(node.name)
} else { } else {
@ -443,7 +474,7 @@
}); });
$('#btn').on('click', function () { $('#btn').on('click', function () {
if ($('.fixed-left').hasClass('active')) { if ($('.fixed-left').hasClass('active')) {
$('.fixed-left').removeClass('active'); $('.fixed-left').removeClass('active');
@ -454,7 +485,7 @@
}) })
graphContainer.style.width = 400 + 'px'; graphContainer.style.width = 400 + 'px';
graphContainer.style.height = '60%'; graphContainer.style.height = '60%';
} else { } else {
var width = document.body.clientWidth; var width = document.body.clientWidth;
$('.fixed-left').addClass('active'); $('.fixed-left').addClass('active');
@ -470,7 +501,7 @@
myChartGraph.resize(); myChartGraph.resize();
}); });
function loadVideo(name) { function loadVideo(name) {
if (name == "西藏" || name == "新疆" || name == "青海"|| name == "班公湖") { if (name == "西藏" || name == "新疆" || name == "青海"|| name == "班公湖") {
temp = 1 temp = 1
@ -488,12 +519,12 @@
$(".div-video").prepend(newSource) $(".div-video").prepend(newSource)
} }
}) })
</script> </script>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function () { $(document).ready(function () {
$('.slider_one_big_picture').EasySlides({ $('.slider_one_big_picture').EasySlides({
'autoplay': true, 'autoplay': true,
'stepbystep': false, 'stepbystep': false,
@ -528,7 +559,7 @@
function searchProvince (value) { function searchProvince (value) {
console.log('查找的省份:', value); console.log('查找的省份:', value);
highLight(value) highLight(value)
} }
$('.search_icon').on('click', function () { $('.search_icon').on('click', function () {
var $val = $(".search_input").val(); var $val = $(".search_input").val();
@ -550,7 +581,7 @@
if (key === 'prov') { if (key === 'prov') {
$('.search-prov').show(); $('.search-prov').show();
$('.lat_lon_sec').hide(); $('.lat_lon_sec').hide();
} }
else if (key === 'lon') { else if (key === 'lon') {
$('.search-prov').hide(); $('.search-prov').hide();
$('.lat_lon_sec').show(); $('.lat_lon_sec').show();
@ -590,8 +621,8 @@
// }) // })
}); });
</script> </script>
<script src="./js/public.js"></script> <!-- <script src="./js/public.js"></script> -->
<script src="./js/map.js"></script> <script src="./js/map.js"></script>
</body> </body>
</html> </html>

View File

Before

Width:  |  Height:  |  Size: 13 KiB

After

Width:  |  Height:  |  Size: 13 KiB