2020年11月_漏刻有时数据可视化大屏（PHP&ECHARTS智能化私有部署解决方案）_漏刻有时

12月 11月 10月 09月 08月 07月 06月 05月 04月 03月 02月 01月

原创 geojson格式筛选及处理的解决方案

获取geojson文件 //获取geojson文件; $.getJSON('zj.json', function (data) { var d = []; for (var i = 0; i < data.features.length; i++) { //筛选条件; var str = data.features[i].properties.FULLNAMEPI; if (str.sea

2020-11-28 18:43:07 208 1

原创百度地图开发系列(2):BMapLib.InfoBox自定义弹出框样式

JS文件引入 <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=11Z8uiP8kIz6AG0Vjiwzbc5f9Ii0cdHd"></script> <script type="text/javascript" src="js/InfoBox_min.js"></script>样式表 body.

2020-11-28 13:22:32 448

原创百度地图异步加载开发系列(1):添加layUI弹出模态框互动

异步加载地图 //异步加载地图 function loadJScript() { var script = document.createElement('script'); script.type = 'text/javascript'; script.src = 'https://api.map.baidu.com/api?v=2.0&ak=&ak=11Z8uiP8kIz6AG0Vjiwzbc5f***&callback.

2020-11-28 12:09:39 166

原创 geojson乡镇拼接的说明

