@datav-gi/datavgi-gl-js v0.0.57

Datav.GI 通用gis引擎

项目结构

src
├── GiViewer.js // gi渲染入口
├── Map.js // Map 入口
├── animation //动画管理
├── baseMaps
│   └── vogo //vogo基础底图
├── config  //配置项
├── cover // shader扩展
│   ├── antiShake.js
│   ├── colorPick.js
│   └── shaderCover.js
├── extension //扩展能力
│   └── mapboxStyle //mapbox style 解析
├── geo //地理坐标转换工具
├── geometries //通用几何体基类
│   └── StyleGeometry.js
├── glyph //字体管理
│   └── GlyphManager.js
├── imageSource //图标管理
│   └── ImageManager.js
├── index.js //项目入口
├── materials //通用材质
│   ├── AntiShakeMaterialWrapper.js
│   └── StyleMaterial.js
├── pick //拾取能力
│   ├── GpuPickRender.js
│   ├── Pick.js
│   └── PickMaterial.js
├── postRender //后期处理
│   ├── FogPass.js
│   ├── PostRenderer.js
│   └── PostScanRenderer.js
├── primitives //图元包
│   ├── LayerManager.js //图层管理
│   ├── Primitive.js //通用图元基础类
│   ├── fill //填充
│   │   ├── Fill.js
│   │   ├── Geometry.js
│   │   ├── Material.js
│   │   └── shaders
│   ├── line //线条
│   │   ├── Geometry.js
│   │   ├── Line.js
│   │   ├── Material.js
│   │   └── shaders
├── sources //数据源管理
│   ├── GeoJSON.js
│   ├── Geobuf.js
│   ├── Source.js
│   ├── SourceManager.js 
│   └── Vector.js
├── utils //工具库
└── worker //多线程管理
    ├── InvokingTask.js
    ├── WorkerScheduler.js
    ├── WorkerWrapper.js
    └── main.worker.js

克隆

git clone git@gitlab.alibaba-inc.com:yongju.hy/datav-gi-js.git

安装依赖包

cd data-gi-js
npm install 

启动

npm start

打包

npm run build

启动完成后访问地址： http://localhost:9100/webpack-dev-server/

初始化GI 地图

let map = new datavgi.Map("container",{
    center:[121.9449298760868,30.901014400230366],
    zoom:12.107163593052736,
    crs:"EPSG:3857",
    pitch:0,
    rotate:0
})

添加图层

map.addLayer({
    id:"area",
    type:"fill",
    style:{
        color:"red",
        opacity:1
    },
    source:{
        type:"geojson",
        data:{
            type:"FeatureCollection",
            features:[
                ...
            ]
        }
    }
})