摘要:
效果图: 1、结构布局 <div id="graphQuantityStatistics"></div> 2、配置图表 data () { return { option:{ legend: [ { left: 0, bottom: -5, width: 80, orient: "vertical" 阅读全文
摘要:
1、效果图 2、具体需求描述 ①可以设置时间轴起始值; ②时间轴可以缩放、左右拖动; ③鼠标移入时间轴显示当前刻度信息; ④点击时间轴时添加蓝色图标,鼠标移入图标显示此时图标信息且隐藏刻度信息,按住图标可以拖动图标; 3、实现 ①结构代码 <div id="timeAxisEchart" style 阅读全文
摘要:
1、效果图 2、具体功能描述 ①选择的时间为时间轴的开始和结束时间; ②鼠标可以左右拖动x轴时间轴; ③鼠标放入图表中可以缩放数据,x轴会相应的更改当前坐标轴间隔值,最小间隔值为1分钟,最大间隔值为1年,且在缩放时可以获取到数据窗口范围的起始数值; ④点击y轴名称会对相应数据显示隐藏。 3、实现 ① 阅读全文
摘要:
该内容包括antv-g6官网地址、antv-g6的基本使用(包括自定义节点、常用插件(右键菜单等)、基本事件、目前我所遇到的一些需求)。 1、antv-g6的官网地址:https://g6.antv.antgroup.com/examples 2、安装antv-g6组件 npm install @a 阅读全文
摘要:
vue项目中嵌入cesium地球,个别浏览器(例:360安全浏览器)访问时地球会无法加载,页面提示错误信息: 该浏览器不支持webgl,webgl是一种3D绘图协议,可以为HTML5 Canvas提供硬件3D加速渲染,这样就可以借助系统显卡来在浏览器里更流畅地展示3D场景和模型了,还能创建复杂的导航 阅读全文
摘要:
1、实现效果 2、结构代码(给table添加classname) 3、通过设置css实现合并同一个children的单元格 .nonRelationalDatabase{ // 去除横向边框 ::v-deep .el-table__row { td { border-bottom: none !im 阅读全文
摘要:
1、初始化蓝星 首先要实现这个功能,一定要开启时间轴 timeline: true, //是否显示时间线控件 Cesium.Ion.defaultAccessToken =‘your token’;//可不写 -- 后面有解释 this.viewer = new Cesium.Viewer('ces 阅读全文
摘要:
1、主要实现目标:计算所有落图的并集与目标位置的交集面积占目标位置总面积的百分比。 2、主要实现过程:计算所有落图的并集以及目标位置的交集需借助npm包martinez-polygon-clipping。 ①npm安装martinez-polygon-clipping:npm install mar 阅读全文
摘要:
实现方式:开始文字设置为空 ,然后通过添加定时器截取content字符串来实现。 效果展示如下: 具体实现如下: <template> <div> <div v-html=“showText ”></div> </div></template><script>export default { dat 阅读全文
摘要:
1、不适用改变显示器分辨率只适用改变缩放布局 2、创建rem.js文件 import Vue from 'vue' function handleScreen() { const m = detectZoom(); document.body.style.zoom = 100 / Number(m) 阅读全文