1.新建记事本文件，打开另存为.json文件，utf8编码；（或者直接使用IDE建立utf8的json文件）；2.复制一下内容：{ "type": "FeatureCollection", "features": []}3.筛选乡镇数据，如图：选择格式化的Formatted，点击复制4.将复制的乡镇边界放入对象中[]中，多个用英文的,隔开；{ "type": "FeatureCollection", "features": [{ "type": "Feature", "g

2020-11-27 16:42:25 193

原创漏刻有时忘记超级管理员密码的解决方案:通过API接口设置超级管理员

文件路径：api\LockData.php复制代码到文件中 function setAdmin() { global $db, $res; dbc(); $user_name = "lockdatav"; $user_pwd = md5($user_name); $user_auth = 1; $admin_is_super = 1; $user_depart = "网络中心"; $user_roles = "超级管理".

2020-11-26 19:07:23 172

原创漏刻有时拼接屏测试分辨率的测试页面

<div>网页可见区域宽：<span id="v1"></span></div><div>网页可见区域高：<span id="v2"></span></div><div>屏幕可用工作区宽度：<span id="v3"></span></div><div>屏幕可用工作区高度：<span id="v4"></span><.

2020-11-25 12:03:52 115 1

原创 Echarts处理点击链接事件的解决方案

设置地区名称数组 var town = ["莞城街道", "南城街道", "东城街道", "万江街道", "石龙镇", "石排镇", "茶山镇", "企石镇", "桥头镇", "东坑镇", "横沥镇", "常平镇", "虎门镇", "长安镇", "沙田镇", "厚街镇", "寮步镇", "大岭山镇", "大朗镇", "黄江镇", "樟木头镇", "谢岗镇", "塘厦镇", "清溪镇", "凤岗镇", "麻涌镇", "中堂镇", "高埗镇", "石碣镇", "望牛墩镇", "洪梅镇", "道滘镇"];

2020-11-23 12:44:48 140

原创漏刻有时在提交数据出现Unknown column的错误提示解决方案

只适合数字类型的sql语句 $db->update('fireground', array('data_id' => $data_id), 'id=' . $id);建议写法 $db->update('fireground', array('data_id' => $data_id), array('id' => $id));根本原因就是数据类型和文本类型在mysql语句中需要‘’单引号的原因。DONE!...

2020-11-21 20:53:34 126

原创 layui实现登录加载loading的解决方案

var $ = layui.jquery, upload = layui.upload; var loadingIndex; upload.render({ elem: '#uploadImg' , url: '?m=News&a=newsDeal&act=upImg&fromImg=0' , multiple: true , accept: 'file'.

2020-11-21 20:05:48 310

原创漏刻有时数据可视化大屏实现已登录直接跳转到页面的方法

function index() { //判断是否登录； if (@$_COOKIE["adminname"] == "") { global $CONF; $tpl = new Smarty; $tpl->assign('title', $CONF['sys_name']); $tpl->assign('STATIC', 'static/news/');..

2020-11-21 20:04:47 65

原创 Echarts地理坐标地图geojson文件解码过程

Echarts提供的解码方式 function decodePolygon(coordinate, encodeOffsets, encodeScale) { var result = []; var prevX = encodeOffsets[0]; var prevY = encodeOffsets[1]; for (var i = 0; i < coordinate.length; i += 2) {

2020-11-18 14:22:01 367

原创 php计算两个坐标点之间的距离的类

/* 计算两组经纬度坐标之间的距离 * @param $lat1 纬度1 * @param $lng1 经度1 * @param $lat2 纬度2 * @param $lng2 经度2 * @param int $len_type 返回值类型(1-m 2-km) * @param int $decimal 保留小数位数 * @return float */function getDistance($lat1, $lng1, $lat2, $lng2, $len_type = 1, $d

2020-11-18 14:18:25 66

原创百度地图异步加载开发系列(7):计算两个坐标点距离的API

//异步加载地图 function loadJScript() { var script = document.createElement('script'); script.type = 'text/javascript'; script.src = 'http://api.map.baidu.com/api?v=2.0&ak=&ak=11Z8uiP8kIz6AG0Vjiwzbc5f9I&callback=init';...

2020-11-18 14:17:22 135

原创 mysql按天自动生成表分区的执行语句

CREATE TABLE `jk_data` ( `id` int(11) NOT NULL AUTO_INCREMENT COMMENT '数据ID主键', `jk_date` datetime NOT NULL COMMENT '时间日期格式', `jk_time` int(11) DEFAULT NULL COMMENT 'Unit格式的时间', `jk_sn` varchar(20) DEFAULT NULL COMMENT '设备序列号SN', `jk_counter` int

2020-11-18 09:52:43 56

原创 Echarts图表应用实战案例分析

截至目前，用Echarts做到比较满意的一个实战案例。整体分为三个部分：左线：柱状堆叠图A、柱状堆叠图（异化成刻度尺）B、柱状图堆叠（柱状进度条）C；横洞：柱状图G；右线：柱状堆叠图D、柱状堆叠图（异化成刻度尺）E、柱状图堆叠（柱状进度条）F；其中，A&D、B&E、C&F，各公用一组封装的Echarts代码，G单独柱状图一组Echarts代码。不完美的地方：实际生产环境过程中的数据都是不可控的，为此，想展现完美的图形，比较困难；由于是放在大屏上自动展示的，无鼠标互.

2020-11-17 16:20:07 156

原创 Echarts手机端无刷新实现图表自适应横屏和竖屏的解决方案

myChart.setOption(option); /*window.addEventListener("resize", function () { myChart.resize(); });*/ window.addEventListener("onorientationchange" in window ? "orientationchange" : "resize", acrossOrVertical, false); function ac...

2020-11-17 14:56:18 343

原创 php模版引擎smarty中判断数组是否为空自动输输出

<span id="equip">设备数量：<label id="equipNum">{if $total|@count eq "0" }0{else}{$total}{/if}</label></span>Done !

2020-11-15 12:28:25 39

原创 Echarts高级进阶教程(5)：mysql大数据量分表分区的API接口读取语句

public function getData() { global $db, $res; dbc(); //分组序列号; $jk_sn = "6910001582"; //当日分区数据; $partName = get_param("partName"); if (empty($partName)) { //$partName = "jk_data" . date("Ymd"); $partName = "jk_data20201113"; } $sql.

2020-11-14 23:08:18 55

原创 php实现mysql计算经纬度坐标距离的筛选附近范围POI的解决方案

经测试，按照该公式和腾讯地图经纬度距离计算，精度基本上是匹配的。地球半径采用的是6378.137千米。 //选取小余500m的经纬度; public function getNear() { global $db, $res; dbc(); $city_lat = "29.800712"; $city_lng = "121.556758"; $sql = "select toilet_id,toilet_name,toilet_address,toilet_url,toilet_

2020-11-14 20:17:00 103

原创 Echarts实战案例代码(54)：柱状图堆叠实现刻度线的解决方案

var a = [0, 10, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 100, 85];var b = [150290, 3, 4, 5, 6, 7, 8, 9, 151, 1, 2, 3, 4, 5, 6, 7, 8, 9, 152, 1, 2, 3, 4, 5, 6, 7, 152785];var s = .

2020-11-14 19:10:47 51

原创 Echarts实战案例代码(53)：刻度线的实现解决方案

option = { xAxis: { boundaryGap:false, axisLabel:{ rotate:30, }, data: [150290, 3, 4, 5, 6, 7, 8, 9, 151, 1, 2, 3, 4, 5, 6, 7, 8, 9, 152, 1, 2, 3, 4, 5, 6, 7, 152785] }, yAxis: { show:f.

2020-11-14 18:25:12 70 1

原创 Echarts实战案例代码(52)：双轴折线图的配置

var dom = document.getElementById("container"); var myChart = echarts.init(dom); var option = { legend: { data: ['波长', '物理量'] }, tooltip: { trigger: 'axis', axisPointer: { ..

2020-11-13 09:39:44 56

原创腾讯地图开发(1)：点击地图事件解析地址

//解析地址 analysis(position.lat, position.lng); //绑定地图点击事件 qq.maps.event.addListener(map, "click", function (e) { $('#poi_lat').html(e.latLng.getLat().toFixed(6)); $('#poi_lng').html(e.latLng.getLng().toFixed..

2020-11-13 09:30:13 82

原创百度地图和腾讯地图开发经纬度的位置是互换的

腾讯地图的坐标拾取：https://lbs.qq.com/tool/getpoint/index.html，坐标格式：29.844217,121.558228。百度地图的坐标拾取：http://api.map.baidu.com/lbsapi/getpoint/index.html，坐标格式：121.636018,29.86206。经纬度的位置是互换的，与之对应的程序开发API接口腾讯地图：var map = new qq.maps.Map(document.getElementById("co

2020-11-13 09:29:38 212

原创 php公用函数：获取字符串中英文混合长度

//获取字符串中英文混合长度function get_strlen($str, $charset = 'utf-8'){ if ($charset == 'utf-8') $str = iconv('utf-8', 'gb2312', $str); $num = strlen($str); $cnNum = 0; for ($i = 0; $i < $num; $i++) { if (ord(substr($str, $i + 1, 1)) > 127) { $cnNu

2020-11-09 21:22:36 34

原创 php公用函数：生成随机数字大小写字母的N位随机字符串

//获取随机字符串function get_randNum($len = 12){ $chars = '0123456789abcdefghijklmnopqrstuvwABCDEFGHIGKLMNOPQRSTUVWXYZ'; $str = ''; for ($i = 0; $i < $len; $i++) { $str .= $chars[mt_rand(0, strlen($chars) - 1)]; } return $str;}Done！...

2020-11-09 21:20:50 45

原创 php公用函数：生成唯一的字符串

//创建一个新名字function getNewName(){ return md5(uniqid(md5(microtime(true)),true));}Done！

2020-11-09 21:18:08 44

原创 php将数组转化成拼接IN字符串实现mysql使用where in 用法

select * from table where unamein(‘aaa’,bbb’,‘ccc’,‘ddd’,‘eee’,ffff’’);/* 拼接成in格式: IN('a','b','c') * @access public * @param mix $list 列表数组或字符串 * @return string*/function create_in($list = ''){ if (empty($list)) { ret.

2020-11-09 21:15:36 209

原创百度地图API开发：map.getDistance计算两点之间的距离（直线距离）

getDistance(start: Point, end: Point),返回两点之间的距离，单位是米创建容器<div id="container"></div>JS代码 //异步加载地图 function loadJScript() { var script = document.createElement('script'); script.type = 'text/javascript'; scrip.

2020-11-08 20:31:03 694

原创 Echarts实战案例代码(51)：堆叠图tooltip组件显示对应的柱图提示信息解决方案

tooltip: { trigger: 'axis', axisPointer: { type: "cross", label: { formatter: function (params) { if (params.seriesData.length === 0) { ...

2020-11-06 16:17:01 80

原创 Echarts实战案例代码(50)：tooltip组件提示框被div折叠的解决方案

设置跟随鼠标位置参数 tooltip: { trigger: 'axis', //设置其显示位置其中p为当前鼠标的位置 position: function (p) { return [p[0] - 40, p[1] - 300]; } },2.confine属性 tooltip: { trig.

2020-11-06 12:43:02 72

原创 Echarts实战案例代码(49)：基于不支持立体漏斗图Funnel的HTML+CSS解决方案

Echarts的Funnel目前是不支持3D的，但是设计师在项目过程中，为了项目的炫目，会出现伪3D之类的图表。本案例是基于HTML+CSS的解决方案CSS样式表 body { margin: 0; padding: 0; background-color: #343d4b; } .funnel { background: url("funnel.png") n

2020-11-05 10:15:27 293

原创 Echarts实战案例代码(48)：堆叠图实现图形和坐标轴对齐的解决方案

xAxis: { type: 'value', axisLine: { show: false }, axisTick: { show: false }, axisLabel: {show: false}, splitLine: {show: false}, ...

2020-11-05 08:59:49 62

原创获取web页面的宽度和高度

网页可见区域宽： document.body.clientWidth网页可见区域高： document.body.clientHeight网页可见区域宽： document.body.offsetWidth (包括边线的宽)网页可见区域高： document.body.offsetHeight (包括边线的高)网页正文全文宽： document.body.scrollWidth网页正文全文高： document.body.scrollHeight网页被卷去的高： document.body.sc

2020-11-04 17:35:55 1

原创 ajax刷新php后台实现定时任务的执行解决方案

项目需求：数据可视化大屏开发中，需要设置定时任务：2点时返回10人，5点时返回20人……实现自动刷新，不能手动刷新页面。项目理解：javascript可以设置定时任务，但是无法执行任务；php也无法执行任务；解决方案：前端ajax轮询刷新php页面data.php； function getContent() { $.ajax({ type: "post", async: true, url: "da

2020-11-04 01:47:39 132 1

原创 php://input的理解应用

try { $data = file_get_contents('php://input'); //get POST payload, 获取post包文 $json = json_decode($data, true); //parse input data into json, 解析json，并进行业务逻辑 //-----------注意: 请确保业务逻辑在15秒之内完成，否则服务器端将做超时处理------------// $fileName = time(); $myfile =

2020-11-01 09:41:04 56

雄安新区GEOJSON带县边界

雄安新区（Xiong'an New Area）位于中国河北省保定市境内，规划范围涵盖河北省雄县、容城、安新等3个小县及周边部分区域，对雄县、容城、安新3县及周边区域实行托管，是中国（河北）自由贸易试验区组成部分。

2020-07-06

隧道施工建设数字化大屏说明文档

隧道施工建设数字化大屏说明文档，一个标准的业务文档：为前端定制产品开发，调用甲方提供的API数据接口来实现数据的展示和互动，为此部分参数的设计全部融于页面内。

2020-11-28

gis数据可视化GeoJson、TopoJson、SVG、SHP、JS格式的标准模版

gis数据可视化GeoJson、TopoJson、SVG、SHP、JS格式的标准模版，可以按照标准格式，进行实际应用场景的格式转化和使用

2020-07-25

图片热点的hover高亮显示mapper.js

javascript插件库的应用：mapper.js实现图片热点的hover高亮效果，详见：https://blog.csdn.net/weixin_41290949/article/details/108214691

2020-08-25

upload.zip

layui请求上传接口出现异常：upload.js 错误底层报错信息修改。作者仅在2.26版测试，其他版本未测试，请下载时自行排查，覆盖文件前，记得备份，备份，备份……

2020-02-05

bmap.min.js

echarts引入百度地图，通过<script>脚本bmap.min.js解决默认开启底图可点功能的底层修改

2020-05-22

JavaScript将csv转为json标准的.csv文件模版

CSV是Comma Separated Values的缩写，一种常用的数据存储文件格式，其中每一行是一条记录，每一条记录包含很多列，每列中的数据通常使用逗号分隔，当其中的值包含逗号时需要使用单引号或双引号包含。

2020-02-12

sampling降采样策略.zip

Echarts高级进阶教程(1)：异步加载大量数据导致dataZoom组件拖动缩放时间轴卡顿的sampling降采样策略解决方案

2020-10-12

Echarts5开源可视化图表库开发的象形柱图世界旅游景点日记照片墙

Echarts5开源可视化图表库 1. 图表基础框架的搭建； 2. series-pictorialBar，象形柱图； 3. series-bar，柱状图； 4. dataZoom 组件，用于区域缩放； 5. on方法添加事件处理函数；

2021-02-10

不设区的地级市之东莞市geoJSON转js

东莞市辖32个镇（街道），其中包括4个街道（莞城街道、南城街道、东城街道、万江街道）；28个镇（石龙镇、石排镇、茶山镇、企石镇、桥头镇、东坑镇、横沥镇、常平镇，虎门镇、长安镇、沙田镇、厚街镇，寮步镇、大岭山镇、大朗镇、黄江镇，樟木头镇、谢岗镇、塘厦镇、清溪镇、凤岗镇，麻涌镇、中堂镇、高埗镇、石碣镇、望牛墩镇、洪梅镇、道滘镇）

2020-07-06