2b勿扰
2b勿扰

JS 第三方工具封装经典案例（canvas动态绘图）

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>绘制矩形</title>
</head>

<body>
    <canvas id="myCanvas" width="500" height="400" style="border:1px solid red;">
        <p>您的系统不支持此程序!</p>
    </canvas>
    <div id="allStyleBox">
        <b>选形状：</b>
        <select id="pickShape" tag="shape">
            <option value="rect">画矩形</option>
            <option value="arc">画圆</option>
            <option value="line">画线</option>
            <option value="clear">橡皮擦</option>
        </select>

        <b>选颜色</b>
        <select id="pickColor" tag="color">
            <option value="red">红色</option>
            <option value="black">黑色</option>
        </select>
        <b>填充 还是 描边</b>
        <select id="pickStroke" tag="strokeFill">
            <option value="fill">填充</option>
            <option value="stroke">描边</option>
        </select>
        <b>线宽</b>
        <select id="pickLine" tag='line'>
            <option value="1">1</option>
            <option value="5">5</option>
            <option value="10">10</option>
        </select>
        <b>橡皮擦宽度</b>
        <select id="pickClear" tag='clearWidth'>
            <option value="5">5</option>
            <option value="10">10</option>
            <option value="15">15</option>
        </select>
    </div>
    <script>
        var canvas = document.getElementById('myCanvas');
        var ctx = canvas.getContext('2d');

        var drawShapeObj = {
            shape: pickShape.value,
            color: pickColor.value,
            line: pickLine.value,
            strokeFill: pickStroke.value,
            clearWidth: pickClear.value
        };
        var imageData = '';

        function dragImg(fn) {
            var moving = false; //标记是否在拖动
            var dis = {};
            canvas.onmousedown = function (e) {
                moving = true;
                dis = {
                    x: e.clientX,
                    y: e.clientY
                }
            }
            canvas.onmousemove = function (e) {
                if (!moving) {
                    return;
                }
                fn && fn.call(e, dis);
            }
            canvas.onmouseup = function (e) {
                moving = false;
                imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
                console.log(imageData);
            }
        }

        var shapeFun = {
            common: function () {
                ctx.clearRect(0, 0, canvas.width, canvas.height);
                //样式
                ctx.beginPath();
                ctx.lineWidth = drawShapeObj.line;
                ctx.strokeStyle = drawShapeObj.color;
                ctx.fillStyle = drawShapeObj.color;

                shapeFun.reDrawAll();
            },
            reDrawAll: function () {
                //绘制之前的形状
                imageData && ctx.putImageData(imageData, 0, 0);
            },
            rect: function (dis) {
                // console.log('rect');
                //画一个矩形 this -- event
                //思路一：只清除所绘制的那个区域
                // ctx.clearRect(dis.x,dis.y,this.clientX-dis.x,this.clientY-dis.y);  //清除所画区域
                shapeFun.common();
                ctx.rect(dis.x, dis.y, Math.abs(this.clientX - dis.x), Math.abs(this.clientY - dis.y)); //路径
                ctx[drawShapeObj.strokeFill]();
                ctx.closePath();
            },
            arc: function (dis) {
                shapeFun.common();
                var radius = Math.abs(this.clientX - dis.x);
                ctx.moveTo(dis.x + radius, dis.y);
                ctx.arc(dis.x, dis.y, radius, 0, 2 * Math.PI, true);
                ctx[drawShapeObj.strokeFill]();
                ctx.closePath();
            },
            line: function (dis) {
                shapeFun.common();
                ctx.moveTo(dis.x, dis.y);
                ctx.lineTo(this.clientX, this.clientY);
                ctx.stroke();
            },
            clear: function (dis) {
                console.log('clear');
                ctx.clearRect(this.clientX, this.clientY, drawShapeObj.clearWidth, drawShapeObj.clearWidth);
            }
        }
        dragImg(shapeFun[drawShapeObj.shape]);

        allStyleBox.addEventListener('change', function (ev) {
            var target = ev.target,
                tag = target.getAttribute('tag');
            drawShapeObj[tag] = target.value;
            dragImg(shapeFun[drawShapeObj.shape]);
        })
    </script>
