做GIS梦的人

最近，越来越多的WebGIS平台使用WebGL进行开发，包括Leaflet、Openlayers、ArcGIS等，作为一个GIS人，连接WebGL太有必要了，一起来学习WebGL吧。目前支持 WebGL 的浏览器有：Firefox 4+, Google Chrome 9+, Opera 12+, Safari 5.1+ 和 Internet Explorer 11+。可以使用下面的代码检测...

这个代码的例子是从书籍上搬来的，不同的是，书籍提供的WebGL函数库代码是ES5的，我把函数库使用的代码用ES6的方法重写了。中间还使用了ES6的特性——静态方法和模版字符串。最后出现了想要的东西，特此纪念一下。export class RenderTool { static initShaders(gl, vshader, fshader){ var program...

基于上一篇博文WebGL与ES6：绘制简单点。在学习WebGL编程指南这本书时，发现书上有一个WebGL通过鼠标连续绘制点的代码，其中的屏幕坐标系转WebGL坐标系的方法，居然是错误的。自己动手改了一下，可以完整运行了。import "../css/index.css";import {RenderTool} from "./lib_webgl/cuon-utils-ES6";l...

在绘制WebGL材质时，中间材质到WebGL的转换弄错了，写了很长时间。由于书上的引入图片是ES5的方式，我使用WebPack在进行打包的时候总是不对，因此在ES6中如何引入图片供WebGL调用当作材质，浪费了一些时间。import "../css/index.css";import {RenderTool} from "./lib_webgl/cuon-utils-ES6";impor...

学习WebGL的朋友们，可能知道，绘制点的时候默认点是正方向的。想要绘制圆形的点需要修改一下片元着色器，将正方向的四个角的绘制的时候省略一些绘制单元。 #ifdef GL_ES #ifdef GL_FRAGMENT_PRECISION_HIGH precision highp float; #else precision mediump f...

WebGL一种着色器，是无法满足渲染需求的，需要使用不同的渲染器，这次测试了 一下渲染器的切换。切换渲染器的时候，上一个着色器的东西肯定是要清除的。gl.deleteShader(FSShader);//删除片元着色器gl.deleteShader(CSShader);//删除顶点着色器gl.deleteProgram(program);//删除着色器程序如果你使用了缓冲区，来进行绘...

       在网上看到有的地图框架说自己使用WebGL渲染可以绘制超过百万的点，觉得有点夸张，做WebGIS的应该都遇到过，不使用一些聚合控件或优化算法的话，地图加载超过1000多的点可能就会卡顿，移动端几百个可能就卡死了。正好最近在尝试WebGL地图框架的开发，正好写到点图层的绘制，于是就测试了一下WebGL的性能。部分代码如下：let graphicLayer=new Graphi...