arcgis 做闪烁定位

在做地图定位时候往往都是高亮边框的方式来做样式展示，今天通过gl-matrix 结合做闪烁定位，有点像照相机闪了一下的感觉

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
<title>闪烁定位</title>
<link href="https://fonts.googleapis.com/css?family=Gruppo|Orbitron&display=swap" rel="stylesheet">
<script src="https://cdn.bootcdn.net/ajax/libs/gl-matrix/2.8.1/gl-matrix.js"></script>
<link rel="stylesheet" href="https://js.arcgis.com/4.19/esri/themes/light/main.css" />
<script src="https://js.arcgis.com/4.19/"></script>
<style type="text/css" media="screen">
html,
body,
#viewDiv {width: 100%;
height: 100%;
padding: 0;
margin: 0;
}#info {position: absolute;
right: 100px;
bottom: 100px;
color: white;
font-family: 'Gruppo', cursive;
}#info h1 {font-family: 'Orbitron', sans-serif;
}
</style><script id="features-vs" type="x-shader/x-vertex">
precision highp float;uniform mat3 u_transform;
uniform mat3 u_display;attribute vec2 a_position;void main() {gl_Position.xy = (u_display * (u_transform * vec3(a_position, 1.0))).xy;
gl_Position.zw = vec2(0.0, 1.0);
}
</script><script id="features-fs" type="x-shader/x-fragment">
precision highp float;void main() {gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);
}
</script><script id="edges-vs" type="x-shader/x-vertex">
precision mediump float;attribute vec2 a_position;varying vec2 v_texcoord;void main(void) {gl_Position = vec4(a_position, 0.0, 1.0);
v_texcoord = 0.5 * (a_position + 1.0);
}
</script><script id="edges-fs" type="x-shader/x-fragment">
precision mediump float;uniform sampler2D u_texture;
uniform ivec2 u_size;varying vec2 v_texcoord;vec4 sample(int dx, int dy) {return texture2D(u_texture, v_texcoord + vec2(dx, dy) / vec2(u_size));
}float height(int dx, int dy) {return length(sample(dx, dy).ra);
}void main(void) {float dx = -(height(+1, 0) - height(-1, 0));
float dy = -(height(0, +1) - height(0, -1));gl_FragColor = vec4(length(vec2(dx, dy)), 0.0, 0.0, 1.0) * texture2D(u_texture, v_texcoord).a;
}
</script><script id="blur-vs" type="x-shader/x-vertex">
precision mediump float;attribute vec2 a_position;varying vec2 v_texcoord;void main(void) {gl_Position = vec4(a_position, 0.0, 1.0);
v_texcoord = 0.5 * (a_position + 1.0);
}
</script><script id="blur-fs" type="x-shader/x-fragment">
precision mediump float;uniform sampler2D u_texture;
uniform ivec2 u_size;varying vec2 v_texcoord;vec4 sample(int dx, int dy) {return texture2D(u_texture, v_texcoord + vec2(dx, dy) / vec2(u_size));
}void main(void) {vec4 blurred = vec4(0.0, 0.0, 0.0, 0.0);for (int i = -1; i <= 1; ++i) {for (int j = -1; j <= 1; ++j) {blurred += sample(i, j);
}
}gl_FragColor = blurred / 9.0;
}
</script><script id="lighting-vs" type="x-shader/x-vertex">
precision mediump float;attribute vec2 a_position;varying vec2 v_texcoord;更多消息参考小专栏https://xiaozhuanlan.com/topic/4816923075

arcgis 做闪烁定位相关推荐

【ArcGIS教程一】如何用ArcGIS做一张专题地图
对于很多小伙伴来说,不知道如何用ArcGIS做一张专题地图,并且出图放在word中展示.本期我们以一张全国各省市累计确诊人数专题图为例给大家展示如何用ArcGIS做一张如下图所示的疫情专题图,v公众号 ...
AI 产品如何做产品定位分析？
~ 个人背景:因为还属于产品大白,对商业化还不够深入了解,正在积累相关知识.只能先凭借自己的感觉来理解 AI 产品的方向和定位. AI 产品在做产品定位的时候,比常规产品要考虑多一个维度,就是算法和数 ...
用高德js api做h5定位功能
定位失败?what 最近项目中有一需求要实现手机定位当前城市功能, 查了高德地图api,根据文档说明很快就做出来了. AMap.plugin('AMap.CitySearch', function ( ...
利用ArcGIS做一张土地利用现状图
利用ArcGIS做一张土地利用现状图首先我们打开ArcGIS加载进来三调数据,这是镇的数据,现在我们需要村的行政边界.首先打开属性表添加一个新的字段命名"行政代码"字段属性为文本 ...
android arcgis定位,arcgis android之定位功能的示例代码
关于定位的功能,开发,很早之前就有做过百度的定位功能.起初是有想法把百度的Loc V3.2的定位SDK整合进来用.但是终归是想法,但是知道昨天,我问技术群,里面的一位朋友就说起了百度地位SDK整合进来 ...
arcgis engine设置数据源路径_不用ArcGIS做前期分析，你是不是想被辞！
Q 你有没有遇到这样的情况? 身边的同事或同学经常说什么高程图.坡向图.坡度图.生态水文图.热力密度图.大数据算法,而自己却一无所知,心里感到特别的慌啊. 文末附ArcGIS最新版及超强数据神器很多 ...
arcgis 做凹凸起伏的分类图
arcgis 在做二维的 class-break 往往是用simplefillSymol 来做面,比较单一,除了颜色和边框,不能再设置更多的方式了不过可以用gl-matrix 结合来做凹凸起伏的可视 ...
卫星定位普遍误差5-20米，「星舆科技」想借北斗东风做高精度定位技术
2018年12月27日,中国卫星导航系统管理办公室宣布,中国北斗三号基本系统建设完成,开始提供全球服务.到2020年,将发射11颗北斗三号和1颗北斗二号卫星.届时,北斗产业预计将产生超过4000亿元人 ...
利用ENVI和ARCGIS做相关性分析的两种方法
一.ENVI里如何对两个波段进行相关性分析 1.首先获取要统计的两个波段的信息,这里用的ndvi和地表反照率(aldeo),两个波段值经过归一化后进行计算 2.首先利用layer stacking工具 ...

arcgis 做闪烁定位

arcgis 做闪烁定位相关推荐

最新文章

热门文章