js
关注
分享
扫一扫
文章平均质量分 71
合抱阴阳
大方、自信、直接、得体！从事让地球环境更美好工程！
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
前端实现websocket类封装
随着Web应用程序的发展，越来越多的人开始利用Websocket技术来构建实时应用程序。Websocket是一种在客户端和服务器之间建立持久连接的协议。这种协议可以在一个单独的连接上实现双向通信。与HTTP请求-响应模型不同，Websocket允许服务器自主地向客户端发送数据。这种实时连接的能力使得Websocket在许多应用场景中得到了广泛的应用。Websocket技术的优点之一是减少了网络延迟。在传统的HTTP请求-响应模型中，客户端必须不断地向服务器发送请求以获取更新的数据。原创 2023-12-27 15:49:32 · 2319 阅读 · 0 评论 -
Uncaught TypeError: ‘get‘ on proxy: property ‘modelViewMatrix‘ is a read-only and non-configurable d
3、configurable为false，就不能再将configurable改为true了；注意所有的add里面都加toRaw转化。three在vue3中报错解决方案。通scene添加对象处理方式解决；参照了网上的几个、无法解决问题。然而，这些依然不能实际解决；后来查阅是因为代理对象原因；,变量不可定义在vue2的。原创 2022-09-25 12:44:14 · 2951 阅读 · 0 评论 -
openlayers点线面测量、绘制设计实现
/ 获取存放feature的vectorlayer层。map初始化的时候可以添加好了。this.continuePolygonMsg = '继续点击绘制多边形';this.continueLineMsg = '继续点击绘制线';var helpMsg = '请点击开始绘制';通过创建draw对象注册事件，再注册交互到地图实现控件的交互。...原创 2022-08-09 14:08:14 · 866 阅读 · 0 评论 -
arcgis for js 4.x加载百度地图切片
一、加载方式通过'esri/layers/WebTileLayer'重写getTileUrl函数加载百度地图切片二、实现源码<html><head> <meta charset="utf-8" /> <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" /> <title>原创 2022-04-25 09:57:19 · 2465 阅读 · 4 评论 -
VUE+Cesium绘制迁徙图结合echarts实现
一、编写EchartsLayer类实现注入到window对象，实现类如下：import * as Cesium from 'cesium/Cesium'import * as echarts from 'echarts'!(function () { function EchartsLayer(viewer) { this._viewer = viewer; registerMap(this); createChart(this); resize(this);原创 2022-04-19 09:01:45 · 3042 阅读 · 2 评论 -
vue+cesium生成热力图
一、下载cesium-heatmap.js在Cesium中实现热力图需要cesium-heatmap.js,可以使用npm直接下载npm install cesium-heatmapJavaScript环境也可以在github直接下载https://github.com/danwild/CesiumHeatmap二、改造cesium-heatmap.js，改造后源码/* * CesiumHeatmap.js v0.1 | Cesium Heatmap Library *原创 2022-04-11 16:35:23 · 6288 阅读 · 0 评论 -
arcgis实现框架配置气泡弹框及风场
一、配置信息气泡弹出配置{ layerCode: 'dianwei', isRLayerPanel: true, url: '/static/geojson/point/station.json', dataPath: 'data/stationList/list', dataLongitudeField: 'longitude', dataLatitudeField: 'latitude', geoType: 'point', opacity: 0.8, fl原创 2022-04-01 13:29:38 · 854 阅读 · 1 评论 -
arcgis for js通过框架配置实现点线面及echarts绘制
一、图层配置export let LayersInfo = [ { title:'天地图普通', layerCode:'tdtvec', url:'https://{subDomain}.tianditu.gov.cn/vec_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=vec&STYLE=default&TILEMATRIXSET=w&FORMAT=tile原创 2022-03-29 17:02:34 · 1762 阅读 · 0 评论 -
vue3+cesium完整的实现及config配置
一、创建vue3项目官网参照Vue CLIhttps://cli.vuejs.org/zh/二、安装cesiumnpm i cesium --save本人做vue3是从vue2项目成果迁移升级直接拿的package.json命令npm i 安装{ "name": "cesiumvue3", "version": "0.1.0", "private": true, "scripts": { "serve": "vue-cli-service serve",原创 2022-03-22 13:47:23 · 3063 阅读 · 0 评论 -
vue+cesium实现风场
cesium实现风场原创 2022-03-15 14:32:26 · 12234 阅读 · 5 评论 -
地图图层控制控件设计实现
一、整体设计二、代码架构三、前端代码结构四、组件调用五、操作展示如果对您有帮助感谢支持技术分享，请扫码点赞支持：技术合作交流qq:2401315930...原创 2022-02-24 09:36:49 · 366 阅读 · 0 评论 -
arcgis for js实现三维地图架构
一、代码组织架构config：配置信息data：数据gisUtils：gis工具类layerInfo:图层信息配置layerMsg：图层事件配置map_operate:地图工具条renderSet：渲染设置symbols：符号库arcgis3d.js:解析类二、配置信息三、图层配置四、图层事件注册五、渲染设置六、符号库七、成果展示如果对您有帮助感谢支持技术分享，请扫码点赞支持：技术合作交流qq...原创 2022-02-22 09:33:21 · 943 阅读 · 0 评论 -
利用cesium架构配置线面功能
一、图层配置rline:{ entities:[], options:{ name:'线', isShow:true }, entityType:'line'},rpolygon:{ entities:[], options:{ name:'面', isShow:true }, entityType:'polygon'}二、符号配置rlineSymbol:{ type:'simple-line', color:[1原创 2022-02-16 16:19:29 · 1394 阅读 · 0 评论 -
利用cesium架构配置走航功能
一、图层配置roadWall:{ entities:[], options:{ name:'走航', isShow:true, isFlash:false }, entityType:'wall'}二、符号配置roadWallSymb0l1:{ type:'simple-fill', color:[0, 206, 0, 178.5]},roadWallSymb0l2:{ type:'simple-fill', color:[25原创 2022-02-15 13:12:56 · 1708 阅读 · 0 评论 -
cesium对模型进行光着色实现
一、cesium中光类型方向光和太阳光二、光的着色渲染代码实现三、实现效果太阳光不同着色效果方向光的着色如果对您有帮助感谢支持技术分享，请扫码点赞支持：技术合作交流qq:2401315930...原创 2022-02-09 09:06:26 · 2360 阅读 · 0 评论 -
java实现反距离权重插值算法生成geojson矢量数据
一、java代码package cn.cepec.talroad.air.common;import cn.cepec.talroad.air.common.geoutil.FeaureUtil;import cn.cepec.talroad.air.common.geoutil.GeoJSONUtil;import com.vividsolutions.jts.geom.Geometry;import net.sf.json.JSONObject;import org.geotools.原创 2022-01-30 09:16:00 · 4387 阅读 · 5 评论 -
arcgis for js实现迁徙图组件化封装
一、组件化代码/*** * echarts图层通用工具 * date:2022-01-28 * author：zdh * @type {EchartsLayerUtil} */import {EchartsLayer} from './EchartsLayer'let EchartsLayerUtil = (function () { function EchartsLayerUtil (arcgis2d) { this.arcgis2d=arcgis2d this原创 2022-01-28 13:47:21 · 1157 阅读 · 0 评论 -
arcgis for js实现风场
一、风场工具类封装二、风场调用三、风场展示效果如果对您有帮助感谢支持技术分享，请扫码点赞支持：技术合作交流qq:2401315930原创 2022-01-27 13:57:21 · 1823 阅读 · 2 评论 -
arcgis2d组件化开发建构搭建
组件化架构的目的是降低代码的复杂度，通过简单易懂的配置完成gis的可视化开发，最大限度的降低开发成本，实现高效定制和复用一、目录架构二、配置信息三、图层配置四、事件配置五、工具条六、渲染设置七、符号库八、引擎解析器九、不到200行的组件代码十、可视化成果展示如果对您有帮助感谢支持技术分享，请扫码点赞支持：技术合作交流qq:2401315930...原创 2022-01-27 13:40:42 · 418 阅读 · 2 评论 -
cesium在vue中进行架构设计与实现
一、代码架构二、图层配置说明cesium中entity没有图层的概念，本架构通过自定义entity类型分组实现图层分层entityType的类型：b3dm（倾斜摄影）、billboard（图标）、point（点）、rectangle（矩形区域可以加载图片）、ArcGisMapServerImagery（arcgis服务切片）、UrlTemplateImagery（xyz的地图切片）等三、符号配置1、图层符号2、标注符号四、渲染设置1、图层渲染分为简单符原创 2022-01-14 14:15:13 · 1838 阅读 · 0 评论 -
iClientOL实现前端gis开发架构
一、gis目录组件架构二、目录结构展开三、配置说明1、系统配置2、图层配置3、符号配置4、渲染设置5、图层事件配置四、可视化效果六、集成到系统及效果如果对您有帮忙，非常感谢您支持一下创造者的付出！感谢支持技术分享， 请扫码点赞支持：技术合作交流qq:2401315930...原创 2022-01-10 15:48:14 · 1025 阅读 · 0 评论 -
ThirdParty/zip.js在vue+cesium报错解决
error in ./node_modules/cesium/Source/ThirdParty/zip.jsModule parse failed: Unexpected token (6357:57)You may need an appropriate loader to handle this file type.|| function getWorker(options = {}) {| return new Worker(new URL(w...原创 2021-10-19 15:32:07 · 3368 阅读 · 10 评论 -
arcgis for js 使用自定义数据结合featurelayer实现聚合
第一步：先上代码！<html><head> <meta charset="utf-8" /> <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" /> <title>Point clustering - generate suggested configuration | S原创 2021-07-10 18:48:07 · 1565 阅读 · 2 评论 -
iclient for ol实现风险区识别
function regionIdentify(IdentifyLayerCode,IdentifiedLayerCode,FilterField,FilterValue,toIndex,len,callBack) { var geo=[]; var layerFeatures=JSON.parse(getGeojsonByLayerCode(IdentifiedLayerCode)).features; for(var i=0;i<layerFeatures.length;.原创 2021-03-30 09:07:43 · 188 阅读 · 0 评论 -
arcgis for js 绘制台风风圈
步骤说明：1、组织所需数据及相关算法编写；所需数据：中心点（经纬度），圆的起始角度，圆的半径算法编写：计算出半径外所有的点，然后组合成几何图形（风圈形状）直接上代码演示：<html><head> <meta charset="utf-8" /> <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-原创 2021-01-25 18:14:30 · 852 阅读 · 0 评论 -
arcgis制作渔网及渲染调用
一、准备区域和渔网数据图二、发布成gis服务三、编写实现代码测试<html><head> <meta charset="utf-8" /> <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" /> <!-- ArcGIS API for Jav原创 2021-01-05 09:36:50 · 1378 阅读 · 0 评论 -
cesium报TypeError: e.charCodeAt is not a function问题检查
经检查最终发现是标注label必须传string类型如下图：使用的过程中需要toString()一下感谢支持技术分享，请扫码点赞支持：技术合作交流qq:2401315930原创 2020-10-30 13:04:06 · 5117 阅读 · 0 评论 -
cesium实现绘制网格效果
示例效果：代码演示：//！ 网格位置// var modelMatrixWhereTo = Cesium.Transforms.eastNorthUpToFixedFrame(// Cesium.Cartesian3.fromDegrees(113.802689907, 35.373933211, 0.00000));//！ 网格容器var custom_2DMesh = [];var instances2DMesh = [];function Clear2DMes原创 2020-07-28 20:20:49 · 7326 阅读 · 22 评论 -
js实现结果集合并
代码实现：var getKeys = function(list){ var keys = []; if(!list || !Array.isArray(list)){ return keys; } for(var i= 0,len=list.length;i<len;i++){ var item = list[i]; var key = []; if('object'==typeof item){...原创 2020-07-23 09:19:15 · 930 阅读 · 0 评论 -
arcgis for js 实现双屏效果
源码：<!DOCTYPE html><html lang="en" xmlns:th="http://www.thymeleaf.org"><head> <meta charset="UTF-8"> <title>疑似违法地图双屏</title> <link rel="stylesheet" href="https://js.arcgis.com/4.13/esri/themes/light/ma...原创 2020-07-16 17:55:35 · 692 阅读 · 0 评论 -
封装t通用ajax调用回调函数
/** * 方法说明 * @method commonAjaxPostP1 * url 字符串 访问地址 请求访问的地址 asyc 布尔 是否异步 是否异步ajax请求requesttype （GET，POST） data 数据 请求参数数据 接口接收的参数 callback 函数 回调函数 接收返回数据处理的回调函数 * @return 无返回 */function commonAjaxGet(url,asyc,requesttype,data,callBack){ .原创 2020-07-16 16:25:54 · 304 阅读 · 0 评论 -
arcgis通用地图符号解析器编写
通用创建symbol符号 */function CommonCreateSymbol(data){ for(var i = 0; i < data.length; i++){ var SymbolInfo={ code:data[i]["code"], type:data[i]["type"] } if(data[i]["type"] == "simple-marker"){ .原创 2020-07-16 16:12:44 · 166 阅读 · 0 评论 -
洪水预报模型时空变元实现
一、命令运行模型：java -jar RunModel.jar zhumadian设置参数：python parameter_set.py G:/DCLW/SourceCode/heanp/Skby/SkbyModel/SkbyModel/model/zhumadian/data/params-zhumadian.csv conductivity=5e-8 layer_depth=0....原创 2019-02-13 14:36:42 · 793 阅读 · 0 评论 -
图表库：ECharts 、 BizCharts 和 G2使用体验
阿里正式开源的BizCharts图表库基于React技术栈，各个图表项皆采用了组件的形式，贴近React的使用特点。同时BizCharts基于G2进行封装，Bizcharts也继承了G2相关特性。公司目前统一使用的是ECharts图表库，下文将对3种图表库进行分析比对。BizCharts一、安装通过 npm/yarn 引入npm install bizcharts --save...原创 2019-01-18 17:04:24 · 1063 阅读 · 0 评论