前端
文章平均质量分 52
MYNAMEL
萌新
展开
-
cesium卷帘对比
该功能在cesium官网上有官网示例:https://sandcastle.cesium.com/?src=Imagery%20Layers%20Split.html记得把js和css的地址换成自己的<!DOCTYPE html><html lang="en"><head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /原创 2022-03-02 17:23:21 · 959 阅读 · 0 评论 -
cesium分屏对比
参考地址:https://blog.csdn.net/qq_29808089/article/details/108895254简单介绍一下:分屏对比和卷帘对比的区别(只是个人理解,不对请指正)分屏对比:创建了左右两个地球,有两个viewer,两个viewer会同步。卷帘对比:只有一个地球,一个viewer,只不过这个地球有两个地图。想看卷帘对比请在我的文章中寻找使用该段代码请将js和css换成自己的或者网上的<!DOCTYPE html><html lang="en"&原创 2022-03-02 17:13:10 · 1818 阅读 · 2 评论 -
html使用jq的ajax请求后台
下载一个jquery引用<script src="js/jQuery.js"></script>js中请求 let data = { num: 3 }function gaoDePOI() { $.ajax({ type:"get", cache: false, async: false, url: 'https://autumnfish.cn/api/joke/list原创 2022-03-01 11:31:55 · 637 阅读 · 0 评论 -
Nginx-rtmp、FFmpeg实现直播效果并在web页面播放
本文参考链接:https://blog.csdn.net/u011424614/article/details/113420000前情提示:本文使用的是windows10系统主要流程讲解1.本文选择的路线是 视频文件–>FFmpeg–>nginx–>web播放2.FFmpeg是一个强大的视频编辑软件,基本干视频,音频的多多少少都会用到这个软件。本文中FFmpeg的作用是将视频整成视频流的形式。3.nginx的作用主要是将FFmpeg的视频流进行发布,供web进行访问。4.原创 2022-02-25 11:31:34 · 4907 阅读 · 2 评论 -
写一个完整前后端分离项目二
该节主要内容:布置vue页面样式,设置路由,写一个上传下载功能目录前端页面和路由整一个好看的vue页面设置页面路由(就是页面跳转)效果图上传和下载前后端代码前端页面后台代码效果图前端页面和路由整一个好看的vue页面1.创建好相关文件夹和文件components下创建一个api文件夹,里面创建hw.jscomponents下创建一个vue文件夹,里面创建downloadFile.vue和uploadFile.vue2.访问Ant Design Vue官网选取页面样式,并将样式应用到Hell.原创 2022-01-14 10:45:23 · 362 阅读 · 0 评论 -
写一个完整前后端分离项目一
涉及技术内容:vue、SpringBoot、leaflet、Linux、MySQL只列出几个大头技术,其他技术如html、js、mybatis。。。。等就不一一说明了本期主要内容:环境搭建和跑通一个示例目录需要的工具前端环境后台项目搭建数据库(Linux)关于云服务器跑通前后端前端安装axios前端安装Ant Design Vue前端配置jQuery前台代码文件图前台代码helloworld.vue前台代码hw.js后台代码文件图后台代码AllController.java相关效果图需要的工.原创 2022-01-12 17:32:27 · 1670 阅读 · 0 评论 -
leaflet自定义地图(非地理地图)
地理地图:现实世界的地图啥叫非地理地图?真实世界不存在的地图一般我们的地图不都是以地球上的坐标啊,建筑啊来参考的嘛(经纬度)但是比如说吃鸡,cf这种地图就不在地球上,不能用地理地图来显示,这个时候,我们就要自定义一个地图,懂?非地理地图代码和相关背景图文件夹结构html代码<html><head> <link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.c.原创 2021-12-30 10:47:25 · 2051 阅读 · 1 评论 -
注册mapbox的token(令牌)
在此分享两个网址一个是leaflet网址,一个是mapbox网址leaflet:https://leafletjs.com/examples/crs-simple/crs-simple.htmlmapbox:https://account.mapbox.com/access-tokens/有些人可能会问我,你的页面怎么是中文的,我只能说,我用的是windows自带的Microsoft edge和谷歌浏览器,这两个浏览器都有页面翻译功能。下面演示如何从leaflet跳转到mapbox网站.原创 2021-12-30 10:17:34 · 11154 阅读 · 25 评论 -
leaflet(二维地图)入门小示例
官网:https://leafletjs.com/examples/crs-simple/crs-simple.html你可以根据官网上面的教学,一步一步搭建自己的入门小示例请在代码中输入你自己的token,在官网上注册一个就行了注册token是完全免费的文件夹结构index.js代码var map = L.map('map').setView([51.505, -0.09], 13);//添加图层var tiles = L.tileLayer('https://api.mapbox原创 2021-12-29 10:52:24 · 1077 阅读 · 0 评论 -
html原生做一个视频播放功能(小玩具)
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>菜鸟教程(runoob.com)</title> </head><body> <div> <button onclick="playandpause()">播放暂停</button> <button onclick原创 2021-09-07 16:57:25 · 208 阅读 · 0 评论 -
前端进行导出功能(下载)
前端进行导出功能(下载)对DOM对象进行操作对DOM对象进行操作 let link = document.createElement('a') link.style.display = 'none' link.href = window.URL.createObjectURL(new Blob([res], { type: '' })) link.setAttribute('download', "法外狂徒张三详解" + ".doc")原创 2021-07-09 11:04:25 · 117 阅读 · 0 评论 -
vue获取当前时间
new Date() 获取当前时间 function() { let aData = new Date(); console.log(aData) //Wed Aug 21 2019 10:00:58 GMT+0800 (中国标准时间) let dateValue = aData.getFullYear() + "-" + (aData.getMonth() + 1) + "-" + aData.getDate(); console.log(this.value)原创 2021-05-08 16:29:12 · 11833 阅读 · 0 评论 -
Vue使用axios
下载:npm install axios引入:import axios from 'axios'Vue.prototype.$axios = axios在.vue文件中使用:<template> <div class="hello"> <button @click="getData">获取数据</button> <p>{{content}}</p> <div v-for="joke i原创 2021-03-04 09:54:11 · 482 阅读 · 1 评论 -
vue学习(组件Component)
组件组件一:组件二:局部组件组件三:全局组件组件一:这样写,它们之间的关系你应该就懂了组件二:局部组件组件三:全局组件各位这步我失败了,我整不出来,谁要是会的,捞我一下...原创 2021-03-01 15:36:21 · 201 阅读 · 0 评论 -
vue学习(表单)
表单相关input(输入框), textarea(文本框)checkbox(单选框,复选框)radio(单选按钮)select(下拉列表)input(输入框), textarea(文本框)checkbox(单选框,复选框)radio(单选按钮)select(下拉列表)...原创 2021-02-26 15:44:31 · 151 阅读 · 0 评论 -
vue使用axios(第二篇)
@toc本文参考链接:https://blog.csdn.net/m0_43374604/article/details/110238016方式一:步骤1:安装axios移动到你vue项目的根目录,打开cmd,执行以下命令npm install axios步骤2:配置接口访问后台的地址在/config/index.js对proxyTable进行修改配置好该步以后,以后访问后台接口时,直接调用/api就行proxyTable: { '/api': { targe原创 2021-03-26 15:01:39 · 207 阅读 · 0 评论 -
vue学习(基础知识)
本文参考地址:https://www.runoob.com/vue2/vue-directory-structure.html文章多少会有点错误,欢迎指出。使用vue之前需要先安装nodejs。参考:https://blog.csdn.net/MYNAMEL/article/details/113988150安装环境和下载项目npm install -g vue-cli (安装脚手架)vue init webpack demo (下载成品的新项目,demo就是你的项目名)cd demo原创 2021-02-24 15:47:04 · 279 阅读 · 1 评论 -
vue父子组件传值的一些坑(深浅拷贝)
本文章转载:https://www.yht7.com/news/1164871.问题描述父组件传值给子组件,子组件改变传过来的值后,父组件的值也会跟着改变。这个问题比较冷门,平时如果对组件通信使用得比较简单,一般不会遇到。2.原因剖析核心:双向绑定父子组件传值的时候涉及双向绑定,当传值为 object 类型时,传值之后数据源会被改变。深拷贝与浅拷贝下文详细讲。3.解决方案我目前采用的解决办法是:传值的时候不要直接传数据源,而是通过拷贝或者定义新变量等方式传值。简单处理就 JSON.p原创 2021-08-19 08:59:38 · 1757 阅读 · 0 评论 -
Vue相关学习网址
官网:https://cn.vuejs.org/v2/guide/菜鸟驿站https://www.runoob.com/vue2/vue-tutorial.htmlElement(样式)https://element.eleme.cn/#/zh-CN/component/installationECharts(表格)https://echarts.apache.org/examples/zh/index.htmlW3Cschoolhttps://www.w3cschool.cn/vuejs原创 2021-03-04 10:37:57 · 1232 阅读 · 2 评论 -
Vue使用element-ui
下载:npm i element-ui -S引入:import ElementUI from 'element-ui'import 'element-ui/lib/theme-chalk/index.css'Vue.use(ElementUI);使用element-ui样式参考地址,直接复制进自己项目就能用。https://element.eleme.cn/#/zh-CN/component/menu...原创 2021-03-03 11:11:00 · 136 阅读 · 0 评论 -
vue使用正则校验
使用正则校验的三种方法:第一种:写在方法里面进行调用。适用于比较复杂的。可重复应用<!-- maxlength:限制输入字符串的长度 aaa:参数名 validator:后面跟的就是校验方法名 --><a-input maxlength="50" v-decorator="['aaa', { rules: [{ validator: handleConfirmMoney,message:'请检查输入格式' }] }]"/>校验方法:原创 2021-06-26 15:28:04 · 10408 阅读 · 0 评论 -
vue获取浏览器当前登录用户信息
获取该信息的代码let id = ''id = JSON.parse(window.localStorage.getItem('pro__Login_Userinfo')).value.id原创 2021-05-08 16:36:15 · 3387 阅读 · 0 评论 -
vsCode使用yarn和cnpm命令
步骤右击VSCode图标,选择以管理员身份运行;在终端中执行get-ExecutionPolicy,显示Restricted,表示状态是禁止的;这时执行set-ExecutionPolicy RemoteSigned;此时再执行get-ExecutionPolicy,显示RemoteSigned,则表示状态解禁,可以运行注意:我这是已经设置过了,就是给你们演示一下。所以我get-ExecutionPolicy显示的是RemoteSigned。参考链接:https://blog.csdn.n原创 2021-03-16 20:55:14 · 900 阅读 · 0 评论 -
vue学习(语法)
v-html指令,可以在页面中插入相应的页面代码并显示效果。v-bind指令,以下实例判断 use 的值,如果为 true 使用 class1 类的样式,否则不使用该类。参考以下地址:https://www.runoob.com/vue2/vue-template-syntax.html https://cn.vuejs.org/v2/guide/syntax.html )Vue.js 都提供了完全的 JavaScript 表达式支持。v-if指令,判断指令。这里, v-if 指令将原创 2021-02-26 14:03:43 · 223 阅读 · 0 评论 -
Vue使用echarts(表格工具)
官网地址:https://echarts.apache.org/zh/index.html下载:npm install echarts --save引用:import echarts from 'echarts'Vue.prototype.$echarts = echarts使用:该处直接参考官网写的:https://echarts.apache.org/zh/tutorial.html#5%20%E5%88%86%E9%92%9F%E4%B8%8A%E6%89%8B%20ECharts原创 2021-03-03 11:36:20 · 808 阅读 · 0 评论 -
MD5入门
加密方式种类:对称加密:简单例子理解,一个明文变量a经过密钥x处理,变成了b,然后b经过密钥x处理又变成a。就是说加密和解密的密钥是一样的,都是x。称之为对称加密非对称加密:公钥,所有人都可以拥有,对外公开。密钥,只有自己拥有,不公开。简单例子理解,明文变量a经过公钥x处理变成了非明文变量b,这时如果还用公钥x对非明文b进行处理得不到明文a,只有用密钥y对b进行处理才能得到a。对a进行密钥y处理变成b,b可以用公钥x解密变成a。这种属于单方向保密。因为解密和加密的密钥不一样,所以叫非对称加密。原创 2021-11-18 16:33:34 · 159 阅读 · 0 评论