simonandClaude Code
f3f9d19da7
库文件整理: - 所有JS/CSS/字体库统一到lib/js/、lib/css/、lib/webfonts/ - 按名称-版本格式重命名(jquery-3.6.0.min.js等) - 删除约80个重复/废弃的库文件副本 - 更新17个文件中的引用路径 图表模式标准化: - moneyflow/realestate/estate3个页面从$.ajax/PHP注入转为fetch+loading overlay模式 - 新增moneyflowData/estateData两个AJAX端点 - chartmoneyflow.js、estate.js移至deprecated README.md更新为完整功能介绍 Co-Authored-By: Claude Code <noreply@anthropic.com>
152 lines
7.7 KiB
PHP
152 lines
7.7 KiB
PHP
<?php
|
|
require_once "../inc/functions.inc.php";
|
|
$_REQUEST['t_start']=$_REQUEST['t_start']?$_REQUEST['t_start']:'2023-08-15';
|
|
$_REQUEST['t_end']=$_REQUEST['t_end']?$_REQUEST['t_end']:date('Y-m-d');
|
|
$_REQUEST['mst']=$_REQUEST['mst']?$_REQUEST['mst']:'2023-08';
|
|
$_REQUEST['med']=$_REQUEST['med']?$_REQUEST['med']:date('Y-m');
|
|
$_REQUEST['dm']=$_REQUEST['dm']?$_REQUEST['dm']:'Daily';
|
|
$_REQUEST['district']=$_REQUEST['district']?$_REQUEST['district']:'合计';
|
|
$subTitle=($_REQUEST['district']=='合计')?'宁波地区':$_REQUEST['district'];
|
|
$title1="新房每日成交量({$subTitle})";
|
|
$title2="二手房每日成交量({$subTitle})";
|
|
include_once "../html/head.php";
|
|
?>
|
|
|
|
<form name="main" id="main" method="get"> <div style="width:100%;text-align:center">
|
|
区域：
|
|
<?php districtList(); ?>
|
|
Daily/Monthly:
|
|
<?php byDM('dm','dblock','mblock'); ?>
|
|
<span style="display:inline;" id='dblock'>
|
|
开始时间: <input type='date' name='t_start' id='t_start' width='30px' >
|
|
结束时间: <input type='date' name='t_end' id='t_end' width='30px' >
|
|
</span>
|
|
<span style="display:None;" id='mblock'>
|
|
开始月份: <input type="month" name='mst' id='mst' >
|
|
结束月份: <input type="month" name='med' id='med' >
|
|
</span>
|
|
|
|
<button id="submitBtn" class="btn-submit"><span>查询数据</span></button>
|
|
</div> </form>
|
|
<div > </div>
|
|
<div id="container" style="width: 1000px; height:400px; margin: 0 auto 20px;">
|
|
<div class="loading-overlay" id="loadingOverlay1">
|
|
<div class="spinner"></div>
|
|
<p style="font-size:18px; color:#2c3e50;">正在加载数据，请稍候...</p>
|
|
</div>
|
|
</div>
|
|
<div > </div>
|
|
<div id="container2" style="width: 1000px; height:400px; margin: 0 auto 20px;">
|
|
<div class="loading-overlay" id="loadingOverlay2">
|
|
<div class="spinner"></div>
|
|
<p style="font-size:18px; color:#2c3e50;">正在加载数据，请稍候...</p>
|
|
</div>
|
|
</div>
|
|
<div > </div>
|
|
<div style="margin:0 auto;width: 1000px ">
|
|
<span style="color:grey">
|
|
* 数据来源：<a href='https://www.cnnbfdc.com/' target='_blank'>宁波市房产交易服务信息网</a><br />
|
|
* 更新时间： 每天下午5:30</span></div>
|
|
|
|
<script>
|
|
var dataSel1 = ['td','area'];
|
|
var dataSel2 = ['td','qty'];
|
|
var legend = ['成交面积','成交套数','可售套数'];
|
|
var legend2 = ['成交面积','成交套数'];
|
|
|
|
$(document).ready(function() {
|
|
$("#district").val('<?=$_REQUEST['district']?>');
|
|
$("#t_start").val('<?=$_REQUEST['t_start']?>');
|
|
$("#t_end").val('<?=$_REQUEST['t_end']?>');
|
|
$("#mst").val('<?=$_REQUEST['mst']?>');
|
|
$("#med").val('<?=$_REQUEST['med']?>');
|
|
$("#dm").val('<?=$_REQUEST['dm']?>');
|
|
var vdm = $('#dm').val();
|
|
if(vdm=='Monthly'){ $('#dblock').css('display','none'); $('#mblock').css('display','inline'); }
|
|
if(vdm=='Daily'){ $('#dblock').css('display','inline'); $('#mblock').css('display','none'); }
|
|
loadChartData();
|
|
$('#submitBtn').click(function(e) { e.preventDefault(); loadChartData(); });
|
|
});
|
|
|
|
function loadChartData() {
|
|
$('#loadingOverlay1').addClass('active');
|
|
$('#loadingOverlay2').addClass('active');
|
|
var district = $('#district').val();
|
|
var dm = $('#dm').val();
|
|
|
|
var url1 = "../inc/ajax.inc.php?t=newTBD&district="+district+"&dm="+dm;
|
|
var url2 = "../inc/ajax.inc.php?t=esfTBD&district="+district+"&dm="+dm;
|
|
if(dm=='Daily') {
|
|
url1 += "&t_start="+$('#t_start').val()+"&t_end="+$('#t_end').val();
|
|
url2 += "&t_start="+$('#t_start').val()+"&t_end="+$('#t_end').val();
|
|
}
|
|
if(dm=='Monthly') {
|
|
url1 += "&t_start="+$('#mst').val()+"&t_end="+$('#med').val();
|
|
url2 += "&t_start="+$('#mst').val()+"&t_end="+$('#med').val();
|
|
}
|
|
|
|
Promise.all([fetch(url1), fetch(url2)])
|
|
.then(function(responses) { return Promise.all(responses.map(function(r) { return r.json(); })); })
|
|
.then(function(results) {
|
|
// Chart 1: 新房
|
|
var d1 = results[0].data;
|
|
var data1 = getRows(d1.datas, dataSel1);
|
|
var data2 = getRows(d1.datas, dataSel2);
|
|
var data3 = getRows(d1.dataExt, dataSel2);
|
|
var dom1 = document.getElementById("container");
|
|
var chart1 = echarts.init(dom1, 'dark');
|
|
chart1.setOption({
|
|
title: { text: '<?=$title1?>', textAlign:'center', left:'50%' },
|
|
tooltip: { trigger: 'axis' },
|
|
legend: { data: legend, right:'20' },
|
|
grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true },
|
|
toolbox: { feature: { saveAsImage: {} } },
|
|
xAxis: { type: 'time', boundaryGap: false },
|
|
yAxis: [
|
|
{ type: 'value', name: legend[2], show: true },
|
|
{ type: 'value', name: legend[1], show: true, boundaryGap: false, splitLine: { show: false } }
|
|
],
|
|
dataZoom: [
|
|
{ type: 'inside', start: 0, end: 100 },
|
|
{ start: 0, end: 100, handleSize: '80%', handleStyle: { color: '#fff', shadowBlur: 3, shadowColor: 'rgba(0, 0, 0, 0.6)', shadowOffsetX: 2, shadowOffsetY: 2 } }
|
|
],
|
|
series: [
|
|
{ name: legend[2], type: 'line', yAxisIndex: 0, symbol: 'none', data: data3, label: { show: true, position: 'top' } },
|
|
{ name: legend[1], type: 'bar', yAxisIndex: 1, symbol: 'none', data: data2, label: { show: true } }
|
|
]
|
|
}, true);
|
|
$('#loadingOverlay1').removeClass('active');
|
|
|
|
// Chart 2: 二手房
|
|
var d2 = results[1].data;
|
|
var data4 = getRows(d2.dataTrade, dataSel1);
|
|
var data5 = getRows(d2.dataTrade, dataSel2);
|
|
var dom2 = document.getElementById("container2");
|
|
var chart2 = echarts.init(dom2, 'dark');
|
|
chart2.setOption({
|
|
title: { text: '<?=$title2?>', textAlign:'center', left:'50%' },
|
|
tooltip: { trigger: 'axis' },
|
|
legend: { data: legend2, right:'20' },
|
|
grid: { left: '3%', right: '4%', bottom: '3%', containLabel: true },
|
|
toolbox: { feature: { saveAsImage: {} } },
|
|
xAxis: { type: 'time', boundaryGap: false },
|
|
yAxis: [
|
|
{ type: 'value', name: legend2[0], show: true },
|
|
{ type: 'value', name: legend2[1], show: true, boundaryGap: false, splitLine: { show: false } }
|
|
],
|
|
dataZoom: [
|
|
{ type: 'inside', start: 0, end: 100 },
|
|
{ start: 0, end: 100, handleSize: '80%', handleStyle: { color: '#fff', shadowBlur: 3, shadowColor: 'rgba(0, 0, 0, 0.6)', shadowOffsetX: 2, shadowOffsetY: 2 } }
|
|
],
|
|
series: [
|
|
{ name: legend2[0], type: 'line', yAxisIndex: 0, symbol: 'none', data: data4, itemStyle: { normal: { label: { show: true } } } },
|
|
{ name: legend2[1], type: 'bar', yAxisIndex: 1, symbol: 'none', data: data5, itemStyle: { normal: { label: { show: true } } } }
|
|
]
|
|
}, true);
|
|
$('#loadingOverlay2').removeClass('active');
|
|
})
|
|
.catch(function(error) { console.error('数据加载失败:', error); $('#loadingOverlay1').removeClass('active'); $('#loadingOverlay2').removeClass('active'); });
|
|
}
|
|
</script>
|
|
<?php include_once "../html/footer.php"; ?>
|