</body>

</html>

你可能感兴趣的:(前端)

  • Promise的Finally方法 DTcode7 HTML网站开发#前端基础入门三大核心之JSHTMLJavaScript
    Promise的Finally方法基本概念与作用什么是`finally`方法？为什么使用`finally`方法？示例一：基础用法示例二：错误处理示例三：清理资源示例四：与`async/await`结合使用示例五：模拟Canvas操作使用技巧与最佳实践在前端开发中，我们经常遇到异步操作的需求。JavaScript提供了多种处理异步的方式，如回调函数、Promise和async/await等。其中，P
  • 文章上传漏洞绕过方式(以php语言为例) HMX404 web安全web安全漏洞
    一，文件上传漏洞原因由于网站要求，需要用户上传文件，图片，例如头像，保存简单文件上传下载，访问，如果我们将文件上传至web服务器上，并且可以访问到，那么就可以利用小马，对服务器进行操作，或者了解一些信息。因此在上传位置，代码会对上传文件进行检查，但不免会有漏洞，通过代码审计，可以得出网页漏洞。二，文件上传漏洞绕过方式前端验证绕过前端认证最容易绕过，我们将验证代码部份删除，或者将js函数返回值设为1
  • 个人网站搭建1-域名及虚机 一条西瓜皮
    前情提要由于本人的初衷不是做网站，只是想搭建后台，为前端提供服务，所以网站放在国外服务器上。国内服务器上搭建网站，需要备案，备案需要准备材料，大概耗费一个月时间。根据网上的资料，国外建站，只要不发布非法内容，被墙的概率极小。虽然概率小，但是为了不影响后期的服务，时间充裕后会考虑进行备案，将网站迁移至国内。毕竟天朝的网络响应速度比出去绕一圈要快得多。本文只涉及域名购买、云虚拟主机购买、域名解析等基础
  • 从面向对象(OOP)到面向切面(AOP)：编程范式的演变 妍思码匠 妍思码匠的前端乐园面向切面编程AOP前端代码复用模块化设计装饰器模式
    什么是AOP？AOP是一种编程范式，它允许你将那些横切应用程序多个部分的“例行公事”（称为“切面”）从核心业务逻辑中分离出来，以模块化的方式进行管理和重用。在前端开发中，AOP可以用于处理日志记录、性能监控、错误处理等。想象一下，你在一家餐厅工作，每次有顾客点餐时，你都需要记录订单，然后在厨房和顾客之间传递信息。这个过程包括了接收订单、记录、传递信息等多个步骤，每个步骤都可能需要执行一些“例行公事
  • JavaWeb——前端工程化 A_Tai2333333 JavaWeb前端
    一、前端工程化1.什么是前端工程化:前端工程化是使用软件工程的方法来单独解决前端的开发流程中模块化、组件化、规范化、自动化的问题，以提高效率和降低成本。2.前端工程化实现技术栈:ES6+Nodejs+npm+Vite+VUE3+Router+Pinia+Axios+Element-plusECMAScript6:VUE3中大量使用ES6语法;Nodejs:前端项目运行环境npm:依赖下载工具Vit
  • Vue搭建前端监控，采集用户行为的 N 种姿势 奋斗的工程师 前端vue.jsjavascript
    Vue搭建前端监控，采集用户行为的N种姿势最近我在3A平台购买了服务器。在一个产品中，用户最基本的行为就是切换页面。用户使用了哪些功能，也能从切换页面中体现出来。因此通用数据一般是在页面切换时产生，表示某个用户访问了某个页面。页面切换对应到前端就是路由切换，可以通过监听路由变化来拿到新页面的数据。Vue在全局路由守卫中监听路由变化，任意路由切换都能执行这里的回调函数。//Vue3路由写法const
  • BCrypt.checkpw()报错java.lang.IllegalArgumentException: Invalid salt 玩物丧志汪某人 Java异常参数传递前端开发后端交互明文密文数据库操作
    先看一下方法参数，放两个String第一个参数是明文（一般是前端传过来的值），第二个是密文（从数据库取出来的值），各位大聪明们是不是把参数放反了
  • 前端性能监控、异常监控的一些记录 一只小白菜~ 其他!前端异常监控性能监控
    文章目录常见异常类型常用的一些异常监控的方法window.errorwindow.addEventListener('error')window.addEventListener('load')window.addEventListener('DOMContentLoaded')window.performancenavigator.sendBeacon1*1像素gifaxios请求/响应拦截器V
  • 前端监控之白屏异常 github_35780652 前端监控JavaScript前端javascript监控类
    一、意义：  这里和测速的白屏不同，测速的白屏是指：导航页面开始到TTFB之间的时间称之为白屏时间。白屏异常是指：用户看到的一直是白屏，页面没有任何内容。比如渲染函数报错、Vue或React路由页面没有内容、网页加载很慢很慢以至规定的时间范围内一直没内容。  监控白屏异常能发现一些遗漏的bug并及时修复。二、捕获方法：  页面加载后2秒或进入页面后12秒（兼容一些特殊页面不会触发load事件）检查
  • Spring Boot + Mybatis + Shiro 后台权限管理系统 chuxia_vlog
    平台简介一直想做一款后台管理系统，看了很多优秀的开源项目但是发现没有合适的。于是利用空闲休息时间开始自己写了一套后台系统。如此有了若依。她可以用于所有的Web应用程序，如网站管理后台，网站会员中心，CMS，CRM，OA。所有前端后台代码封装过后十分精简易上手，出错概率低。同时支持移动客户端访问。系统会陆续更新一些实用功能。性别男，若依是给还没有出生女儿取的名字（寓意：你若不离不弃，我必生死相依）若
  • 前端速通面经八股系列(六）—— Vue(下) 真的很上进 前端面经八股合集前端javascript开发语言面试javavue.js前端框架
    接上ueueVue下篇四、路由1.Vue-Router的懒加载如何实现2.路由的hash和history模式的区别1.hash模式2.history模式3.两种模式对比3.如何获取页面的hash变化4.`$route和$router`的区别5.如何定义动态路由？如何获取传过来的动态参数？6.Vue-router路由钩子在生命周期的体现7.Vue-router跳转和location.href有什么区
  • uniapp开发中遇到的兼容性问题（待续） 呆呆papa uniapp开发ios
    1、日期格式问题使用uniapp开发过程中，有这么一段代码，将两个时间字符串通过JS的date构造函数，构造出两个日期并比较大小，在Android平台没有问题，在ios上就出现了日期比较失败，无法执行正常的校验。ios中不支持-作为日期之间的分隔符，需要使用/。使用replaceAll替换掉日期字符串中的-就好了。参考文献进阶之路-前端：ios对newDate()的兼容问题2、输入框click事件
  • 提交保存，要做重复请求拦截，避免出现重复保存的问题 niceLiuSir 幂等性
    **问题：**前端ajax提交数据的时候，当频繁点击的时候，或者两个账号以相同数据创建的时候，会出现问题。**处理办法：**前端拦截，防止重复提交数据，在上一次请求返回结果之后才允许提交第二次；后端和数据库也同意做拦截判断。**1.前端拦截：**结合layer.confirm可以屏蔽掉重复点击确认按钮产生重复请求的情况。//创建征地补差价协议functioncreateDisparityContr
  • 使用 Shell 脚本管理 RocketMQ 服务：启动、停止与状态检查 heromps rocketmq
    在分布式系统中，RocketMQ是一个流行的消息队列中间件。在开发和运维过程中，能够高效地启动、停止和检查RocketMQ相关服务的状态非常重要。本文将介绍如何使用Shell脚本来管理RocketMQ的NameServer、Broker和Dashboard服务，并提供相应的脚本示例和说明。安装可以查看这篇博客RocketMQ实战：在macOS上安装与前端访问全流程指南1.脚本概述这个脚本将涵盖以下
  • 马云谈未来暴利行业：高省APP，让你走在赚钱的最前端！ 高省APP
    随着科技的飞速发展，互联网经济的日益成熟，越来越多的人开始关注未来的赚钱行业。在众多行业中，电商导购平台因其独特的商业模式和广阔的市场前景，吸引了众多投资者的目光。其中，高省APP作为2021年推出的平台，以其0投资、0风险、高佣金的特点，成为了电商导购行业的一匹黑马。高省APP，是一个自用省钱佣金高，分享推广赚钱多的平台。运行三年以来，稳定可靠，吸引了百万终端用户。注册送2皇冠会员，送万元推广大
  • 2019-03-21 蜜思1013
    SPA:单页应用https://baike.baidu.com/item/SPA/175363131.场景（1）中后台管理系统（2）H5前端开发（3）跨端APP开发2.技术栈（1）SpringBootvue-cliIDEnpmElementUI（2）vue-cliSPA,npm,建议自己布局写样式（3）uni-app,Flutter,RN,cordova(调用底层API)3.IDE（1）WSVSc
  • Web前端 2301_78085386 前端
    网页开发学习内容:htmlcssJavaScript两个框架:VUE.jsElementUIUI->userinterface用户界面html(HyperTextMarkupLanguage):超文本标记语言文本:文字字符超文本:网页内容标记:标签标识例如商品上的标签,介绍了商品的信息html语言就是一种标记语言,提供许多的标签,不同的标签功能不同,网页就是通过这些标签描述出来的,最终通过浏览器解
  • Chapter 06 axios使用指南 Heaven645 vue.js前端Vueaxios
    欢迎大家订阅【Vue2+Vue3】入门到实践专栏，开启你的Vue学习之旅！文章目录前言一、导入二、发送GET请求三、发送POST请求四、处理响应前言在现代前端开发中，与后端API进行数据交互是至关重要的。Axios是一个基于Promise的HTTP客户端，用于浏览器和Node.js。本文详细介绍了Axios的基本用法。一、导入导入官网提供的axios在线地址：二、发送GET请求axios.get(
  • 前端播放RTSP视频流，使用FLV请求RTSP视频流播放（Vue项目，在Vue中使用插件flv.js请求RTSP视频流播放） 北城笑笑 JavaScriptVueJSjavascriptvue.js
    简述：在浏览器中请求RTSP视频流并进行播放时，直接使用原生的浏览器API是行不通的，因为它们不支持RTSP协议。为了解决这个问题，开发者通常会选择使用像flv.js这样的库，它专为在浏览器中播放FLV和其他流媒体格式设计。然而，flv.js本身并不直接支持RTSP，这意味着我们需要一个额外的步骤来桥接RTSP和flv.js。这里来记录一下详细介绍：在Vue中使用flv.js插件播放RTSP视频流
  • 前端vue播放m3u8、flv、mp4视频的方法_vue mp4(1) 2401_84437982 程序员前端vue.js音视频
    //this.db.src([//{//src:“https://e-sign.dms.t.cn-np.com/files/m3u8_file/c4b94118-3c8d-4410-9987-985c2b44c278/c4b94118-3c8d-4410-9987-985c2b44c278.m3u8”,//地址//type:“application/x-mpegURL”,//告诉videojs,这
  • 【渗透测试】利用hook技术破解前端JS加解密 - JS-Forward Hello_Brian 渗透测试安全Hook技术前端JS加解密渗透测试web安全
    前言在做渗透测试项目时，尤其是金融方面，经常会遇到前端JS加解密技术，看着一堆堆密密麻麻的密文，会给人一种无力感。Hook技术则会帮助我们无需获取加解密密钥的前提下，获取明文进行渗透测试环境准备JS-ForwardBurpsuiteFiddler网上公开的加解密逻辑漏洞的靶场源码某大佬搭建的公网测试环境（请礼貌使用）：http://39.98.108.20:8085/Hook-JS技术详解正常访问
  • 前端数据库——WebSQL和IndexedDB 凡凡的小web
    一、WebSQLWebSQL是前端的一个独立模块，是web存储方式的一种，我们调试的时候会经常看到，只是一般很少使用。并且，当前只有谷歌支持，ie和火狐均不支持。image我们对数据库的一般概念是后端才会跟数据库打交道，进行一些业务性的增删改查。而这里的数据库也不同于真正意义上的数据库。废话少说，先出招吧：主要方法：openDatabase：这个方法使用现有的数据库或者新建的数据库创建一个数据库对
  • WebGL入门（019）：WebGLSync 简介、使用方法、示例代码 还是大剑师兰特 #webGL开发教程webgl大剑师
    还是大剑师兰特：曾是美国某知名大学计算机专业研究生，现为航空航海领域高级前端工程师；CSDN知名博主，GIS领域优质创作者，深耕openlayers、leaflet、mapbox、cesium，canvas，webgl，echarts等技术开发，欢迎加底部微信（gis-dajianshi），一起交流。No.内容链接1Openlayers【入门教程】-【源代码+示例300+】2Leaflet【入门教
  • 【学习笔记】用Mac自学虚幻4 左上方的天空&roc 虚幻4学习笔记ue4macos
    文章目录前言学习过程总结前言首先，我是大学自学的前端，之后实习做的是前端是Webgl可视化工作，从实习到转正再到离职大概一年时间，辞职以后我考虑了目前比较火的UE引擎，于是重新学习了一遍C++和数据结构后，开始自学UE。由于本人手里只有一台MacBookAir，本次学习全程用Mac来运行。提示：建议学习UE的新人去学一遍C++，并且了解一下STL源码，以及底层的数据结构。一、安装UE4进入UE官网
  • nginx部署前端vue项目完整详细讲解 程序员小羊！ 运维前端nginxvue.js
    大家好，我是程序员小羊！前言：在使用Nginx部署前端Vue项目时，确保项目的生产环境版本已经打包，并且Nginx已经安装并配置在服务器上。以下是详细的步骤，包括打包Vue项目、配置Nginx、部署和测试项目。1.打包Vue项目首先，你需要将Vue项目编译为生产环境版本。可以通过VueCLI完成这一步。1.1安装依赖确保已经安装了Node.js和npm。然后在项目根目录下运行以下命令安装依赖：np
  • 基于SpringBoot的流浪猫狗救援网站 超级无敌暴龙战士塔塔开 Java课设与毕设资源java
    文章目录项目介绍主要功能截图：部分代码展示设计总结项目获取方式作者主页：超级无敌暴龙战士塔塔开简介：Java领域优质创作者、简历模板、学习资料、面试题库【关注我，都给你】文末获取源码联系项目介绍基于SpringBoot的流浪猫狗救援网站,java项目。eclipse和idea都能打开运行。推荐环境配置：eclipse/ideajdk1.8mavenmysql前端技术：vue，Ajax，Json后端
  • React-Router 安装及使用 书生丶
    安装[email protected]引入核心路由器组件import{BrowserRouter,HashRouter}from'react-router-dom'BrowserRouter:localhost:xxxx/user/liuna服务器可知所有请求细节HashRouter:localhost:xxxx/#/user/liuna使用#瞄点纯前端跳转,服务器不知
  • 是什么让尤大选择放弃Webpack？面向未来的前端构建工具 Vite 码民的飘柔 前端vue前端vue.jswebpack面试Vite
    写在开头前两天在知乎看到过一篇文章，大致意思是讲：字节跳动已经开始“弃用Webpack”，尝试在自研构建工具中使用类似Vite的ESmodule构建方式。引起下方一大片焦虑：Webpack是不是要被取代了？现在学Vite就行了吧Webpack还没学会，就又来新的了！甚至有人搬出了去年尤大所发的一个动态：再也回不去Webpack了。PS：最近的vite比较火，而且发布了2.0版本，vue的作者尤雨溪
  • 关于 Vue/React 的 cli 中运用 webpack 打包的原理简单解析 F-125 webpackvue.jsreact.jswebpack
    webpack、webpack-cli的打包关于webpack对前端工程中进行资源文件进行打包处理的过程中，运用到的核心插件主要是webpack和webpack-cli，在react和vue对于打包各自工程中的cli则是进行了自定义的构建，专门用于项目打包的cli。可简单的进行自定义运行webpack的编译运行文件。例如：通过webpack-cli运用webpack进行文件资源打包压缩处理，执行s
  • 2024React前端面试题 司宁 前端面试题前端
    1.Diff算法Diff算法比较过程第一步：patch函数中对新老节点进行比较如果新节点不存在就销毁老节点如果老节点不存在，直接创建新的节点当两个节点是相同节点的时候，进入patctVnode的过程，比较两个节点的内部第二步：patchVnode函数比较两个虚拟节点内部如果两个虚拟节点完全相同，返回当前vnode的children不是textNode，再分成三种情况-有新children，没有旧c
  • jQuery 跨域访问的三种方式 No 'Access-Control-Allow-Origin' header is present on the reque qiaolevip 每天进步一点点学习永无止境跨域众观千象
    XMLHttpRequest cannot load http://v.xxx.com. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:63342' is therefore not allowed access. test.html:1
  • mysql 分区查询优化 annan211 java分区优化mysql
    分区查询优化 引入分区可以给查询带来一定的优势，但同时也会引入一些bug. 分区最大的优点就是优化器可以根据分区函数来过滤掉一些分区，通过分区过滤可以让查询扫描更少的数据。 所以，对于访问分区表来说，很重要的一点是要在where 条件中带入分区，让优化器过滤掉无需访问的分区。 可以通过查看explain执行计划，是否携带 partitions
  • MYSQL存储过程中使用游标 chicony Mysql存储过程
    DELIMITER $$ DROP PROCEDURE IF EXISTS getUserInfo $$ CREATE PROCEDURE getUserInfo(in date_day datetime)-- -- 实例-- 存储过程名为：getUserInfo-- 参数为：date_day日期格式:2008-03-08--    BEGINdecla
  • mysql 和 sqlite 区别 Array_06 sqlite
    转载： http://www.cnblogs.com/ygm900/p/3460663.html mysql 和 sqlite 区别 SQLITE是单机数据库。功能简约，小型化，追求最大磁盘效率 MYSQL是完善的服务器数据库。功能全面，综合化，追求最大并发效率 MYSQL、Sybase、Oracle等这些都是试用于服务器数据量大功能多需要安装，例如网站访问量比较大的。而sq
  • pinyin4j使用 oloz pinyin4j
    首先需要pinyin4j的jar包支持；jar包已上传至附件内 方法一:把汉字转换为拼音；例如：编程转换后则为biancheng      /** * 将汉字转换为全拼 * @param src 你的需要转换的汉字 * @param isUPPERCASE 是否转换为大写的拼音； true:转换为大写；fal
  • 微博发送私信 随意而生 微博
    在前面文章中说了如和获取登陆时候所需要的cookie，现在只要拿到最后登陆所需要的cookie，然后抓包分析一下微博私信发送界面 http://weibo.com/message/history?uid=****&name=**** 可以发现其发送提交的Post请求和其中的数据， 让后用程序模拟发送POST请求中的数据，带着cookie发送到私信的接入口，就可以实现发私信的功能了。
  • jsp 香水浓 jsp
    JSP初始化     容器载入JSP文件后，它会在为请求提供任何服务前调用jspInit()方法。如果您需要执行自定义的JSP初始化任务，复写jspInit()方法就行了 JSP执行     这一阶段描述了JSP生命周期中一切与请求相关的交互行为，直到被销毁。     当JSP网页完成初始化后
  • 在 Windows 上安装 SVN Subversion 服务端 AdyZhang SVN
    在 Windows 上安装 SVN Subversion 服务端2009-09-16高宏伟哈尔滨市道里区通达街291号   最佳阅读效果请访问原地址：http://blog.donews.com/dukejoe/archive/2009/09/16/1560917.aspx   现在的Subversion已经足够稳定，而且已经进入了它的黄金时段。我们看到大量的项目都在使
  • android开发中如何使用 alertDialog从listView中删除数据？ aijuans android
    我现在使用listView展示了很多的配置信息，我现在想在点击其中一条的时候填出 alertDialog,点击确认后就删除该条数据，（ ArrayAdapter ，ArrayList，listView 全部删除），我知道在 下面的onItemLongClick 方法中 参数 arg2  是选中的序号，但是我不知道如何继续处理下去 1 2 3
  • jdk-6u26-linux-x64.bin 安装 baalwolf linux
    1.上传安装文件(jdk-6u26-linux-x64.bin) 2.修改权限 [root@localhost ~]# ls -l /usr/local/jdk-6u26-linux-x64.bin 3.执行安装文件 [root@localhost ~]# cd /usr/local [root@localhost local]# ./jdk-6u26-linux-x64.bin&nbs
  • MongoDB经典面试题集锦 BigBird2012 mongodb
    1.什么是NoSQL数据库？NoSQL和RDBMS有什么区别？在哪些情况下使用和不使用NoSQL数据库？ NoSQL是非关系型数据库，NoSQL = Not Only SQL。 关系型数据库采用的结构化的数据，NoSQL采用的是键值对的方式存储数据。 在处理非结构化/半结构化的大数据时；在水平方向上进行扩展时；随时应对动态增加的数据项时可以优先考虑使用NoSQL数据库。 在考虑数据库的成熟
  • JavaScript异步编程Promise模式的6个特性 bijian1013 JavaScriptPromise
            Promise是一个非常有价值的构造器，能够帮助你避免使用镶套匿名方法，而使用更具有可读性的方式组装异步代码。这里我们将介绍6个最简单的特性。         在我们开始正式介绍之前，我们想看看Javascript Promise的样子： var p = new Promise(function(r
  • [Zookeeper学习笔记之八]Zookeeper源代码分析之Zookeeper.ZKWatchManager bit1129 zookeeper
    ClientWatchManager接口 //接口的唯一方法materialize用于确定那些Watcher需要被通知 //确定Watcher需要三方面的因素1.事件状态 2.事件类型 3.znode的path public interface ClientWatchManager { /** * Return a set of watchers that should
  • 【Scala十五】Scala核心九：隐式转换之二 bit1129 scala
    隐式转换存在的必要性，   在Java Swing中，按钮点击事件的处理，转换为Scala的的写法如下：   val button = new JButton button.addActionListener( new ActionListener { def actionPerformed(event: ActionEvent) {
  • Android JSON数据的解析与封装小Demo ronin47
    转自：http://www.open-open.com/lib/view/open1420529336406.html package com.example.jsondemo; import org.json.JSONArray; import org.json.JSONException; import org.json.JSONObject;    impor
  • [设计]字体创意设计方法谈 brotherlamp UIui自学ui视频ui教程ui资料
      从古至今，文字在我们的生活中是必不可少的事物，我们不能想象没有文字的世界将会是怎样。在平面设计中，UI设计师在文字上所花的心思和功夫最多，因为文字能直观地表达UI设计师所的意念。在文字上的创造设计，直接反映出平面作品的主题。 如设计一幅戴尔笔记本电脑的广告海报，假设海报上没有出现“戴尔”两个文字，即使放上所有戴尔笔记本电脑的图片都不能让人们得知这些电脑是什么品牌。只要写上“戴尔笔
  • 单调队列-用一个长度为k的窗在整数数列上移动，求窗里面所包含的数的最大值 bylijinnan java算法面试题
    import java.util.LinkedList; /* 单调队列 滑动窗口 单调队列是这样的一个队列：队列里面的元素是有序的，是递增或者递减 题目：给定一个长度为N的整数数列a(i),i=0,1,...,N-1和窗长度k. 要求：f(i) = max{a(i-k+1),a(i-k+2),..., a(i)},i = 0,1,...,N-1 问题的另一种描述就
  • struts2处理一个form多个submit chiangfai struts2
    web应用中，为完成不同工作，一个jsp的form标签可能有多个submit。如下代码： <s:form action="submit" method="post" namespace="/my"> <s:textfield name="msg" label="叙述：">
  • shell查找上个月，陷阱及野路子 chenchao051 shell
    date -d "-1 month" +%F     以上这段代码，假如在2012/10/31执行，结果并不会出现你预计的9月份，而是会出现八月份，原因是10月份有31天，9月份30天，所以-1 month在10月份看来要减去31天，所以直接到了8月31日这天，这不靠谱。     野路子解决：假设当天日期大于15号
  • mysql导出数据中文乱码问题 daizj mysql中文乱码导数据
    解决mysql导入导出数据乱码问题方法： １、进入mysql，通过如下命令查看数据库编码方式： mysql>  show variables like 'character_set_%'; +--------------------------+----------------------------------------+ | Variable_name&nbs
  • SAE部署Smarty出现：Uncaught exception 'SmartyException' with message 'unable to write dcj3sjt126com PHPsmartysae
      对于SAE出现的问题：Uncaught exception 'SmartyException' with message 'unable to write file...。 官方给出了详细的FAQ：http://sae.sina.com.cn/?m=faqs&catId=11#show_213 解决方案为：   01 $path 
  • 《教父》系列台词 dcj3sjt126com
    Your love is also your weak point. 你的所爱同时也是你的弱点。   If anything in this life is certain, if history has taught us anything, it is that you can kill anyone.   不顾家的人永远不可能成为一个真正的男人。 &
  • mongodb安装与使用 dyy_gusi mongo
    一.MongoDB安装和启动,widndows和linux基本相同 1.下载数据库,     linux:mongodb-linux-x86_64-ubuntu1404-3.0.3.tgz 2.解压文件,并且放置到合适的位置     tar -vxf mongodb-linux-x86_64-ubun
  • Git排除目录 geeksun git
    在Git的版本控制中，可能有些文件是不需要加入控制的，那我们在提交代码时就需要忽略这些文件，下面讲讲应该怎么给Git配置一些忽略规则。   有三种方法可以忽略掉这些文件，这三种方法都能达到目的，只不过适用情景不一样。 1.  针对单一工程排除文件 这种方式会让这个工程的所有修改者在克隆代码的同时，也能克隆到过滤规则，而不用自己再写一份，这就能保证所有修改者应用的都是同一
  • Ubuntu 创建开机自启动脚本的方法 hongtoushizi ubuntu
    转载自： http://rongjih.blog.163.com/blog/static/33574461201111504843245/ Ubuntu 创建开机自启动脚本的步骤如下： 1) 将你的启动脚本复制到 /etc/init.d目录下 以下假设你的脚本文件名为 test。   2) 设置脚本文件的权限 $ sudo chmod 755
  • 第八章 流量复制/AB测试/协程 jinnianshilongnian nginxluacoroutine
    流量复制 在实际开发中经常涉及到项目的升级，而该升级不能简单的上线就完事了，需要验证该升级是否兼容老的上线，因此可能需要并行运行两个项目一段时间进行数据比对和校验，待没问题后再进行上线。这其实就需要进行流量复制，把流量复制到其他服务器上，一种方式是使用如tcpcopy引流；另外我们还可以使用nginx的HttpLuaModule模块中的ngx.location.capture_multi进行并发
  • 电商系统商品表设计 lkl
    DROP TABLE IF EXISTS `category`; -- 类目表 /*!40101 SET @saved_cs_client = @@character_set_client */; /*!40101 SET character_set_client = utf8 */; CREATE TABLE `category` ( `id` int(11) NOT NUL
  • 修改phpMyAdmin导入SQL文件的大小限制 pda158 sqlmysql
    　用phpMyAdmin导入mysql数据库时，我的10M的 数据库不能导入，提示mysql数据库最大只能导入2M。 　　 phpMyAdmin数据库导入出错： 　　You probably tried to upload too large file. Please refer to documentation for ways to workaround this limit.
  • Tomcat性能调优方案 Sobfist apachejvmtomcat应用服务器
    一、操作系统调优 对于操作系统优化来说，是尽可能的增大可使用的内存容量、提高CPU的频率，保证文件系统的读写速率等。经过压力测试验证，在并发连接很多的情况下，CPU的处理能力越强，系统运行速度越快。。 【适用场景】 任何项目。 二、Java虚拟机调优 应该选择SUN的JVM，在满足项目需要的前提下，尽量选用版本较高的JVM，一般来说高版本产品在速度和效率上比低版本会有改进。 J
  • SQLServer学习笔记 vipbooks 数据结构xml
    1、create database school 创建数据库school 2、drop database school 删除数据库school 3、use school 连接到school数据库，使其成为当前数据库 4、create table class(classID int primary key identity not null) 创建一个名为class的表，其有一
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他