windows命令行的内容怎么复制,
右键选择标记,选中内容后再点击鼠标右键就复制了。
安装Node.js后再用npm install命令会出现如下warn:
saveError ENOENT: no such file or directory, open 'C:\Users\MBENBEN\package.json'
enoent ENOENT: no such file or directory, open 'C:\Users\MBENBEN\packagage.json'
解决方法是
在命令行切换到安装nodejs文件下的nodejs\node_modules\npm 后执行npm install
windows命令行跳转到指定文件夹下 cd 命令。例如:
cd D:\nodejs\node_modules\npm就会跳转到这个文件下了,然后就看可以执行npm了
SVG数据可视化(Scalable Vector Graphics可缩放矢量图形)
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" version="1.1"
xmlns="http://www.w3.org/2000/svg">
<ellipse cx="300" cy="150" rx="200" ry="80"
style="fill:rgb(200,100,50);
stroke:rgb(0,0,100);stroke-width:2"/>
</svg>
保存为后缀名为svg的文件,html文件引用时:
使用 <iframe> 标签
<iframe> 标签可工作在大部分的浏览器中。
语法:
<iframe src="rect.svg" width="300" height="100">
</iframe>
SVG画图
矩形 <rect>
圆形 <circle>
椭圆 <ellipse>
线 <line>
折线 <polyline>
多边形 <polygon>
路径 <path>
下面的命令可用于路径数据:
M = moveto
L = lineto
H = horizontal lineto
V = vertical lineto
C = curveto
S = smooth curveto
Q = quadratic Belzier curve
T = smooth quadratic Belzier curveto
A = elliptical Arc
Z = closepath
SVG 滤镜
在 SVG 中,可用的滤镜有:
feBlend
feColorMatrix
feComponentTransfer
feComposite
feConvolveMatrix
feDiffuseLighting
feDisplacementMap
feFlood
feGaussianBlur
feImage
feMerge
feMorphology
feOffset
feSpecularLighting
feTile
feTurbulence
feDistantLight
fePointLight
feSpotLight
例子:
<defs>
<filter id="Gaussian_Blur">
<feGaussianBlur in="SourceGraphic" stdDeviation="3" />
</filter>
</defs>
<ellipse cx="200" cy="150" rx="70" ry="40"
style="fill:#ff0000;stroke:#000000;
stroke-width:2;filter:url(#Gaussian_Blur)"/>
滤镜声明在style里面。filter属性通过id引用合适的滤镜。
SVG渐变
<linearGradient>线性渐变
<defs>
<linearGradient id="orange_red" x1="0%" y1="0%" x2="100%" y2="0%">
<stop offset="0%" style="stop-color:rgb(255,255,0);
stop-opacity:1"/>
<stop offset="100%" style="stop-color:rgb(255,0,0);
stop-opacity:1"/>
</linearGradient>
</defs>
<ellipse cx="200" cy="190" rx="85" ry="55"
tyle="fill:url(#orange_red)"/>
s当 y1 和 y2 相等,而 x1 和 x2 不同时,可创建水平渐变
当 x1 和 x2 相等,而 y1 和 y2 不同时,可创建垂直渐变
当 x1 和 x2 不同,且 y1 和 y2 不同时,可创建角形渐变
<radialGradient>放射性渐变
<defs>
<radialGradient id="grey_blue" cx="50%" cy="50%" r="50%"
fx="50%" fy="50%">
<stop offset="0%" style="stop-color:rgb(200,200,200);
stop-opacity:0"/>
<stop offset="100%" style="stop-color:rgb(0,0,255);
stop-opacity:1"/>
</radialGradient>
</defs>
<ellipse cx="230" cy="200" rx="110" ry="100"
style="fill:url(#grey_blue)"/>
<radialGradient> 标签的 id 属性可为渐变定义一个唯一的名称,
fill:url(#grey_blue) 属性把 ellipse 元素链接到此渐变,
cx、cy 和 r 属性定义外圈,而 fx 和 fy 定义内圈 渐变的颜色范围可由两种或多种颜色组成。
每种颜色通过一个 <stop> 标签来规定。offset 属性用来定义渐变的开始和结束位置。
<g>标签可以包裹其他标签成一个块。然后可以操作整体。
<g stroke="green" fill="white" stroke-width="5">
<circle cx="25" cy="25" r="15" />
<circle cx="40" cy="25" r="15" />
<circle cx="55" cy="25" r="15" />
<circle cx="70" cy="25" r="15" />
</g>
transform属性可以改变元素的位置,旋转角度,放大缩小,颜色变化等等
求JS数组的最大最小值:
使用Math.max和Math.min方法
var a=[1,2,3,5];
alert(Math.max.apply(null, a));//最大值
alert(Math.min.apply(null, a));//最小值
多维数组可以这么修改:
var a=[1,2,3,[5,6],[1,4,8]];
var ta=a.join(",").split(",");//转化为一维数组
alert(Math.max.apply(null,ta));//最大值
alert(Math.min.apply(null,ta));//最小值
使用ES6的扩展运算符
var arr = [22,13,6,55,30];
console.log(arr.Math(...arr)); // 55
排序法
先把数组从小到大排序,数组第一个即为最小值,最后一个即为最大值
ary.sort(function(a,b){return a-b;});
var minN = ary[0];
var maxN = ary[ary.length-1];
用JavaScript创建SVG元素
//通过createElementNS创建svg元素并设置属性
var svg=document.createElementNS('http://www.w3.org/2000/svg','svg');
svg.setAttribute("style","width:100%;height:100%;");
// 宽高可以自定义
svg.setAttribute("viewBox","0 0 100 100");
//创建矩形元素并设置属性
var rect=document.createElementNS('http://www.w3.org/2000/svg','rect');
rect.setAttribute("x","10");
rect.setAttribute("y","10");
rect.setAttribute("width","20");
rect.setAttribute("height","20");
rect.setAttribute("style","fill:#ff6666;stroke-width:1;stroke:rgb(255,0,0)");
document.createElementNS(namespaceURI, qualifiedName[, options]);
namespaceURI
指定与元素相关联的命名空间URI的字符串。
创建的元素的namespaceURI属性使用namespaceURI的值进行初始化。
参见有效的命名空间URL。
qualifiedName
指定要创建的元素的类型的字符串。
创建的元素的nodeName属性使用qualifiedName的值进行初始化。
options可选的
一个可选的包含单个属性的ElementCreationOptions对象,
其值是预先使用customElements.define()定义的自定义元素的标签名称。
为了向后兼容自定义元素规范的早期版本,一些浏览器允许您在此使用字符串替代对象,
其中字符串的值是自定义元素的标签名称。
有效的命名空间URI
HTML - 参阅 http://www.w3.org/1999/xhtml
SVG - 参阅 http://www.w3.org/2000/svg
XBL - 参阅 http://www.mozilla.org/xbl
XUL - 参阅 http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul
Canvas画图
fillRect(x, y, width, height)
绘制一个填充的矩形
strokeRect(x, y, width, height)
绘制一个矩形的边框
clearRect(x, y, width, height)
清除指定矩形区域,让清除部分完全透明。
上面提供的方法之中每一个都包含了相同的参数。
x与y指定了在canvas画布上所绘制的矩形的左上角(相对于原点)的坐标。
width和height设置矩形的尺寸。
路径
首先,你需要创建路径起始点。
然后你使用画图命令去画出路径。
之后你把路径封闭。
一旦路径生成,你就能通过描边或填充路径区域来渲染图形。
以下是所要用到的函数:
beginPath()
新建一条路径,生成之后,图形绘制命令被指向到路径上生成路径。
closePath()
闭合路径之后图形绘制命令又重新指向到上下文中。
stroke()
通过线条来绘制图形轮廓。
fill()
通过填充路径的内容区域生成实心的图形。
moveTo(x, y)
将笔触移动到指定的坐标x以及y上。
lineTo(x, y)
绘制一条从当前位置到指定x以及y位置的直线。
arc(x, y, radius, startAngle, endAngle, anticlockwise)
画一个以(x,y)为圆心的以radius为半径的圆弧(圆)
从startAngle开始到endAngle结束,按照anticlockwise给定的方向(默认为顺时针)来生成。
该方法有六个参数:x,y为绘制圆弧所在圆上的圆心坐标。radius为半径。
startAngle以及endAngle参数用弧度定义了开始以及结束的弧度。这些都是以x轴为基准。
参数anticlockwise为一个布尔值。为true时,是逆时针方向,否则顺时针方向。
quadraticCurveTo(cp1x, cp1y, x, y)
绘制二次贝塞尔曲线,cp1x,cp1y为一个控制点,x,y为结束点。
bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x, y)
绘制三次贝塞尔曲线,cp1x,cp1y为控制点一,cp2x,cp2y为控制点二,x,y为结束点。
Path2D()
Path2D()会返回一个新初始化的Path2D对象(可能将某一个路径作为变量——创建一个它的副本,或者将一个包含SVG path数据的字符串作为变量)。
new Path2D(); // 空的Path对象
new Path2D(path); // 克隆Path对象
new Path2D(d); // 从SVG建立Path对象
drawImage方法
JavaScript 语法 1
在画布上定位图像:
context.drawImage(img,x,y);
JavaScript 语法 2
在画布上定位图像,并规定图像的宽度和高度:
context.drawImage(img,x,y,width,height);
JavaScript 语法 3
剪切图像,并在画布上定位被剪切的部分:
context.drawImage(img,sx,sy,swidth,sheight,x,y,width,height);
sx,sy,swidth,sheight表示引用的img的参数
可以通过一系列属性来设置线的样式
lineWidth = value
设置线条宽度。
lineCap = type
设置线条末端样式。
lineJoin = type
设定线条与线条间接合处的样式。
miterLimit = value
限制当两条线相交时交接处最大长度;所谓交接处长度(斜接长度)是指线条交接处内角顶点到外角顶点的长度。
getLineDash()
返回一个包含当前虚线样式,长度为非负偶数的数组。
setLineDash(segments)
设置当前虚线样式。
lineDashOffset = value
设置虚线样式的起始偏移量。
解决多个cancas元素的布局问题。怎么样才能互不影响。-----低级错误,变量用错了,多个canvas不会互相影响。