This commit is contained in:
avene 2018-05-12 15:22:35 +08:00
parent 43537b3d05
commit 6c1b3cce7b
2 changed files with 264 additions and 107 deletions

View File

@ -0,0 +1,136 @@
<?php
$this->headTitle($this->config->title->site);
$this->headTitle($this->config->title->data);
$this->headTitle('高级搜索');
$this->headTitle()->setSeparator(' - ');
$this->breadcrumb('<a href="/">首页</a>');
$this->breadcrumb('<a href="/data">'.$this->config->title->data.'</a>');
$this->breadcrumb('高级搜索');
$this->breadcrumb()->setSeparator(' > ');
$this->theme->AppendPlus($this,'tianditu');
$this->theme->AppendPlus($this,'jquery_ui');
?>
<hr class="c-f">
<div class="container">
<div class="row">
<div class="col-lg-12">
<?= $this->partial('data/tools.phtml'); ?>
</div>
</div>
</div>
<hr class="c-f">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="col-md-8" id="map_canvas" style="height:500px;"></div>
<div class="col-md-4">
<form id="search" enctype="application/x-www-form-urlencoded" action="/search" method="get">
<fieldset><legend>时间范围</legend>
<label>开始时间<input name="begin" type="text" id="begin" value="<?php echo $this->begin; ?>"/></label>
<label>结束时间<input name="end" type="text" id="end" value="<?php echo $this->end; ?>" /></label>
</fieldset>
<fieldset><legend>空间范围</legend>
<label><input name="east" id="east" type="text" value="<?php echo $this->east; ?>"/></label>
<label><input name="south" id="south" type="text" value="<?php echo $this->south; ?>" /></label>
<label>西<input name="west" id="west" type="text" value="<?php echo $this->west; ?>" /></label>
<label><input name="north" id="north" type="text" value="<?php echo $this->north; ?>" /></label>
</fieldset>
<label>关键词<input name="q" id="q" type="text" value="<?php echo $this->q; ?>"/></label>
<button id="search" class="btn btn-large btn-block btn-primary" type="submit" value="" onclick="dosubmit()" ><i class="icon-search"></i>搜索</button>
</form>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(function() {
//jquery ui datepicker
$("#begin").datepicker({dateFormat:"yy-mm-dd"});
$("#end").datepicker({dateFormat:"yy-mm-dd"});
});
var bounds = null;
var rect = null;
var map,zoom=6,rectTool;
var input = {east:'#east',west:'#west',north:'#north',south:'#south'};
//加载地图
var myLatlng = new TLngLat(100,38);
var config = { projection: "EPSG:4326"}
map = new TMap("map_canvas",config);
map.centerAndZoom(myLatlng,zoom);
map.enableHandleMouseScroll();
var config = {
type:"TMAP_NAVIGATION_CONTROL_LARGE", //缩放平移的显示类型
anchor:"TMAP_ANCHOR_TOP_LEFT", //缩放平移控件显示的位置
offset:[0,0], //缩放平移控件的偏移值
showZoomInfo:true //是否显示级别提示信息true表示显示false表示隐藏。
};
//创建缩放平移控件对象
var control=new TNavigationControl(config);
//添加缩放平移控件
map.addControl(control);
control = new TMapTypeControl();
//将地图类型控件添加到地图上
map.addControl(control);
//创建矩形工具对象
rectTool = new TRectTool(map);
//注册矩形工具绘制完成后的事件
TEvent.addListener(rectTool,"draw",onDrawRect);
rectTool.open();
function onDrawRect(bounds)
{
map.clearOverLays();
rect = new TRect(bounds);
$(input.east).val(bounds.getNorthEast().getLng());
$(input.north).val(bounds.getNorthEast().getLat());
$(input.west).val(bounds.getSouthWest().getLng());
$(input.south).val(bounds.getSouthWest().getLat());
map.addOverLay(rect);
//关闭矩形工具体
//rectTool.close();
}
function InputValueChange(){
if(MapInputValueCheck() == true)
{
map.clearOverLays();
var p1=new TLngLat($(input.west).val(),$(input.south).val());
var p2=new TLngLat($(input.west).val(),$(input.north).val());
var p3=new TLngLat($(input.east).val(),$(input.north).val());
var p4=new TLngLat($(input.east).val(),$(input.south).val());
map.setViewport(new Array(p1,p2,p3,p4));
var west=parseFloat($(input.west).val());
var east=parseFloat($(input.east).val());
var north=parseFloat($(input.north).val());
var south=parseFloat($(input.south).val());
var bounds = new TBounds(west,south,east,north);
rect = new TRect(bounds);
map.addOverLay(rect);
}
}
function MapInputValueCheck()
{
if($(input.east).val() != "" && $(input.west).val() != "" && $(input.north).val() != "" && $(input.south).val() != "")
{
return true;
}else{
return false;
}
}
$(input.east).bind('blur',InputValueChange);
$(input.west).bind('blur',InputValueChange);
$(input.north).bind('blur',InputValueChange);
$(input.south).bind('blur',InputValueChange);
function dosubmit() {
theForm.action="/search";
}
</script>

