正儿八经
一只成序源
一直努力学习的猿(源)
展开
-
vite 引入问题require问题解决办法
vite 引入原创 2022-06-07 14:31:51 · 4648 阅读 · 0 评论 -
大数据echarts折线图打标
大数据折线图人工打标,生成训练集。echarts手动打标工具。原创 2022-05-10 11:01:23 · 1580 阅读 · 0 评论 -
多重联级递归表单制作
一、项目背景需要一个提交表单,内容经常增减变动。于是设计一套后端提供配置, 前端自动生成的一个组件。前后端都比较方便,前端不需要频繁变动,后端也只需配置即可。联动需求:后续加上联动需求举例: xx 省 xxx市 xxx区联级数据,三个下拉,需要获取得到前一个值才能渲染后面的下拉框。二、思路初始设计一套,for循环完事了。后续需要联级,没办法只能想到递归,使用组件调用自己的方式。A组件中不断去调用A组件,将需要递归的一层传进去再次渲染三、问题遇到问题有几个1、数据绑定问原创 2022-04-19 17:33:41 · 301 阅读 · 0 评论 -
切换组件echarts宽高不正常,100%变成100px问题
解决echarts '%'失效问题原创 2021-12-30 16:28:02 · 2163 阅读 · 0 评论 -
echarts生成误差棒图
首先声明,这个图是从这个哥们这里弄来的。自己再加以修改的。以更加贴合我自己的代码需求echarts 自定义误差图_贵林之恋的博客-CSDN博客_echarts 误差棒<script>$(function() {// 基于准备好的dom,初始化echarts实例var myChart = echarts.init(document.getElementById('main'));// 指定图表的配置项和数据var categoryData = []; //X轴数据...原创 2021-12-29 16:49:04 · 1365 阅读 · 2 评论 -
Canvas和SVG性能对比
在dom元素不多的情况下建议使用SVG原创 2021-12-29 16:40:01 · 4231 阅读 · 9 评论 -
纯前端Echart+HTML静态网页下载,无网运行
下载包含Echart的静态HTML代码,在无网环境下使用原创 2021-09-13 15:15:48 · 1849 阅读 · 1 评论 -
前端大数据+echart 基础解决方案
一、大数据处理递归函数分多次获取数据,并且必须保证接口同步调用。const getStep = 50000;async recursionGET(start:number,end:number){ let readStart = start let readEnd = end if(readStart + this.getStep < readEnd){ await this.getSignals(readStart,r原创 2021-08-19 17:01:58 · 525 阅读 · 0 评论 -
echart+大数据处理一些设置(持续更新)
第一次接触大数据,用的echart。之前的echart都是画简单的饼图,数据量没那么大。这次的把大数据处理的一些办法,设置写一下。第一个接触的是折线图,先上一个配置<v-chart ref="detailChart" :option="detail" :manual-update="true" :autoresize="true" class="echarts-mini"原创 2021-08-10 16:46:54 · 1472 阅读 · 0 评论 -
前端学习日记19-7-24
今天在csdn上解决问题时候,看到两个自己也不懂的问题。1.localStorage、sessionStorage、Cookie的区别及用法。主要是localStorage,感觉很好用。还有个小例子,比如给新用户一个好看的弹框,或者只给第一次进入网页的用户一个小广告,嘿嘿~之后的在进入该网页又没有广告。可以使用localStorage存储数据,然后之后再验证是否是第一次进入。非常好用,以后一定...原创 2019-07-24 16:55:14 · 2999 阅读 · 0 评论 -
纯css变换图片颜色png
众所周知,只有svg格式图片能改变颜色,png是不能改变的。最近也遇到这种问题了。开始解决办法就是找设计师要么再切一张图要么就搞个SVG给我。但是这都是求人搞,有没有办法自己就把换肤搞定。这个时候就用到了一个css3的一个新属性filter:drop-shadow具体怎么使用不说了,直接上代码看效果.icon-box{ width: 16px; height: 18px; overflow: hidden; z-index: 1;}.red-img{ d原创 2021-03-09 16:32:48 · 243 阅读 · 0 评论 -
对象数组根据对象的某个值进行去重操作,求和相同对象的个数
需求不同时间断产生的数据不同,个数也不相同,我们需要统计一个时间段的个体,并统计这些个体出现的次数。数据如下:let data=[{name:"cxy",total:2,time:"2021-02-01"},{name:"cxy",total:3,time:"2021-02-02"},{name:"pp",total:2,time:"2021-02-01"},{name:"lhx",total:2,time:"2021-02-01"},{name:"lhx",total:2,time:"2021-0原创 2021-02-14 17:13:56 · 540 阅读 · 0 评论 -
Echart饼图添加轮播效果
Echart饼图轮播效果关键代码如下,传入饼图数据的长度,以及饼图echart对象即可完成饼图的轮播,代码如下:/** * * @param pieDataLength 饼图数据长度 * @param ec 饼图echart对象 * @param time 轮播时间 */export function pipeAnimation(pieDataLength: number, ec: any,time:number) { let timer = null; if (pieDat原创 2021-01-26 11:01:09 · 927 阅读 · 0 评论 -
HTML文件、图片、pdf上传预览
一、选择文件上传上传文件的关键在input标签,以及获取文件并发送<!--ng版本--><input hidden type="file" multiple="multiple" (change)="fileChange($event)" ><!--原生版本 用js监听change事件就好了--><input hidden type="file" multiple="multiple">使用hidden属性将input标签隐藏,这样便于我们原创 2020-07-08 14:57:52 · 1729 阅读 · 0 评论 -
跑马灯组件---基于angular6+
跑马灯,非常常用的功能,用于消息通知之类的。百度一搜都是使用<marquee>来完成。结果发现W3C上根本没有这个标签。原来是这个标签即将被删除。在前端不断革新的今天,怎么能用将废弃的标签呢。指不定哪天就没了,程序出了莫名的bug都不知道。所以我决定自己写一个跑马灯。单独的css3动画完全可以实现一个跑马灯效果,但是,css写死了,那怎么组件化,让人人都可以用呢。所以想到使用js控制。第一个想到的就是定时器。通过定时器+transform:translateX()去减少px的值。只需要将定时原创 2020-06-22 14:30:00 · 1239 阅读 · 2 评论 -
一个简单的带复选框的树形图
<body> <ul> <li class="li" > <label><input type="checkbox" checked="true" class="check-father" /><span id=""> adadadadsa </span></label> <ul class="child"> <li> .原创 2020-06-15 15:16:14 · 652 阅读 · 0 评论 -
最近工作的一点收获
一、解决ng切换路由不刷新页面问题。遇到这个问题,第一想到的就是vue的keep-alive,说实话还是vue香。ng默认都会缓存路由,这就导致路由切换不刷新。带来的问题就是,比如我看了第一篇文字,往下滚动了,返回主页面,再进入这篇文章结果还在滚动位置,数据也不会刷新。这明显有问题的。需求是需要刷新这个组件。解决办法:只需要每次进入的路由不一致就可以使得组件刷新。最简单的方法就是在路由后面加上newDate(),你永远无法踏入同一条河流。这样路由永远都不会相同。www.baidu.com?ref='原创 2020-05-28 16:10:33 · 147 阅读 · 0 评论 -
echart渐变折线图
效果图,以及代码。关键点在于渐变,后面代码中有注释说明。上下左右四个渐变方向,加上渐变的色彩偏移,既可以完成带渐变的折线图。需要与后端对接,只要改变X轴Y轴的数据,还有一些小的细节就可以了。比较简单实用。let option={ color:'#38d7b7', tooltip: { trigger: 'axis', ax...原创 2020-05-06 11:34:13 · 1318 阅读 · 0 评论 -
ng 集成 ngx-echarts
这个其实网上有很多教程,但是我还是看那些教程看了很久都没有看明白。ngx-echarts确实很好用哈。想复用一个div来渲染不同的数据。<div echarts class="echartsBox" [options]="chartOption1"></div>开始呢就这样绑定一个对象就搞定了,至于对象里面有什么,随便复制一个echart-demo就可以看到效...原创 2020-04-27 16:47:15 · 1111 阅读 · 0 评论 -
带进度条的Tree
问题来由工作上业务有个需求,树状图展示数据。这个好办,很多组件,插件都有数状图。比如Ant组件。但是想在tree的文字后面再做扩展却是很难。可以说基本办不到。类似于这种树状图。ant基本已经写死了。那么办法只能自己整了。自己手写的效果:上代码这个就不多说了,用li画就可以了,由于我这里规定好了只有三级目录,所以直接写死了。如果不确定有几级的话再想其他办法,用递归也可以的。<u...原创 2020-04-26 14:26:14 · 407 阅读 · 0 评论 -
自创提升流程开发效率小工具,只针对当前工作业务有效(2019-12-17)
最近在做一个流程项目,就比如企业里面一个人要申请个VPN啥的。流程不难,但是费力!最开始是这样的这个样子呢,看起来还挺顺眼的,有内味了。有多少新增多少。然后一键生成,多舒服啊。可是有一次我开发一个流程。他喵的这个流程字段主表加子表一共有上百个字段,我的妈呀,我要点一百多次的新增。不仅如此,还要复制200多遍。这样下来还不如自己复制得了。懒则生变。为了让他更智能。 ...原创 2019-12-17 18:29:38 · 287 阅读 · 0 评论 -
JavaScript语言精粹学习(一)
1.对js的注释建议使用 // 注释,不要使用/* */注释,后者在和正则表达式放一起的时候可能会出现语法错误2.undefined、NaN、Infinity 并不是JavaScript的保留字,应该被保留但是并没有被保留3.数字 JavaScript统一为64位浮点数 1e2=1*4.字符串是16位的字符集,创建即不可变5.JavaScript的所有假值:false、null、...原创 2019-08-12 21:04:12 · 99 阅读 · 0 评论