OpenLayers 笔记
创建多边形 <!DOCTYPE html> <html lang=“en”> <head> <meta charset=“UTF-8”> <meta name=“viewport” content=“width=device-width, initial-scale=1.0”> <meta http-equiv=“X-UA-Compatible” content=“ie=ed …
分类： 前端
ArcGIS 绘制多边形拖拽编辑旋转
<!DOCTYPE html> <html> <head> <meta http-equiv=“Content-Type” content=“text/html; charset=utf-8”> <meta name=“viewport” content=“width=device-width,user-scalable=no”> <meta name=“viewport” content=R …
inline-block 的间隙问题
在CSS布局中，如果我们想要将一些元素在同一行显示，其中的一种方法就是把要同行显示的元素设置display属性为inline-block。但是你会发现这些同行显示的inline-block元素之间经常会出现一定的空隙，这是“换行符/空格间隙问题”。 <!DOCTYPE html> <html> <head> <title>display:inline-block元素之间空隙的产生原因和解决办法</title> <style type=“text/css”> .parent .chil …
WebRTC通信原理
WebRTC需要通过长链接查找到通信双方，然后通过 peer to peer 的方式传输音频数据。 PeerConnection PeerConnection是WebRTC中封装的对象。每一路的音视频会话都会有唯一的一个PeerConnection对象，WebRTC通过这个PeerConnection对象进行视频的发起、传输、接收和挂断等操作。 PeerConnection中包含的属性如下： localDescription：本地描述信息，类型：RTCSessionDescription remoteDescription：远端描述信息，类型：RTCSessionDescription oni …
微前端为什么舍弃了 iframe
如果不考虑体验问题，iframe 是最完美的微前端解决方案。 但着产品体验的需求增强，iframe 又带来了一些不好的体验。 url 不同步。浏览器刷新 iframe url 状态丢失、后退前进按钮无法使用。 UI 不同步，DOM 结构不共享。想象一下屏幕右下角 1/4 的 iframe 里来一个带遮罩层的弹框，同时我们要求这个弹框要浏览器居中显示，还要浏览器 resize 时自动居中.. 全局上下文完全隔离，内存变量不共享。iframe 内外系统的通信、数据同步等需求，主应用的 cookie 要透传到根域名都不同的子应用中实现免登效果。 慢。每次子应用进入都是一次浏览器上下文重建、资源重新加 …
Uncaught DOMException: Failed to execute ‘toDataURL’ on ‘HTMLCanvasElement’: Tainted canvases may not be exported.
Htmlimagelement 接口的 crossOrigin 属性是一个字符串，它指定了在检索图像时使用的跨来源资源共享设置。 指定在获取图像资源时使用的 CORS 模式的关键字的 DOMString。如果不指定 crossOrigin，则在不使用 CORS (获取无 CORS 模式)的情况下获取图像。 anonymous 元素的请求的模式设置为 cors，凭据模式设置为 same-origin。这意味着，如果从加载文档的同一源获取映像，则启用 CORS 并发送凭据。 use-credentials Htmlimagelement 的请求将使用 CORS 模式和 include 凭证模式; …
web移动端开发指南
调用系统功能 <!– 拨打电话 –> <a href=”tel:10010″>拨打电话给10010</a> <!– 发送短信 –> <a href=”sms:10010″>发送短信给10010</a> <!– 发送邮件 –> <a href=”mailto:xxx@mail.com”>发送邮件给xxx</a> <!– 选择照片或拍摄照片 –> <input type=”file” accept=”image/*”> <!– 选择视频或拍摄视 …
js 获取文件 MD5
每个文件的md5值都是唯一的，这也是很多下载网站，会告诉你原文件的md5是多少，然后下载完毕让你自行去对比是否一致，以检验文件是否是完整的。校验md5亦可实现所谓的”秒传“功能。 使用到的类库 Spark-MD5 function getMD5(file, callBack) { /* * file 选取的文件 * callBack 回调函数可以返回获取的MD5 */ let fileReader = new FileReader(), blobSlice = File.prototype.mozSlice || File.prototy …