View File

@ -4,133 +4,154 @@ $this->headTitle($this->config->title->data);
$this->headTitle('高级搜索'); $this->headTitle('高级搜索');
$this->headTitle()->setSeparator(' - '); $this->headTitle()->setSeparator(' - ');
$this->breadcrumb('<a href="/">首页</a>'); $this->breadcrumb('<a href="/">首页</a>');
$this->breadcrumb('<a href="/data">'.$this->config->title->data.'</a>'); $this->breadcrumb('<a href="/data">' . $this->config->title->data . '</a>');
$this->breadcrumb('高级搜索'); $this->breadcrumb('高级搜索');
$this->breadcrumb()->setSeparator(' > '); $this->breadcrumb()->setSeparator(' > ');
$this->theme->AppendPlus($this,'tianditu'); $this->theme->AppendPlus($this, 'tianditu');
$this->theme->AppendPlus($this,'jquery_ui'); $this->theme->AppendPlus($this, 'jquery_ui');
$this->headLink()->appendStylesheet('/static-sanji-v2/css/dataProduct.css');
$this->headLink()->appendStylesheet('/static-sanji-v2/css/header-position.css');
?> ?>
<hr class="c-f">
<div class="container"> <!--搜索框-->
<div class="row"> <div class="searchBox searchBox2">
<div class="container">
<div class="col-sm-12">
<div class="form-group">
<input type="text" class="form-control" placeholder="搜素关键词">
</div>
<i></i>
</div>
</div>
</div>
<!--固定搜索框-->
<div class="searchBox searchBox1">
<div class="container">
<div class="col-sm-12">
<div class="form-group">
<input type="text" class="form-control" placeholder="搜素关键词">
</div>
<i></i>
</div>
</div>
</div>
<div class="searchOne">
<div class="container">
<div class="col-lg-12"> <div class="col-lg-12">
<?= $this->partial('data/tools.phtml'); ?> <?= $this->partial('data/tools.phtml'); ?>
</div> </div>
</div> </div>
</div> </div>
<hr class="c-f">
<div class="container"> <div class="container">
<div class="row"> <div class="col-lg-12">
<div class="col-lg-12"> <div class="col-md-8" id="map_canvas" style="height:500px;"></div>
<div class="col-md-8" id="map_canvas" style="height:500px;"></div> <div class="col-md-4">
<div class="col-md-4"> <form id="search" enctype="application/x-www-form-urlencoded" action="/search" method="get">
<form id="search" enctype="application/x-www-form-urlencoded" action="/search" method="get"> <fieldset>
<fieldset><legend>时间范围</legend> <legend>时间范围</legend>
<label>开始时间<input name="begin" type="text" id="begin" value="<?php echo $this->begin; ?>"/></label> <label>开始时间<input name="begin" type="text" id="begin" value="<?php echo $this->begin; ?>"/></label>
<label>结束时间<input name="end" type="text" id="end" value="<?php echo $this->end; ?>" /></label> <label>结束时间<input name="end" type="text" id="end" value="<?php echo $this->end; ?>"/></label>
</fieldset> </fieldset>
<fieldset><legend>空间范围</legend> <fieldset>
<label><input name="east" id="east" type="text" value="<?php echo $this->east; ?>"/></label> <legend>空间范围</legend>
<label><input name="south" id="south" type="text" value="<?php echo $this->south; ?>" /></label> <label><input name="east" id="east" type="text" value="<?php echo $this->east; ?>"/></label>
<label>西<input name="west" id="west" type="text" value="<?php echo $this->west; ?>" /></label> <label><input name="south" id="south" type="text" value="<?php echo $this->south; ?>"/></label>
<label><input name="north" id="north" type="text" value="<?php echo $this->north; ?>" /></label> <label>西<input name="west" id="west" type="text" value="<?php echo $this->west; ?>"/></label>
</fieldset> <label><input name="north" id="north" type="text" value="<?php echo $this->north; ?>"/></label>
<label>关键词<input name="q" id="q" type="text" value="<?php echo $this->q; ?>"/></label> </fieldset>
<button id="search" class="btn btn-large btn-block btn-primary" type="submit" value="" onclick="dosubmit()" ><i class="icon-search"></i>搜索</button> <label>关键词<input name="q" id="q" type="text" value="<?php echo $this->q; ?>"/></label>
</form> <button id="search" class="btn btn-large btn-block btn-primary" type="submit" value=""
</div> onclick="dosubmit()"><i class="icon-search"></i>搜索
</button>
</form>
</div> </div>
</div> </div>
</div> </div>
<script type="text/javascript"> <script type="text/javascript">
$(function() { $(function () {
//jquery ui datepicker //jquery ui datepicker
$("#begin").datepicker({dateFormat:"yy-mm-dd"}); $("#begin").datepicker({dateFormat: "yy-mm-dd"});
$("#end").datepicker({dateFormat:"yy-mm-dd"}); $("#end").datepicker({dateFormat: "yy-mm-dd"});
}); });
var bounds = null; var bounds = null;
var rect = null; var rect = null;
var map,zoom=6,rectTool; var map, zoom = 6, rectTool;
var input = {east:'#east',west:'#west',north:'#north',south:'#south'}; var input = {east: '#east', west: '#west', north: '#north', south: '#south'};
//加载地图 //加载地图
var myLatlng = new TLngLat(100,38); var myLatlng = new TLngLat(100, 38);
var config = { projection: "EPSG:4326"} var config = {projection: "EPSG:4326"}
map = new TMap("map_canvas",config); map = new TMap("map_canvas", config);
map.centerAndZoom(myLatlng,zoom); map.centerAndZoom(myLatlng, zoom);
map.enableHandleMouseScroll(); map.enableHandleMouseScroll();
var config = { var config = {
type:"TMAP_NAVIGATION_CONTROL_LARGE", //缩放平移的显示类型 type: "TMAP_NAVIGATION_CONTROL_LARGE", //缩放平移的显示类型
anchor:"TMAP_ANCHOR_TOP_LEFT", //缩放平移控件显示的位置 anchor: "TMAP_ANCHOR_TOP_LEFT", //缩放平移控件显示的位置
offset:[0,0], //缩放平移控件的偏移值 offset: [0, 0], //缩放平移控件的偏移值
showZoomInfo:true //是否显示级别提示信息true表示显示false表示隐藏。 showZoomInfo: true //是否显示级别提示信息true表示显示false表示隐藏。
}; };
//创建缩放平移控件对象 //创建缩放平移控件对象
var control=new TNavigationControl(config); var control = new TNavigationControl(config);
//添加缩放平移控件 //添加缩放平移控件
map.addControl(control); map.addControl(control);
control = new TMapTypeControl(); control = new TMapTypeControl();
//将地图类型控件添加到地图上 //将地图类型控件添加到地图上
map.addControl(control); map.addControl(control);
//创建矩形工具对象 //创建矩形工具对象
rectTool = new TRectTool(map); rectTool = new TRectTool(map);
//注册矩形工具绘制完成后的事件 //注册矩形工具绘制完成后的事件
TEvent.addListener(rectTool,"draw",onDrawRect); TEvent.addListener(rectTool, "draw", onDrawRect);
rectTool.open(); rectTool.open();
function onDrawRect(bounds) function onDrawRect(bounds) {
{ map.clearOverLays();
map.clearOverLays(); rect = new TRect(bounds);
rect = new TRect(bounds); $(input.east).val(bounds.getNorthEast().getLng());
$(input.east).val(bounds.getNorthEast().getLng()); $(input.north).val(bounds.getNorthEast().getLat());
$(input.north).val(bounds.getNorthEast().getLat()); $(input.west).val(bounds.getSouthWest().getLng());
$(input.west).val(bounds.getSouthWest().getLng()); $(input.south).val(bounds.getSouthWest().getLat());
$(input.south).val(bounds.getSouthWest().getLat()); map.addOverLay(rect);
map.addOverLay(rect); //关闭矩形工具体
//关闭矩形工具体 //rectTool.close();
//rectTool.close(); }
}
function InputValueChange(){ function InputValueChange() {
if(MapInputValueCheck() == true) if (MapInputValueCheck() == true) {
{ map.clearOverLays();
map.clearOverLays(); var p1 = new TLngLat($(input.west).val(), $(input.south).val());
var p1=new TLngLat($(input.west).val(),$(input.south).val()); var p2 = new TLngLat($(input.west).val(), $(input.north).val());
var p2=new TLngLat($(input.west).val(),$(input.north).val()); var p3 = new TLngLat($(input.east).val(), $(input.north).val());
var p3=new TLngLat($(input.east).val(),$(input.north).val()); var p4 = new TLngLat($(input.east).val(), $(input.south).val());
var p4=new TLngLat($(input.east).val(),$(input.south).val()); map.setViewport(new Array(p1, p2, p3, p4));
map.setViewport(new Array(p1,p2,p3,p4));
var west=parseFloat($(input.west).val()); var west = parseFloat($(input.west).val());
var east=parseFloat($(input.east).val()); var east = parseFloat($(input.east).val());
var north=parseFloat($(input.north).val()); var north = parseFloat($(input.north).val());
var south=parseFloat($(input.south).val()); var south = parseFloat($(input.south).val());
var bounds = new TBounds(west,south,east,north); var bounds = new TBounds(west, south, east, north);
rect = new TRect(bounds); rect = new TRect(bounds);
map.addOverLay(rect); map.addOverLay(rect);
} }
} }
function MapInputValueCheck() function MapInputValueCheck() {
{ if ($(input.east).val() != "" && $(input.west).val() != "" && $(input.north).val() != "" && $(input.south).val() != "") {
if($(input.east).val() != "" && $(input.west).val() != "" && $(input.north).val() != "" && $(input.south).val() != "") return true;
{ } else {
return true; return false;
}else{ }
return false; }
}
}
$(input.east).bind('blur',InputValueChange); $(input.east).bind('blur', InputValueChange);
$(input.west).bind('blur',InputValueChange); $(input.west).bind('blur', InputValueChange);
$(input.north).bind('blur',InputValueChange); $(input.north).bind('blur', InputValueChange);
$(input.south).bind('blur',InputValueChange); $(input.south).bind('blur', InputValueChange);
function dosubmit() { function dosubmit() {
theForm.action="/search"; theForm.action = "/search";
} }
</script> </script>