最近一直在开发浙江省消防项目,过程中遇到一个问题:消防网格与行政网格并非完全一致,存在要增加一个单独的区或者在某个区扣除部分街道出来.
(比如以前一个市下面有5个区A,B,C,D,E.现在要增加一个区F,F下有4个街道,分别从D,E两个区里面拿街道.类似这样的需求)想要自己分析每个区下面的街道网格去合并生成一个新的区,非常慢,并且一不小心就容易出错.经过需求分析发现真正需求就是编辑线段:可对线段进行擦除或者对多条线段进行合并.

然后怎样都搜索不到有线段擦除,合并的功能,于是只能自己开发.花了两天时间总算将就开发了一个可以用的功能.里面包含导入线段,线段擦除,线段合并,线段反序(合并的时候可能会用到,要保证所有线段方向的一致性,每条线段都是A线段尾部连接B线段头部),线段合并预览(当有3条及以上线段进行合并时,没有预览很容易出错:多条线段合并是有顺序的)

其中导入的线段格式是 x1,y1;x2,y2;x3,y3;...xn,yn;

将来再看是否有新需求考虑增加功能
代码不介绍了,给个github地址给需要的人.

在线编辑地址demo

==================================================================================
后面又增加了锁定线段及批量导出功能

css3中有属性filter专门去处理一些滤镜效果, 其中 blur(20px)代表高斯模糊(20px代表20个像素点混合) .

如果想实现下图效果则需要用点非常规的办法

上图实现方法是 背景图+中间磨砂的图片+ 弹出内容

body内标签

  <div class="container">
    <div class="content">
      <h1>弹出信息</h1>
      <p>巴拉巴拉巴拉巴拉</p>
    </div>
  </div>

css代码

* {
      margin: 0;
      padding: 0;
    }

    .container {
      width: 100vw;
      height: 100vh;
      position: relative;
      background: url('http://qn.fengyitong.name/1.jpg') center / cover fixed;
      /* 
      上面拆分开来的写法
      background-image: url('http://qn.fengyitong.name/1.jpg'); 
      background-attachment: fixed;
      background-size: cover;
      background-position: center; */
    }

    .content {
      position: absolute;
      left: 50%;
      top: 30%;
      margin-left: -150px;
      width: 300px;
      height: 300px;
      background: hsla(0, 0%, 100%, 0.3);
    }

    .content::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      filter: blur(20px); /* 对于中间的内容部分的背景进行高斯模糊 */
      background: url('http://qn.fengyitong.name/1.jpg') center / cover fixed;
      z-index: -1;    /* 让模糊部分背景置于内容后方 */
      margin: -30px; /* 保证边缘部分进行高斯模糊 */
    }

    .content {
      overflow: hidden; /* 超出的部分隐藏(模糊部分margin会导致超出) */
      z-index: 1; /* 让模糊部分背景置于内容前方 */
    }

以上可以实现一个全屏的背景+中间磨砂效果,但是如果说我们想要一个非全屏的背景,中间磨砂效果的话(即container的宽高不是满屏),这个css要如何做出这效果我没想到,想到最简单的办法可能是要用canvas去辅助实现生成背景图片.后面如果有时间的话我再补上这块的js代码.

今天在写API文档的时候碰到需要在表格中填 |,但是markdown本身的表格|代表分割线
在表格中需要用|代替,但是本身又想用行内代码包裹使得样式好看
最终解决方案:

|  名称 |  说明 |
| ------------ | ------------ |
| xxx| 分隔符: <code>&#124;</code> |

记录一下,免的自己后面忘记.

下载脚本&运行脚本

wget --no-check-certificate -O shadowsocks.sh https://raw.githubusercontent.com/teddysun/shadowsocks_install/master/shadowsocks.sh
chmod +x shadowsocks.sh
./shadowsocks.sh 2>&1 | tee shadowsocks.log

另外一个源

wget --no-check-certificate https://raw.githubusercontent.com/quniu/shadowsocks-all/master/install/shadowsocks-all.sh
chmod +x shadowsocks-all.sh
./shadowsocks-all.sh 2>&1 | tee shadowsocksR.log

安装

第一步输入密码,
第二步输入端口号,
第三步输入加密方式 (默认7)

任意键等待安装

修改配置文件

vi /etc/shadowsocks.json 

配置防火墙

systemctl stop firewalld.service

启动/停止ss服务

ssserver -c /etc/shadowsocks.json -d start
ssserver -c /etc/shadowsocks.json -d stop
// 端口处理
// 查看所有打开的端口： 
firewall-cmd --zone=public --list-ports
// 添加
firewall-cmd --zone=public --add-port=80/tcp --permanent    （--permanent永久生效，没有此参数重启后失效）
// 重新载入
firewall-cmd --reload
// 查看
firewall-cmd --zone= public --query-port=80/tcp
// 删除
firewall-cmd --zone= public --remove-port=80/tcp --permanent

开启bbr加速

wget --no-check-certificate https://github.com/teddysun/across/raw/master/bbr.sh
chmod +x bbr.sh
./bbr.sh

重启后验证是否开启bbrlsmod | grep bbr返回看到 tcp_bbr 就说明 BBR 已经启动了

记录一下v2ray

bash <(curl -L -s https://install.direct/go.sh)

注意要处理防火墙

WEBGL编程指南书中对应的demo文件中,有好几个demo文件直接运行无法显示页面效果,控制台会报错:

Failed to compile shader: ERROR: 0:3: 'GL_ES' : unexpected token after conditional expression

原因是demo中写错了,修改一下即可:

...
// Fragment shader program
var FSHADER_SOURCE =
  '#ifdef GL_ES\n' +
  'precision mediump float;\n' + // Precision qualifier (See Chapter 6)
  '#endif GL_ES\n' +
...

这里#endif 不应该加GL_ES,去掉即可,那一行改成:
'#endif \n' +

笔者应该是复制错了吧...我看了一下好多地方是这样写.
为像我一下在学这本书的人记录一下.