E-COM-NET
首页
在线工具
Layui镜像站
SUI文档
联系我们
推荐频道
Java
PHP
C++
C
C#
Python
Ruby
go语言
Scala
Servlet
Vue
MySQL
NoSQL
Redis
CSS
Oracle
SQL Server
DB2
HBase
Http
HTML5
Spring
Ajax
Jquery
JavaScript
Json
XML
NodeJs
mybatis
Hibernate
算法
设计模式
shell
数据结构
大数据
JS
消息中间件
正则表达式
Tomcat
SQL
Nginx
Shiro
Maven
Linux
webGl
Openlayers加载海量数据之
WebGL
Openlayers加载海量数据之
WebGL
Openlayers6及以上版本,地图的每个图层都是单独进行渲染的。也就是说有的图层可用Canvas2D渲染,有的图层可以用
WebGL
渲染。
Aiences
·
2023-10-14 14:30
openlayers
javascript
前端
webgl
openlayers
webGl
shader的学习记录(二)js 与(glsl语言) OpenGL ES之间如何进行交互?及其如何在js中对vertexShader与fragmentShader进行赋值
再上一个的章节之中我们知道,着色的书写分两个着色器(顶点着色器与片元着色器),从而结合成为一个可以使用的单独使用的着色器的程序。下面我们将会接触到的是,如何使用js与(glsl语言)OpenGLES之间进行交互。在了解两者之间如何通讯的时候,我们需要了解一些定义。这些定义出来的数据,可以是的glsl与js进行交互。attribute变量:attribute变量是只能在vertexShader中使用
sogooday
·
2023-10-14 09:59
webGl
webgl
js与shader交互
vertexShaer
fragmentShader
webGL
编程指南 第三章 绘制四角形.helloQuadjs(加餐)
我会持续更新关于wegl的编程指南中的代码。当前的代码不会使用书中的缩写,每一步都是会展开写。希望能给后来学习的一些帮助git代码地址接着上一节接着做使用缓冲区赋值。本节中我们还是使用4个顶点,放在一个数组中。然后去获取缓冲区中的数据,同时绘制矩形在绘制的时候我们给它添加上颜色。下面是代码Documentletcanvas=document.getElementById('canvas');let
sogooday
·
2023-10-14 09:29
webGl
webgl
javascript
前端
webGL编程指南
webGl
shader的学习记录(一) 在canvas的中心画出一个红点 点图元
笔者也在学习如何写出shader下面是自己的想法希望对大家有用其实在
webGl
写shader的时候,我们可以分将整体分为几个部分第一部分是顶点着色器1,建立顶点着色的相关代码,2,创建顶点着色器,并将顶点着色器的代码
sogooday
·
2023-10-14 09:29
webGl
webGL
webGL
编程指南 第二章 helloPint.js
我会持续更新关于wegl的编程指南中的代码。git代码地址:sogooday当前的代码不会使用书中的缩写,每一步都是会展开写。希望能给后来学习的一些帮助效果如下下面是代码Document/*在这里需要注意的是在写vertexShaderSource与fragmentShaderSource因为是没有文本提示的,很容易写错的*///订单着色器letvertexShaderSource=`voidma
sogooday
·
2023-10-14 09:58
webGl
javascript
webgl
WebGL编程指南
WebGL
编程指南学习中整体的理解
在学习
webgl
的时候,我们大概可以将代码分为5各部分写opengles的代码顶点着色器与片元着色器(主要处理的部分)使用
webgl
的api将顶点着色器与片元着色器传递给opengles使用js作为桥梁
sogooday
·
2023-10-14 09:58
webGl
学习
webgl
webGL
编程指南 第三章 multiPoints.js
希望能给后来学习的一些帮助git代码地址https://github.com/soGooday/webPlan/blob/main/
webGL
/
webGl
%E7%BC%96%E7%A8%8B%E6%8C
sogooday
·
2023-10-14 09:58
webGl
javascript
开发语言
WebGL编程指南
关于webl中TRIANGLES_STRIP
webgl
中的三角形的绘制有三种方法分别是:TRIANGLES:每三个定点决定一个三角形例如[012][3,4,5][5,6,7]顶点数与三角形是n:n/3的关系TRIANGLES_FAN:第0个定点是多所有三角形共享的
sogooday
·
2023-10-14 09:58
webGl
几何学
TRIANGLES
TRIANGLES_STRIP
TRIANGLES_FAN
webGl
shader的学习记录(五):如何画线段
今天学习一下如何使用
webgl
画一条线段letvertexShaderSource=`//浮点数设置为中等精度precisionmediumpfloat;//接收JavaScript传递过来的点的坐标(
sogooday
·
2023-10-14 09:28
webGl
webgl
line
webGl
shader的学习记录(六):如何画出一个渐变色填充的矩形
其实将两个两个三角形合并一下,就出现了。一个矩形使用两种方式一个是两个buffer一个是单一的bufferglcl代码//浮点数设置为中等精度precisionmediumpfloat;//接收JavaScript传递过来的点的坐标(X,Y)attributevec2a_Position;//接收canvas的尺寸。attributevec2a_Screen_Size;//接收JavaScript
sogooday
·
2023-10-14 09:28
webGl
weblg
矩形
webGl
shader的学习记录(四):如何与人互动绘制多个三角形。
正在这一章节中我们将会学习到如何使用鼠标创造多个三角形,从而实现互动老规矩首先我们需要先处理一下顶点着色器与片元着色器letvertexShaderSource=`//设置浮点数精度为中等精度precisionmediumpfloat;//接收顶点坐标(x,y)attributevec2a_Position;//接收canvas的尺寸(width,height)attributevec2a_Scr
sogooday
·
2023-10-14 09:27
webGl
webgl
动态
绘制
三角形
webGl
shader的学习记录(三):怎么样去画出来一个三角形
在这章节中我们需要绘制一个静态的三角形首先我们依旧是现需要写两个顶点着色器的素材与顶点做色器的素材。就是下面这段代码//顶点着色器letvertexShaderSource=`precisionmediumpfloat;attributevec2a_Position;voidmain(){gl_Position=vec4(a_Position,0,1);}`//片元着色器letfragmentSh
sogooday
·
2023-10-14 09:57
webGl
webgl
三角形
webGL
编程指南 第三章 绘制四角形.helloQuadjs
我会持续更新关于wegl的编程指南中的代码。当前的代码不会使用书中的缩写,每一步都是会展开写。希望能给后来学习的一些帮助git代码地址接着上一节接着做使用缓冲区赋值。本节中我们还是使用4个顶点,放在一个数组中。然后去获取缓冲区中的数据,同时绘制正方形下面是代码Documentletcanvas=document.getElementById('canvas');letgl=canvas.getCo
sogooday
·
2023-10-14 09:50
webGl
webgl
CSS 炫酷文本过渡动画
今天分享一个炫酷的文本过渡动画效果,如下面GIF所示,曾经是否有见过这种动画呢,想想是不是感觉挺复杂呢,通常这个过渡效果通过较为复杂的可用
WebGl
实现,本文通过另一种方式实现,文章尾部有神奇的代码,快来瞧瞧看吧
南城FE
·
2023-10-13 20:44
前端CSS那些事
前端动画合集
css3
动画
css
Three.js第一个小栗子以及代码结构。
这一章,是copy的
WebGL
中文网(为图方便,以下用中文网代替)的内容。再加上自己的一些理解,当然不是很多。
风筝啊
·
2023-10-13 15:10
Three.js实现光照阴影
1.renderer设置首先我们需要告诉渲染器我们需要阴影效果:renderer.shadowMap.enabled=true;更多详细内容可以查看
WebGL
Renderer的s
travelclover
·
2023-10-13 15:05
Three.js 从入门到精通 - 笔记总结
Three.js目录文章目录前言推荐阅读`HTML`引入`Three.js`引擎1.3D3D3D场景引入引擎案例源码立方体球体代码解释程序的结构场景-相机-渲染器对象、方法和属性
WebGL
封装2.旋转动画
莫兮是我
·
2023-10-13 13:41
前端
JS
webgl
游戏
javascript
前端
Three.js入门
设置材质效果半透明效果材质常见属性材质类型光照效果设置常见光源类型顶点位置数据解析渲染自定义几何体点模型线模型顶点颜色数据插值计算渐变色之颜色插值访问几何体对象的数据几何体的旋转、缩放、平移变换参考Three.js教程(
webgl
3d.cn
程序员_yw
·
2023-10-13 13:09
可视化
javascript
WebGL
1、javaScript不支持线程2、移动端不支持
webGL
3、
webgl
不支持filestream4、浏览器不能直接使用socket5、openGL的api只支持到最老的2.06、只支持基本的音频功能
向前ing_
·
2023-10-13 13:29
前端人最值得关注的JS动画库来了
这个流行的库拥有超过4.3万star,是一种直观地使用
WebGL
在浏览器上创建3D动画的好方法。该库提供,,CSS3D和
WebGL
渲染器,使我们能够在设备和浏览器之间创建丰富的
骨灰设计师小X
·
2023-10-13 08:39
一种正在取代
WebGL
的新技术-WebGPU
它是由W3C的GPU为来自苹果、Mozilla、微软、谷歌和其他公司的工程师开发的与
WebGL
不同,WebGPU不是任何现有的本地API的直接端口。
Real游戏引擎开发者
·
2023-10-13 04:13
全网首发 黑马高端课程,仅限老学员免费领取
跨平台:由于Three.js是基于
WebGL
的,因此它可以在任何支持
WebGL
的浏览器上运行,无论是桌面、移动设备还是平板电脑。性能优化:Three.js提供了许多工具和技术来优化3
骨灰级收藏家
·
2023-10-13 01:10
前端
Web前端
Three.js
前端
基于HTML5和
WebGL
的3D网络拓扑结构图
现在,3D模型已经用于各种不同的领域。在医疗行业使用它们制作器官的精确模型;电影行业将它们用于活动的人物、物体以及现实电影;视频游戏产业将它们作为计算机与视频游戏中的资源;在科学领域将它们作为化合物的精确模型;建筑业将它们用来展示提议的建筑物或者风景表现;工程界将它们用于设计新设备、交通工具、结构以及其它应用领域;在最近几十年,地球科学领域开始构建三维地质模型,而且3D模型经常做成动画,例如,在故
weixin_34174132
·
2023-10-12 07:20
前端
游戏
开发工具
ViewUI
每日前端签到(第五十四天)
第五十四天(2018-09-26)[html]有用地过
WebGL
吗?说说你对它的理解[css]你有用过哪些css框架?
拿着号码牌徘徊
·
2023-10-12 03:13
Unity打包AssetBundle报错
这个报错只产生在我unity的
webgl
平台打包时,其它平台是没问题的报错1.这个报错一般资源文件有重复名字的文件也会有问题不过我的不是上面1的问题。
AngerCow
·
2023-10-12 00:19
kepler.gl安装使用_数分钟内提供精美的地图:认识Kepler.gl
乘车共享公司使用deck.gl
WebGL
数据可视化框
cumo7370
·
2023-10-11 18:57
可视化
java
大数据
人工智能
机器学习
腾讯地图基于
WebGL
实现自定义栅格图层踩坑实录
以下内容转载自totoro的文章《
WebGL
-Y轴翻转踩坑实录》作者:totoro链接:https://blog.totoroxiao.com/
webgl
-flipY/来源:https://blog.totoroxiao.com
小小码农biubiubiu
·
2023-10-10 05:00
自定义地图
地图瓦片
地图切图
腾讯地图
腾讯地图jsapi GL 加载自定义栅格图层无法在手机端显示的问题
解决:1、使用普通版本的jsapi,即不是
webgl
版本呢的,叠加自定义瓦片可以在手机端实现类似的效果。2、移动端需要设置view
brave211
·
2023-10-10 05:28
小程序
html
Vue3 + Photo-sphere-viewer 全景
使用该插件的唯一要求是浏览器支持canvas或
WebGL
。这只是一个简单的全景图,我们还可以在全景图上面不同位置添加标注,修改、删除标注等操作。
奺珁
·
2023-10-09 19:22
前端
-
vue
专栏
前端
-
知识点
前端
-
移动端开发
vue.js
前端
桌面动态壁纸
1、将压缩包中解压,选择所需要的壁纸复制到目录2、解压kugou动态壁纸运行程序,文件选择默认打开文件为animation_desktop_
webgl
.exe3、重启电脑生效
Mr_YDK
·
2023-10-09 16:23
桌面动态壁纸
浅谈
webGl
vr全景模式
开讲之前解释一下这些词,以免没学习过
webGl
的同学还要再去找百度
webGL
=>是一种3D绘图协议,这种绘图技术标准允许把JavaScript和OpenGLES2.0结合在一起,通过增加OpenGLES2.0
调皮小欧某
·
2023-10-08 19:34
vr
Three.js初体验——VR全景展示
前言Three.js是JavaScript编写的
WebGL
第三方库。提供了非常多的3D显示功能。
kitty_ELF
·
2023-10-08 19:32
学习记录
webgl
javascript
js
webgl
进阶Shader篇(基于Three.js)——第一个简单的Shader
一.从一个shader开始Three.js已经简化了很多写shader的工作,最主要的工作就是他把一些常用的矩阵已经作为一个常量提供给我们。首先来看Three.js官网的说明,一些常用参数已经和几何元素、相机等关联在一起,我们只需要拿来用即可。来看第一个shader,通过shader改变几何体表面的颜色,效果还是很炫酷的。Three框架div#canvas-frame{border:none;cu
niuge No.1
·
2023-10-08 18:33
webgl
01-Three.js 安装以及介绍
-p8000浏览器
WebGL
兼容性检查
WebGL
.jsif(!THREE.
WEBGL
.is
WebGL
Av
IsYang
·
2023-10-07 16:59
Qt的WebEngineView加载网页时出现Error:
WebGL
is not supported
1.背景当我在qml中使用WebEngineView加载一个网页时,出现以下错误:Error:
WebGL
isnotsupported2.解决方案其实这个问题在Qt的帮助文档中已经提及了解决办法:因此,可以按照下面的步骤操作一下
韭菜钟
·
2023-10-07 10:46
Qt相关
qt
webgl
开发语言
webgl
智慧楼宇发光效果算法系列之高斯模糊
如果使用过PS之类的图像处理软件,相信对于模糊滤镜不会陌生,图像处理软件提供了众多的模糊算法。高斯模糊是其中的一种。在我们的智慧楼宇的项目中,要求对楼宇实现楼宇发光的效果。比如如下图所示的简单楼宇效果:building.gif楼宇发光效果需要用的算法之一就是高斯模糊。高斯模糊简介高斯模糊算法是计算机图形学领域中一种使用广泛的技术,是一种图像空间效果,用于对图像进行模糊处理,创建原始图像的柔和模糊版
ITman彪叔
·
2023-10-07 04:23
3D孪生场景SDK:Viwer 孪生世界
NSDT编辑器简化了
WebGL
3D应用的开发,完全兼容Three.JS生态。同时为了满足用户自定义业务的需求,NSDT编辑器还封装了基于three.js的SDK,用户可以在自己的应用中嵌
ygtu2018
·
2023-10-07 04:23
3d
编辑器
数字孪生
three.js后处理
通常在电影制作中使用这种技术,但我们也可以在
WebGL
中使用。
seeooco
·
2023-10-06 22:43
three.js
javascript
图形渲染
用
WEBGL
来画封闭多边形,然后拉伸为3D模型
目前很多浏览器原生支持
WEBGL
,只要你的代码在浏览其中打开,不用服务器,就可以看到你画的模型了。目前我做了一个非常简单的画图工具,先画2D图形(结束画图按‘c'键),画好后直接拉伸成立体图形。
水滴与鱼
·
2023-10-06 10:20
webgl
javascript
[Review]To be coder(2011.08.01~2013.05.23-
WebGL
-ing)
其实编程是一件非常有意思的事情,像造物主可以创造万物一样,每一个程序员都可以创造一片属于自己的世界。这就是我喜欢编程的原因,很简单,自由。以下内容回记录汪海的编程生活,因为比较懒的原因,所以写的比较简单,其中坎坷曲折,一言难尽。再回头看以前写的代码,敲的程序,却也别有一番滋味。个人兴趣飘忽无常,所以有些都没有深入学习,以后有时间再慢慢补上吧。JAVA因为大一的课程安排,一开始接触的很多东西都是和J
iteye_19603
·
2023-10-05 21:10
c#
数据库
操作系统
【Unity】3D贪吃蛇游戏制作/
WebGL
本地测试及项目部署
本文是Unity3D贪吃蛇游戏从制作到部署的相关细节项目开源代码:https://github.com/zstar1003/3D_Snake试玩链接:http://xdxsb.top/Snake_Game_3D效果预览:试玩链接中的内容会和该效果图略有不同,后面会详细说明。游戏规则经典贪吃蛇游戏:蛇身随着吃食物的增加不断变长,通过A/D或方向键←→控制方向,蛇头撞在蛇身上或四周墙壁会导致游戏失败。
zstar-_
·
2023-10-05 21:38
Unity
unity
3d
游戏
Coding and Paper Letter(四十五)
gempy2.Tangram是一个JavaScript库,用于使用
WebGL
在Web浏览器中实时渲染2D和3D地图。tangram3.R语言包gdalcube
胖胖雕
·
2023-10-05 09:18
科研学术
Awesome
WebGL
-3D地图大俯仰角的雾化处理
以下内容转载自掘金文章《
WebGL
-3D地图大俯仰角的雾化处理》作者:多多洛爱学习链接:https://juejin.im/post/5db2a58a51882559ee62dfba来源:掘金著作权归作者所有
_bugMaker
·
2023-10-05 06:14
在2023年使用Unity2021从Built-in升级到Urp可行么
因为最近在做
WEbgl
平台,所以某些不可抗力原因,需要使用Unity2021开发,又由于不可明说原因,想用Urp,怎么办?
avi9111
·
2023-10-05 04:14
Unity
Unity2021
Urp
Unity升级
WebGL
基础学习
WebGL
工作原理step1:createvertexDatastep2:createbufferandloadvertexDatatobufferconstbuffer=gl.createBuffer
Coding_Life
·
2023-10-03 18:59
WebGPU 入门:绘制一个三角形
WebGPU的出现就是为了取代
WebGL
的,因为后者的API实在有些过时,无法利用好现代GP
前端西瓜哥
·
2023-10-03 12:48
状态模式
webgpu
基于Threejs实现glb三维模型的预览
言归正传,使用threejs进行三维模型展示,通常需要依赖以下组件:Threejs+OrbitControls+GLTFLoader+
WebGL
以上组件可以从threejs的官网获取,下载后的目录如下所示
夜郎king
·
2023-10-03 00:47
gis
中间件
js
three.js
html
三维可视化
WebGL
-学习笔记(三)
image.png在利用缓冲区并在学会利用mode绘制图形动画以后,继续研究二维图形的颜色渲染以及纹理操作1.颜色渲染1.1利用步进和偏移拆分缓冲区数据利用缓冲区可以一次存储点的多个信息,继续利用这一特性,并在利用vertexAttribPointer()函数的时候,利用上stride和offset两个参数:functionmain(){constcanvas=document.querySele
Patrick浩
·
2023-10-02 19:29
【笔记】
WebGL
编程指南学习(4)
WebGL
编程指南学习(4)4.最后一块拼图在学会处理顶点,包括处理顶点的坐标、Javascript和
WebGL
管线的数据通信、坐标变换之后,还需要处理顶点的其他数据——如颜色等。
界明城
·
2023-10-01 06:11
计算机图形学
拓扑学
图形渲染
javascript
算法
【笔记】《
WebGL
编程指南》学习(8)
WebGL
编程指南学习(8)漫长的旅行即将到达终点……8.高级技术8.1用鼠标控制物体旋转如何实现物体的旋转?如何旋转物体?
界明城
·
2023-10-01 06:11
计算机图形学
图形渲染
算法
几何学
虚拟现实
上一页
9
10
11
12
13
14
15
16
下一页
按字母分类:
A
B
C
D
E
F
G
H
I
J
K
L
M
N
O
P
Q
R
S
T
U
V
W
X
Y
Z
其他