m0_56026872的博客

最近这半年新到了一家公司，现在主要在做大屏可视化和小程序这块的业务，最近接到了一个大屏需求，需要用到热力图展示快递揽件的相关数据，一开始想着是用Echarts自带的热力图，去实现，但是领导说我们之前的地图全部是用高德地图去做的，因此被迫营业，开始去学习高德地图API，先把热力图的相关链接给大家安排上有关图层方法的介绍热力图的案例由于当时时间紧张，自己也就没有太去注意一些细节问题。

JavaScript词法结构：文本相关：JavaScript将换行符，回车符和回车/换行序列识别为终止符保留字：有些关键字（如let），因为要兼容旧程序不能完全保留。例如在类外部通过var声明的变量可以用let作为变量名，但在类内部使用const声明时不行。Unicode归一化可选的分号，在JavaScript语法中不像Java一样以分号作为语句结束的标志；如果语句以(，[，/，+或 - 开头就有可能被解释为值钱语句的一部分，因此我们在开发中要避免这种情况，但如果有用到，就要在这些语句前面都防御性

数据可视化----ECharts—地图（七）概述地图在我们日常的数据可视化分析中是很常见的一种展示手段，不仅美观而且很大气。尤其是在大屏展示中更是扮演着必不可缺的角色Echarts系列文章标题地址Echarts初体验传送门Echarts通用配置传送门柱状图传送门折线图传送门散点图传送门饼图传送门Echarts官网传送门注意事项一. 使用方式百度地图API（高德地图API）需要申请百度API矢量地图需要

数据可视化----ECharts—饼图（六）百度百科——饼图Echarts系列文章标题地址Echarts初体验传送门Echarts通用配置传送门柱状图传送门折线图传送门散点图传送门Echarts官网传送门饼图的基本实现实现步骤一. 搭建ECharts最基本的代码结构（这是实现任何一张图表都必须的第一步）引入js文件（这个js文件可以去官网下载下来）准备一个DOM容器初始化一个echarts对象设置配置项option上面

解决：npm ERR! code ELIFECYCLEnpm ERR! errno 1问题今天在自己学习react时候遇到了一个问题，就是在自己执行npm start运行项目时，产生了如下报错然后我自己稀里糊涂的弄了好几遍，瞎弄一通，只会产生更多的报错。最后在交流群里问了一下自己的师兄，师兄说可能是我无意间动了配置文件，也就是node_modules。解决办法：删掉项目中的node_modules文件夹和package-lock.json文件，网上有很多快速删掉node_modules的指令和方法

数据可视化----ECharts—散点图（五）百度百科上散点图的定义散点图是指在回归分析中，数据点在直角坐标系平面上的分布图，散点图表示因变量随自变量而变化的大致趋势，据此可以选择合适的函数对数据点进行拟合。散点图的特点用两组数据构成多个坐标点，考察坐标点的分布，判断两变量之间是否存在某种关联或总结坐标点的分布模式。散点图将序列显示为一组点。值由点在图表中的位置表示。类别由图表中的不同标记表示。散点图通常用于比较跨类别的聚合数据。案例说明我们本次实现一个小案例是我们用一组数据来证明身高和

引言：ECharts是一款基于JavaScript的数据可视化图表库，提供直观，生动，可交互，可个性化定制的数据可视化图表。ECharts最初由百度团队开源，并于2018年初捐赠给Apache基金会，成为ASF孵化级项目。每篇博客都会强调的事情，学习ECharts最直接、最有效的方式就是去看官网，官网上有你想要的一切，官网地址：https://echarts.apache.org/en/index.html当然了，在下不才，写了几篇拙文，若大家有兴趣的可以瞅一瞅，有帮助的话给个赞，款哥还是会很开心的

前面两篇博客我写了有关Echarts的一些基础和通用配置项，博客地址在下数据可视化----ECharts初体验（一）数据可视化----ECharts通用配置（二）柱状图柱状图一、搭建基础结构二、配置配置项1. 坐标x轴 xAxis2. 坐标y轴 yAxis3. series （我这里叫它系列）其他操作（这些都是在series里进行配置的）最大值，最小值平均值显示数值柱子宽度柱状图一、搭建基础结构步骤1：引入echarts.js文件<script src="echarts.js文

文不如表，表不如图。上一次，介绍了ECharts的相关概念以及使用步骤，请见数据可视化----ECharts初体验（一）还有一句，就是最好的文档在官网，看谁的博客，都不如去熟读官网，访问官网的方式点击这里点点点官网地址：https://echarts.apache.org/zh/index.html，复制到浏览器打开直接百度，echarts这一次，让我们一起来学习一下，ECharts通用配置ECharts通用配置一 title(标题)text (标题文本)textStyle(文本样式)co

今天在使用给i他上传项目时，遇到了一些报错，下面做下记录：一. not a git repository (or any of the parent directories): .git翻译：不是git仓库(或任何父目录):.git解决办法：如果是第一次创建，就输入git init 指令，见表格该文件夹初始化为一个本地仓库如果不是第一次创建（一般指我们已经克隆了一个仓库），这时候坑是因为我们没有进入到仓库文件夹，只需进入到仓库文件夹即可我的问题就是第二点，没有进入到仓库对应的文件夹，这时候在

引言：当我们做一个后台管理系统时，总有一大堆数据要进行处理，这个时候数据的可视化操作，就显得非常重要，今天让我们一起去学习下ECharts的应用吧。正所谓文不如表，表不如图，把数据用图表的形式展示出来，就是简单的数据可视化。有关数据可视化主要有三种方式：1.报表类 2.商业智能BI 3.编码类我们主要是来学习第三种编码类中的Echarts，官网地址：https://echarts.apache.org/zh/index.htmlECharts 定义：ECharts 是一个使用 JavaS

项目场景：我在移动端使用了swiper插件来做轮播图效果，ui设计稿上的分页器是分式形式的，但是swiper默认的分页器是一个圆点，我需要修改这个样式，如下图：问题描述：我按照官方文档上所说，分页器样式类型，可选‘bullets’ 圆点（默认）‘fraction’ 分式‘progress’ 进度条‘custom’ 自定义写下了这段代码data () { return { swiperOptions: { pagination: {

vue 移动端 click事件失效问题今天在写项目时遇到了一个狗血又令人头痛的问题，我的点击事件突然之间就不顶用了，但是因为我写的是移动端的项目，我把浏览器运行环境切换到pc端去做了一下尝试，发现这奇葩的点击时间又可以了，怎么搞，搞个锤子，一通百度猛如虎，心情如下经过半个小时的垂死挣扎，我突然间想起来自己使用了一个滚动插件better-scroll，会不会是他的问题呢，去看看官方文档怎么说吧，发现了这个问题问题找到了，那就上代码，哦了this.scroll = new BetterScroll(t

Vue中$emit()方法的应用首先，对于$emit()方法的相关定义，大家请看emit( eventName, […args] )父组件可以通过自定义属性给子组件传值，子组件通过props属性监听父元素传过来的数据子组件可以使用$emit调用父组件的方法并传递数据**ps：**这里我感觉应当是重要的事情说三遍！三遍！！三遍！！！我看了很多人的博客，第一条大家都是写父组件可以使用 props 把数据传给子组件 ，我感觉这句话有失偏颇1.父组件向子组件传值有关props：props只能是

移动端1像素边框的问题-----如果我们的手机屏幕分辨率比较高，是一个二倍屏或者三倍屏，如果我们在页面上去写border-bottom: 1px; 这个时候我们写的是1px，但实际上它是css像素，并非物理像素，我们仔细观察的话，在二倍屏或者三倍屏上它实际上不是1个物理像素，而是两个物理像素或者三个像素的高度，为了解决多倍屏里面1像素边框会被显示成多像素边框的问题，需要引入一个解决方案，这个方案是一个css文件下面是这个css文件的源码@charset "utf-8";.border,.borde

Vue版本省、市、区三级联动对于初次学习前端Javascript的小伙伴来说，三级联动是一个比较复杂的逻辑，有关原生JS是如何实现三级联动的呢，大家可以去看一下我之前写的一篇博客 js原生代码实现三级联动那么我们使用Vue框架要如何实现三级联动呢？关于用Vue来实现三级联动效果，这里其实并没有太大的区别，逻辑都是一样的，难点也仍是在取数据上，我们如何能准确的获取到相应的省、市、区才是问题的关键，具体的DOM元素渲染倒不是什么难题。在写项目之前我们需要引进一下vue文件和数据文件，下面是我的v

解构赋值<一>解构赋值是一个JavaScript表达式这使得可以将值从数组，或者属性从对象提取到不同的变量中。 ----MDN<二>下面是菜鸟教程上的解释解构赋值是对赋值运算符的扩展。他是一种针对数组或者对象进行模式匹配，然后对其中的变量进行赋值。在代码书写上简洁且易读，语义更加清晰明了；也方便了复杂对象中数据字段获取。下面是整理的一些数组的解构赋值相关内容1. 简单的解构赋值语法const[ ]

加载性能：（1）css压缩：当项目完成之时，将写好的css进行打包压缩，可以减小文件体积，提高页面加载速度（js文件同理）。（2）css单一样式：当需要给一些集成属性设置某一样式时，单独设置会节省一部分性能，例如：margin，padding，只需要设置上、右时，单独设置margin-top，margin-right要比margin:top right 0 0;节省性能。（3）在引入外部css样式文件时，减少使用@import，建议使用link，因为后者在页面加载时一起加载，前者是等待页面加载完成之

今天在自己学习回顾node.js连接数据库并将所获取的数据返回给前端界面时，遇到了一个报错Failed to lookup view “list” in views directory，具体报错信息如下图：出错不可怕，让我们来排查一下，来吧，上代码两种修改方式1.我们可以修改view文件下的ejs文件名，使其与代码中render中的第一个参数相同2.我们可以修改代码中render中的第一个参数，使其与view文件下的ejs文件名相同总之，就是让代码中render中的第一个参数与view文件

一、使用自定义函数for (i = 1; i <= 10; i++) { (function (i) { var btn = document.createElement("button"); btn.innerText = i; btn.onclick = function () { alert(i); } document.body.appendChild(btn); })(i

试判断下面各个小题的输出结果答案以及解释大家可以去看看我下面的一篇博客博客地址：let和var的区别面试题答案第一题：console.log(dog); var dog = "小狗"console.log(cat); let cat = "小猫"第二题：第1组var dad = '我是爸爸！'console.log(dad); var dad = '我才是爸爸！'console.log(dad); 第2组let son = '我是儿子！'console.log(

各会输出什么结果，解释下原因第一题：console.log(dog); var dog = "小狗"console.log(cat); let cat = "小猫"第二题：第1组var dad = '我是爸爸！'console.log(dad);var dad = '我才是爸爸！'console.log(dad);第2组let son = '我是儿子！'console.log(son);let son = '我才是儿子！'console.log(son);第三

canvas标签介绍：菜鸟教程 https://www.runoob.com/html/html5-canvas.html<!-- * @Author: bkk * @weixin: biankuan1996 * @email: 15239111596@163.com * @Date: 2021-06-03 21:25:13 * @LastEditTime: 2021-06-03 22:30:59--><!DOCTYPE html><html lang="en

一、文本图片实现水平垂直居中给文本以及图片所在的标签设置text-align：center，实现水平居中，然后在设置line-height属性与height一致实现垂直居中<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0

W3C给的官方定义iframe 元素会创建包含另外一个文档的内联框架（即行内框架）。W3C属性列表前两天写项目时，遇到一个特别狗血的要求，就是在一个网页内部给出一个展示框，用来展示另外一个网页下面是一个小demo这里是具体代码块<!-- * @Description: 微信 biankuan1996 * @version: 1.0 * @Company: 云墨 * @Author: biankuan * @Date: 2021-05-26 16:43:22 * @Last

##分享一些自己遇到的问题A和B拥有共同的父元素，B默认不显示，当鼠标划过A时B显示B{display:none;}father:hover B{display:block;}background属性常用写法background-repeat和background-position可以针对多个背景图片分别设置，中间用逗号隔开，具体代码和效果图如下图使用position属性注意事项子元素设置margin-top对父元素产生影响时的解决办法img自带外边距解决方式...