jeneen1129
jeneen1129

svg 学习 - 基础知识

参考：
w3school => svg-v1.1
svg-mdn
菜鸟教程
参考手册
百度文库-svg基础

其他网站：
与其他文件类型进行转换：链接
显示 svg 工具：链接 | 链接

what

SVG 指的是可伸缩矢量图形 (Scalable Vector Graphics),即放大或者缩小不失真，使用 XML 格式定义图形。
包含形状、样式、标记、滤镜、渐变等。
预定义了七种形状元素：矩形(rect)、圆形(circle)、椭圆(ellipse)、线段(line)、折线(polyline)、多边形(polygon)、路径(path)。

why

与其他图像格式相比，使用 SVG 的优势有以下几点：

  • SVG 可被非常多的工具读取和修改（比如记事本）
  • SVG 与 JPEG 和 GIF 图像比起来，尺寸更小，且可压缩性更强。
  • SVG 是可伸缩的
  • SVG 图像可在任何的分辨率下被高质量地打印
  • SVG 可在图像质量不下降的情况下被放大
  • SVG 图像中的文本是可选的，同时也是可搜索的（很适合制作地图）
  • SVG 可以与 Java 技术一起运行
  • SVG 是开放的标准
  • SVG 文件是纯粹的 XML
  • 相比 css 来讲，兼容性更好，早于 css3 实现一些特殊效果，功能强大

适用于 大型渲染区域，如百度地图，不适合游戏。用途：

  • 静态图形绘制
  • 动态动画效果
  • 专门事件绑定

how

入门实例

要点说明：

  1. 以 svg 标签包含，version 为 svg 的版本，xmlns 定义 svg 命名空间
  2. circle 标签创建一个圆，cx 和 cy 属性定义圆的中心坐标，默认是（0，0），r 为半径， fill 为填充颜色， stroke-width 为边框宽带

坐标定位

对于所有元素，SVG 使用的坐标系统或者说网格系统，和Canvas用的差不多（所有计算机绘图都差不多）。这种坐标系统是：以页面的左上角为 (0,0) 坐标点，坐标以像素为单位，x 轴正方向是向右，y 轴正方向是向下。注意，这和你小时候所教的绘图方式是相反的。但是在 HTML 文档中，元素都是用这种方式定位的。


内置图形的 html 属性 或 css 样式

fill(填充颜色)
fill-opacity(填充透明度)

stroke(边框颜色)
stroke-width(边框宽度)
stroke-opacity(边框透明度)
stroke-dasharray(创建虚线)
stroke-linecap(路径的终结样式)

transform(变换)
filter(滤镜)(url[#滤镜id])

常见图形用法

1. 矩形(rect)

试一试

  • x 属性定义矩形的左侧位置（例如，x="0" 定义矩形到浏览器窗口左侧的距离是 0px）
  • y 属性定义矩形的顶端位置（例如，y="0" 定义矩形到浏览器窗口顶端的距离是 0px）
  • rx 和 ry 属性可使矩形产生圆角。

2. 圆形(circle
  • cx 属性定义的椭圆中心的x坐标
  • cy 属性定义的椭圆中心的y坐标

3. 椭圆(ellipse)
  • rx 属性定义的水平半径
  • ry 属性定义的垂直半径

4. 线段(line)
  • x1 属性在 x 轴定义线条的开始
  • y1 属性在 y 轴定义线条的开始
  • x2 属性在 x 轴定义线条的结束
  • y2 属性在 y 轴定义线条的结束

5. 折线(polyline)

元素是用于创建任何只有直线的形状。

6. 多边形(polygon)

标签用来创建含有不少于三个边的图形。
多边形是由直线组成，其形状是"封闭"的（所有的线条 连接起来）。
  • points 属性定义多边形每个角的 x 和 y 坐标

7. 路径(path)
  • d 路径数据： 
    M = moveto
L = lineto
H = horizontal lineto
V = vertical lineto
C = curveto
S = smooth curveto
Q = quadratic Bézier curve
T = smooth quadratic Bézier curveto
A = elliptical Arc
Z = closepath

    注意：以上所有命令均允许小写字母。大写表示绝对定位，小写表示相对定位。


8. 文本(text)


  
    I love SVG
    
  


  
    
  
   
  
    I love SVG I love SVG

9. 和

所有互联网的SVG滤镜定义在元素中。元素定义短并含有特殊元素（如滤镜）定义。
标签用来定义SVG滤镜。
  • 定义可复用的部件
  • 定义统一的样式

10. 事件

常用的时间有 onclick \ onactivate \ onmousedown \ onmouseup \ onmouseover \ onmousemove \ onmouseout \ onload \ onresize \ onunload \ onrepeat

svg 嵌入 Html 中

svg 滤镜

新增参考连接：链接->点击 | 链接2

SVG可用的滤镜是（19个）：

feBlend - 与图像相结合的滤镜
feColorMatrix - 用于彩色滤光片转换
feComponentTransfer
feComposite
feConvolveMatrix
feDiffuseLighting - 散射光照明
feDisplacementMap
feFlood
feGaussianBlur
feImage
feMerge
feMorphology
feOffset - 过滤阴影
feSpecularLighting - 镜面照明
feTile
feTurbulence
feDistantLight - 用于照明过滤
fePointLight - 用于照明过滤
feSpotLight - 用于照明过滤

可以用滤镜实现想要的模糊、阴影等等效果（用来增加对SVG图形的特殊效果），类似 css 滤镜中blur()、contrast()、drop-shadow()， for example:
  • 元素id属性定义一个滤镜的唯一名称
  • in="SourceGraphic"这个部分定义了由整个图像创建效果
  • 元素的滤镜属性用来把元素链接到"f1"滤镜
  • result 用于 中间结果的输出(也称作 primitives 图元)，其他滤镜可以使用 in 属性导入 result
  • in2 用于接收某个 result 输出，在此效果上面进行过滤

多个滤镜合并使用

在不同的滤镜利用 result 和 in 属性，可以实现在前一个基本变换基础上建立另一个操作。其中可能涉及的标签可能有feComposite|feMerge|feFlood等。

  • feMerge 滤镜允许同时应用滤镜效果而不是按顺序应用滤镜效果。
  • 遵循 后输入 的层级更高的原则。

标签属性

基本每个滤镜标签都有的属性:

x,y - 坐标
width,height - 宽|高
result - 定义一个滤镜效果的输出名称，以便 in
in - 指定滤镜效果的输入源，可以是某个 result ，也可以是下面 6 个值：
    SourceGraphic - 图形元素本身作为 输入源
    SourceAlpha - 与 SourceGraphic，相比不同在于 只使用元素的非透明部分
    BackgroundImage 
    BackgroundAlpha
    FillPaint
    StrokePaint

混合模式

css 中，有混合模式 mix-blend-mode 和 background-blend-mode。
svg 中有 5 个 - normal(正常) | multiply(正片叠底) | screen(滤色) | darken(变暗) | lighten(变亮)

该滤镜基于转换矩阵对颜色进行变换。每一像素的颜色值（[红，绿，蓝，透明度]的矢量）都经过矩阵乘法 (matrix multiplated) 计算出的新颜色。

// 包含两个私有属性
type:  saturate | hueRotate | luminanceToAlpha | matrix
values:  0.0 - 1.0 | 0.0 - 360 | 只有一个效果 | 4x5 的矩阵

saturate 和 hueRotate 与 css 中 filter 中的 saturate 和 hue-rotate 作用一模一样。

图形的表示：数字图形的本质是一个多维矩阵，把图像的R分量放进红色通道里，B分量放到蓝色通道里，G分量放到绿色通道里，经过处理，显示在屏幕上的是我们看到的彩色图像。

// 矩阵计算得到 rgba() 值
/*R G B A 1*/
1 0 0 0 0 = 1*R + 0*G + 0*B + A*0 + 0 //R
0 1 0 0 0 = 0*R + 1*G + 0*B + A*0 + 0 //G
0 0 1 0 0 = 0*R + 0*G + 1*B + A*0 + 0 //B
0 0 0 1 0 = 0*R + 0*G + 0*B + A*1 + 0 //A

两种光源及其他

光照滤镜

是 svg 区别于 css 的独特魅力。
feSpecularLighting（镜面照明） | feDiffuseLighting （散射光照明） 都为光照滤镜，使用它们照亮一个源图形。
feDiffuseLighting : 来自外部光源，适合模拟太阳光或者灯光照明
feSpecularLighting : 指定从反射面反射的二次光

形态滤镜

feMorphology ：形态滤镜，输入源是 图形的 alpha 通道，利用 operator 设置腐蚀（变薄 erode）或者扩张（加粗 dilate）, 默认 erode, radius 标识笔触的大小，该模式下的效果程度，默认 0 。

纹理滤镜

turbulence 为 湍流，不稳定气流，svg 能够实现半透明或者波状图像，利用 Perlin 噪声函数 可以实现 人造纹理。
feTurbulence : 可以创建纹理图作为置换图，不需要借助外部图形的纹理效果，即可创建复杂的效果。三个需要注意的属性：

type - fractalNoise (分形噪声更加平滑，更接近云雾)| turbulence (湍流噪声)
baseFrequency - 噪声函数的基本频率的参数，频率越小，产生的图形越大， 取值在 0.02 ~ 0.2 
numOctaves - 噪声函数的精细度，数值越高，噪声更详细，默认值为 1

示意两种噪声效果

映射置换滤镜

feDisplacementMap 为映射置换滤镜，需要掌握很多 PhotoShop 纹理创建或者是图形色彩相关的知识。使用该滤镜用于改变元素和图形的像素位置，将遍历原图的所有像素点，映射到新的位置，形成新图形。可以将纹理滤镜过后的图形进行形变、扭曲、液化等等，转化的一个公式-P（x + scale * (XC*(x,y) - 0.5, y + scale * (YC*(x,y) - 0.5) → P(x,y)。

svg 渐变

渐变是一种从一种颜色到另一种颜色的平滑过渡。另外，可以把多个颜色的过渡应用到同一个元素上。
SVG渐变主要有两种类型：

  • Linear(线性渐变)
  • Radial(放射渐变)

标签必须嵌套在的内部。
线性渐变可以定义为水平，垂直或角渐变：

  • 当y1和y2相等，而x1和x2不同时，可创建水平渐变
  • 当x1和x2相等，而y1和y2不同时，可创建垂直渐变
  • 当x1和x2不同，且y1和y2不同时，可创建角形渐变
  • 可以利用 class 或者 id 在 style 里面写 fill 或者 filter。url 是 css 滤镜属性的关键字之一，允许引入特定的 svg 过滤器，极大增强了 css 滤镜的能力。

好用的库

svg.js

  • 更加接近原生 svg 语法，可以直观的操作 svg。svg.js 更快，兼容性好，上手更方便。
  • 免费开源。轻量级，总共只有16kb。

Snap.svg

  • Snap.svg 更接近 jquery 的语法，其更全，功能丰富。
  • JavaScript库，可以跨任何类型的 svg 工作，包括从 Illustrator\InkScape 或者 HTML。

其他

Paper.js, 拉斐尔, Two.js, Velocity.js, Vivus.js

如果您都能看到这里了，对您有用的话，可以点个赞不@*@

你可能感兴趣的:(svg 学习 - 基础知识)

  • [rust] rust学习 1nv1s1ble rustrust学习开发语言
    rust学习1.项目组织结构工程#创建一个工程cargonewmy-project工作空间在Rust中，工作空间（Workspace）是一个包含多个Rust项目的共享环境，用于管理多个crate（库或可执行文件）。它允许多个Rust项目共享Cargo.lock、依赖项和target/目录，提高编译效率，并且适用于多包管理、模块化开发。为什么使用Rust工作空间？Rust工作空间适用于以下场景：管理
  • 过拟合：机器学习中的“死记硬背”陷阱 彩旗工作室 人工智能机器学习人工智能
    在机器学习中，过拟合（Overfitting）是一个几乎每个从业者都会遇到的经典问题。它像一把双刃剑：当模型过于“聪明”时，可能会陷入对训练数据的过度依赖，从而失去处理新问题的能力。本文将从原理到实践，深入探讨过拟合的本质及应对策略。1.什么是过拟合？过拟合是指模型在训练数据上表现极佳，但在新数据（测试数据或真实场景数据）上表现显著下降的现象。通俗来说，模型像一个“死记硬背的学生”，记住了训练集中
  • 【C语言--趣味游戏系列】--电脑关机整蛊小游戏 User_芊芊君子 C语言内容概括c语言游戏电脑
    前言：老铁们，还是那句话，学习很苦游戏来补，为了提高大家与朋友之间的友谊，博主在这里分享一个电脑关机的恶作剧小游戏，快拿去试试吧！！！目录：1.电脑关机代码2.详解1.电脑关机代码#define_CRT_SECURE_NO_WARNINGS#include#include#includeintmain(){charinput[20]={0};system("shutdown-s-t60");whi
  • Spring-Boot学习笔记 戴帽子的小熊猫 学习笔记学习笔记springboot
    这个笔记是在自己学习的过程中根据实际用到的和学到的整理出来的，可能会有缺失，错误等，主要是给激励自己学习，遇到写不下去的情况给自己一个参考，请各位大佬发现问题提出问题时能嘴下留情，也希望多提建议，谢谢。本笔记长期更新（更新日期2024年9月21日）目录第1章.固定格式参考1.1application.yml1.2mapper.xml(详细操作见另一个文件[XML数据库操作笔记]())1.3appl
  • java 对象和变量的区别_JAVA中的类／对象／变量／方法／参数含义及区别和联系... 抱玉于浮光 java对象和变量的区别
    JAVA学习了半月有余，最开始对这些东西的定义还是很清晰的，但越往后面，前面的东西没那么清晰了，返回来在看这些定义，为了以后方便查阅，现在摘录一下，放在这儿。类：类是组成java程序的基本要素。类封装了一类对象的属性和方法。类是用来定义产生对象的模板。类的实现包括两部分：类声明和类体。类体分为两部分：成员变量和局部变量。1、成员变量和局部变更的类型可以是java中的任何一种数据类型.变量定义部分所
  • Flutter设计模式全面解析：单例模式 那年星空 flutter设计模式单例模式
    谈到设计模式这个“古老”的话题，大家先别急着划走哈，虽然对它再熟悉不过，几乎是最初开始学习编程到现在伴随着我们整个编程生涯，最早Java、C++语言实现的各种设计模式到现在还会经常有所接触，面试中也是必问的环节，在开发Flutter项目的时候，也会多少借鉴了其它语言设计模式的实现，但始终觉得dart语言实现的设计模式理解不够系统，有的实现还缺点儿dart语言本身的语法特性。加上最近在看一些Flut
  • harmony Next 基础知识点1 趋势大仙 Harmonyharmonyos华为
    容器类—Column和Row布局容器概念Column表示沿垂直方向布局的容器Row表示沿水平方向布局的容器对齐方式justifyContent:设置子元素在主轴方向的对齐格式alignItems:设置子元素在交叉轴方向的对齐格式主轴和交叉轴的概念主轴：在Column容器中的子组件是按照从上到下的垂直方向布局的，其主轴的方向是垂直方向；在Row容器中的组件是按照从左到右的水平方向布局的，其主轴的方向
  • PyTorch从入门到精通：探索深度学习新境界 lmtealily 深度学习pytorch人工智能
    引言PyTorch作为当前最受欢迎的深度学习框架之一，凭借其动态计算图的独特设计和与Python生态的无缝集成，正重塑着人工智能开发的新范式1。从NVIDIA的研究实践到Meta的产业应用，PyTorch的价值已渗透至学术研究、工业部署的每个角落。本文将带领您从张量操作基础开始，逐步探索GPU加速、动态图机制、框架生态集成等高级主题，最终实现理论与实战的双重突破。一、PyTorch核心基础构建1.
  • anaconda运行python3_Anaconda上的python3初体验 weixin_39534208
    正好最近没事，打算学习一下python3还有学学怎么看英语文献。然后接触到了Anaconda，当然之前也有用过python3的ide还有pycharm，不过实话实说Anaconda目前都非常让我满意。毕竟学计算机，人生苦短，没必要为了繁琐的软件使用来浪费时间。Anaconda就很好的解决了这个问题，他上面把许多有用的东西整合到了一起，非常方便快捷。安装Anaconda也没有太大难度，选择好对应环境
  • Spring有哪些缺点? java1234_小锋 javajava面试开发语言
    大家好，我是锋哥。今天分享关于【Spring有哪些缺点?】面试题。希望对大家有帮助；Spring有哪些缺点?1000道互联网大厂Java工程师精选面试题-Java资源分享网Spring是一个非常流行的Java框架，提供了丰富的功能和灵活的配置选项，广泛应用于企业级应用开发。然而，尽管Spring有许多优点，但它也存在一些缺点和挑战，以下是一些常见的缺点：1.学习曲线较陡峭Spring框架包含了大量
  • 【Python】已解决：pip安装第三方模块（库）与PyCharm中不同步的问题（PyCharm添加本地python解释器） 屿小夏 pythonpippycharm
    个人简介：某不知名博主，致力于全栈领域的优质博客分享|用最优质的内容带来最舒适的阅读体验！文末获取免费IT学习资料！文末获取更多信息精彩专栏推荐订阅收藏专栏系列直达链接相关介绍书籍分享点我跳转书籍作为获取知识的重要途径，对于IT从业者来说更是不可或缺的资源。不定期更新IT图书，并在评论区抽取随机粉丝，书籍免费包邮到家AI前沿点我跳转探讨人工智能技术领域的最新发展和创新，涵盖机器学习、深度学习、自然
  • 如何在github上参与开源项目 这个懒人 github开源软件
    1.创建GitHub账号如果你还没有GitHub账号，首先需要注册一个：访问GitHub官网。点击右上角的“Signup”按钮，填写注册信息并完成注册。2.找到感兴趣的项目GitHub上有成千上万的开源项目，你可以通过以下方式找到感兴趣的项目：搜索项目：在GitHub首页的搜索框中输入关键词，例如“机器学习”、“Web开发”等。使用高级搜索功能，通过语言、标签等过滤条件找到合适的项目。浏览Tren
  • 普通人如何在2025年入百万!? 中国CSDN一定能给你答案 AI黑客 qt游戏引擎人工智能前端个人开发
    我之前发的帖子在下面90后的疯狂逆袭：从辞职零收入到宅家暴赚300万，手把手教你收割互联网红利！我的主页：AI黑客-CSDN博客做任何事情知其然才能知其所以然万丈高楼平地起不要想着一口气吃个金娃娃都是一步一步来的。学习也好做人也罢都是要循序渐进的！我今年又再次更新了超级多干货-每日更新的：极致助力让新手就算是六十岁的新手也能让你年入百万！
  • nweb_nweb：小型安全的Web服务器（仅静态页面） cusi77914 pythonlinuxjavasocket编程语言
    您是否曾经想过运行一个小型，安全的Web服务器，而不必担心使用安装和配置可能很复杂的功能强大的Web服务器？您是否想知道如何编写一个通过网络套接字接收传入消息的程序？您是否曾经希望自己的Web服务器进行试验和学习？2012年将进行进一步更新，以支持最新的Web服务器和浏览器标准以及代码更新。好吧，别无所求-nweb是您所需要的。这是一个只有200行C源代码的简单Web服务器。它以常规用户身份运行，
  • 方案精读：185页PPT基于IPD流程的研发项目管理讲座 智慧化智能化数字化方案 项目经理售前工程师技能提升IPD流程体系IPD研发管理ipd项目管理IPD流程管理IPD端到端IPD流程细则IPD基础知识
    （本解读资料未包含于绑定资源内）绑定资源文档清单：2024版基于华为IPD与质量管理体系融合的研发质量管理(63页).pptxIPD流程操作细则(55页）.pptxIPD的基础知识介绍（54页）.pptIPD端到端流程培训方案【115页PPT】.ppt华为IPDCMM项目管理培训教材（41页）.pptx华为IPD流程体系设计方法论（123页）.pptx华为IPD项目管理“六步一法”.ppt华为的I
  • Linux命令学习笔记之 network NetworkManager kfepiza OS操作系统WindowsLinux等#LinuxCentOSUbuntu等linux学习centos
    networkNetworkManager前言CentOS7最小安装下的测试220511心得:启动network能打开网络,关闭network能关闭网络启动NetworkManager能打开网络,关闭不会关闭网络在两者都启动的情况下,单停network会断网,单停NetworkManager不会一些摘抄前言这两个东西在centOS7最小安装无勾选附加时就存在Ubuntu20.04中只有Networ
  • 【AI大模型智能应用】Deepseek生成测试用例 柳柳的博客 AI大模型测试用例
    在软件开发过程中，测试用例的设计和编写是确保软件质量的关键。然而，软件系统的复杂性不断增加，手动编写测试用例的工作量变得异常庞大，且容易出错。DeepSeek基于人工智能和机器学习，它能够依据软件的需求和设计文档，自动生成高质量的测试用例，显著减轻人工编写测试用例的负担。体验一把用DeepSeek编写测试用例，还生成清晰直观的思维导图，整个流程十分顺畅。这篇文章讲解如何使用deepseek生成功能
  • Linux 命令学习记录 hxung 面试学习使用linux学习运维
    Linux命令详解与进阶指南Linux是一种广泛使用的开源操作系统，掌握Linux命令是开发者和系统管理员的必备技能。本文将详细介绍Linux的常用命令，并涵盖一些高级进阶技巧，帮助你更高效地使用Linux。目录基础命令文件与目录操作文本处理系统信息权限管理进阶命令进程管理网络操作磁盘管理Shell脚本高级技巧管道与重定向正则表达式任务调度性能监控案例实战日志分析自动化部署服务器监控基础命令文件与
  • kmp报错→Cannot find skiko-windows-x64.dll.sha256 淡淡的id 其他kotlinKMP
    1、前言  学习kmp（KotlinMultiPlatform简称）过程中报了错误，这个报错在直接运行desktop的main方法才会出现，用gradle运行却不会报错，新建的kmp项目也不会出现，我学习的写了一些代码的项目才会出现。  运行main方法主要是需要运行main方法才能debug，gradle不能debug环境kmp版本：1.7.0gradle版本：8.13kotlin版本：2.1.
  • Python依赖管理工具分析 xdpcxq1029 python开发语言
    Python的依赖管理工具一直没有标准化，原因主要包括：历史发展的随意性：Python发展早期对于依赖管理的重视程度不足，缺乏从一开始就进行统一规划和设计的意识社区的分散性：Python社区庞大且分散，众多开发者和团队各自为政，根据自己的需求和偏好开发工具，缺乏统一的协调和整合机制多样化的使用场景：Python应用场景广泛，从Web开发到数据科学、机器学习、系统管理脚本等。不同场景对依赖管理有着不
  • 92.HarmonyOS NEXT开发学习路径与最佳实践总结：构建高质量应用 harmonyos-next
    温馨提示：本篇博客的详细代码已发布到git:https://gitcode.com/nutpi/HarmonyosNext可以下载运行哦！HarmonyOSNEXT开发学习路径与最佳实践总结：构建高质量应用1.学习路径指南1.1基础知识阶段阶段重点内容相关教程学习目标入门基础开发环境、基本语法01-03搭建环境，理解基础概念组件开发UI组件、生命周期04-06掌握组件开发和状态管理数据处理状态管理
  • 人工智能之数学基础:线性代数中矩阵的初印象 每天五分钟玩转人工智能 机器学习深度学习之数学基础线性代数人工智能矩阵机器学习深度学习
    本文重点从本篇文章开始，我们将开始学习矩阵的概念，矩阵，作为线性代数的核心概念之一，就像是一个个精心编织的网格，将复杂的数据和关系以一种简洁而直观的方式呈现出来。矩阵矩阵的初印象想象一下，你手里有一张空白的表格，上面布满了等待填充的格子。这些格子按照行和列整齐排列，形成了一个二维的平面结构。如果我们把数字、符号或者更复杂的元素填入这些格子中，那么这个表格就变成了一个“矩阵”。简单来说，矩阵就是一个
  • Go+Vue通用后台管理项目实战 - 带源码课件 6v6-博客网 6v6-博客 golangvue.js开发语言
    Go+Vue通用后台管理项目实战-带源码课件课程描述本课程从0到1搭建前后端项目，帮助学员掌握Go+Vue开发前后端分离项目的能力。通过实战项目，学员将学习到如何设计系统架构、实现核心功能模块，并最终完成一个完整的后台管理系统。课程亮点前后端分离：基于Go语言后端和Vue前端，实现高效开发模式。实战项目：通过完整项目实战，掌握从需求分析到部署上线的全流程。源码提供：附带完整源码，方便学员学习和二次
  • 【产品经理】设计一流产品九步法 程矢 Axure原型设计axure
    转载自：老二牛车教育»【产品经理】设计一流产品九步法百度高管舒迅（@舒迅）曾经带领百度贴吧创造出一年内用户注册量增长10倍、浏览量3倍增长的奇迹，作为一名在中国互联网摸爬滚打超过12年的老兵，在和百度内部同事的相互磨砺中，总结出了极其丰富而是用的产品设计经验。他在这篇文章中介绍的九条方法不仅值得每一个PM的认真学习，同样也值得每一个有志于打造出一流产品的互联网创业者和从业者的揣摩。本文描述的产品设
  • 《我的Python觉醒之路》之转型Python（十四）——控制流 Python破壁人手记 python开发语言网络
    以下是2025年3月份学习的核心内容，接下来我再练习一段例子，为后续做准备了！！**`第一章节的核心内容就是下面的了`**1.启动IDLE，打开的带有>>>提示符的界面便是Python的交互式解释器2.表达式（Expression）是Python中能产生一个值的代码片段，由**操作数**（如变量、常量）和运算符（如加减乘除、逻辑判断符）组合而成.3.表达式包含“值”（例如2）和“操作符”（例如+）
  • 编程思想:从图片类设计看程序结构,以及对图片类对象的展望 jllws1 C++编程思想数据类设计数据类设计C++编程思想
    前言不管是学习,还是创造,都得反复总结,得到解决某个或者某类问题的一般方法,那么下次遇到同样的问题就是信手拈来.图片类对象的抽象含义其实就一句话:怎样把一个数据静止放到一个场景中.把图片类对象的范围放宽,同样适用.数据对象可能是字符,一段音乐,一段话,按照前面的定义:计算机世界的一种客观存在,都可以被视作数据.当然字符,音乐或者一段话会被写入对应硬件中.程序结构以下是笔者理解的程序结构这里引入了几
  • AI技术学习笔记系列001：FastLanguageModel.get_peft_model 函数各参数的详细解释 新说一二 人工智能学习笔记
    以下是关于代码中FastLanguageModel.get_peft_model函数各参数的详细解释，以及企业实际微调时的选择考量：参数详解及对微调的影响1.r=32（秩）作用：控制LoRA适配器的低秩矩阵的维度（秩），直接影响可训练参数数量。影响：r越大：适配器表达能力更强，能捕捉更复杂的任务特征，但可能导致过拟合（尤其数据量少时），训练时间和显存占用增加。r越小：参数量少，训练更快，显存占用低
  • Python个人学习笔记（2）：编程入门知识与基础语法介绍 NEET_LH 樵夫老师Python零基础课程个人学习笔记python学习笔记
    一、注释（一）作用1.对代码进行解释和说明避免自己忘了写的代码是做什么的——写给人看的，机器不运行不要去注释你代码做了什么，而要去注释我的代码为什么要这么做。用于记录思路、实现方法、代码功能注释很重要，大厂很重视，尤其日企2.调试代码报错的一篇代码，从下到上一句一句加#，依次运行，如果某行代码加了#后，程序运行成功，那么就是这行有问题，但这个方法不好。（二）注释方法1.单行注释==句子前加#快捷键
  • JavaEE系统架构师学习路线(基础篇) 淘小五
    大纲：第1阶段(Java程序员)-Java语言基础第2阶段(Java初级软件工程师)-JSP、Servlet、HTML、CSS、JS、Bootstrap、XML、AJAX、MySQL、SQLServer、Oracle第3阶段(Java中级软件工程师)-Struts2、Spring、Hibernate、SpringMVC、Mybatis、Shiro、JVM第4阶段(Java高级软件工程师)-WebS
  • Java学习笔记1.1_初识 Java 火车爱上轨道 Java编程语言基础java学习
    初识Java前言一、Java概述1.什么是程序2.Java语言的产生和发展史3.Java可以做什么4.Java语言的特点二、Java语言环境搭建1.JDK、JRE、JVM关系2.安装JDK3.配置环境变量4.环境测试三、开发第一个Java程序1.开发Java程序的步骤2.用记事本开发Java程序四、Java程序的注释1.单行注释和多行注释2.文档注释五、Java程序的结构六、JavaAPI文档前言
  • 基本数据类型和引用类型的初始值 3213213333332132 java基础
    package com.array; /** * @Description 测试初始值 * @author FuJianyong * 2015-1-22上午10:31:53 */ public class ArrayTest { ArrayTest at; String str; byte bt; short s; int i; long
  • 摘抄笔记--《编写高质量代码：改善Java程序的151个建议》 白糖_ 高质量代码
            记得3年前刚到公司，同桌同事见我无事可做就借我看《编写高质量代码：改善Java程序的151个建议》这本书，当时看了几页没上心就没研究了。到上个月在公司偶然看到，于是乎又找来看看，我的天，真是非常多的干货，对于我这种静不下心的人真是帮助莫大呀。           看完整本书，也记了不少笔记
  • 【备忘】Django 常用命令及最佳实践 dongwei_6688 django
    注意：本文基于 Django 1.8.2 版本   生成数据库迁移脚本（python 脚本） python manage.py makemigrations polls  说明：polls 是你的应用名字，运行该命令时需要根据你的应用名字进行调整   查看该次迁移需要执行的 SQL 语句（只查看语句，并不应用到数据库上）： python manage.p
  • 阶乘算法之一N! 末尾有多少个零 周凡杨 java算法阶乘面试效率
                                     &n
  • spring注入servlet g21121 Spring注入
    传统的配置方法是无法将bean或属性直接注入到servlet中的，配置代理servlet亦比较麻烦，这里其实有比较简单的方法，其实就是在servlet的init()方法中加入要注入的内容： ServletContext application = getServletContext(); WebApplicationContext wac = WebApplicationContextUtil
  • Jenkins 命令行操作说明文档 510888780 centos
    假设Jenkins的URL为http://22.11.140.38:9080/jenkins/ 基本的格式为 java 基本的格式为 java -jar jenkins-cli.jar [-s JENKINS_URL] command [options][args] 下面具体介绍各个命令的作用及基本使用方法 1. &nb
  • UnicodeBlock检测中文用法 布衣凌宇 UnicodeBlock
    /**  * 判断输入的是汉字  */ public static boolean isChinese(char c) {        Character.UnicodeBlock ub = Character.UnicodeBlock.of(c);    
  • java下实现调用oracle的存储过程和函数 aijuans javaorale
    1.创建表：STOCK_PRICES     2.插入测试数据：     3.建立一个返回游标：  PKG_PUB_UTILS   4.创建和存储过程：P_GET_PRICE     5.创建函数：   6.JAVA调用存储过程返回结果集 JDBCoracle10G_INVO
  • Velocity Toolbox antlove 模板toolboxvelocity
    velocity.VelocityUtil package velocity; import org.apache.velocity.Template; import org.apache.velocity.app.Velocity; import org.apache.velocity.app.VelocityEngine; import org.apache.velocity.c
  • JAVA正则表达式匹配基础 百合不是茶 java正则表达式的匹配
      正则表达式;提高程序的性能,简化代码,提高代码的可读性,简化对字符串的操作   正则表达式的用途; 字符串的匹配 字符串的分割 字符串的查找 字符串的替换       正则表达式的验证语法     [a] //[]表示这个字符只出现一次 ,[a] 表示a只出现一
  • 是否使用EL表达式的配置 bijian1013 jspweb.xmlELEasyTemplate
            今天在开发过程中发现一个细节问题，由于前端采用EasyTemplate模板方法实现数据展示，但老是不能正常显示出来。后来发现竟是EL将我的EasyTemplate的${...}解释执行了，导致我的模板不能正常展示后台数据。         网
  • 精通Oracle10编程SQL(1-3)PLSQL基础 bijian1013 oracle数据库plsql
    --只包含执行部分的PL/SQL块 --set serveroutput off begin dbms_output.put_line('Hello,everyone!'); end; select * from emp; --包含定义部分和执行部分的PL/SQL块 declare v_ename varchar2(5); begin select
  • 【Nginx三】Nginx作为反向代理服务器 bit1129 nginx
    Nginx一个常用的功能是作为代理服务器。代理服务器通常完成如下的功能：   接受客户端请求 将请求转发给被代理的服务器 从被代理的服务器获得响应结果 把响应结果返回给客户端 实例 本文把Nginx配置成一个简单的代理服务器 对于静态的html和图片，直接从Nginx获取 对于动态的页面，例如JSP或者Servlet，Nginx则将请求转发给Res
  • Plugin execution not covered by lifecycle configuration: org.apache.maven.plugin blackproof maven报错
    转：http://stackoverflow.com/questions/6352208/how-to-solve-plugin-execution-not-covered-by-lifecycle-configuration-for-sprin   maven报错： Plugin execution not covered by lifecycle configuration:
  • 发布docker程序到marathon ronin47 docker 发布应用
    1 发布docker程序到marathon 1.1 搭建私有docker registry 1.1.1 安装docker regisry docker pull docker-registry docker run -t -p 5000:5000 docker-registry 下载docker镜像并发布到私有registry docker pull consol/tomcat-8.0
  • java-57-用两个栈实现队列&&用两个队列实现一个栈 bylijinnan java
    import java.util.ArrayList; import java.util.List; import java.util.Stack; /* * Q 57 用两个栈实现队列 */ public class QueueImplementByTwoStacks { private Stack<Integer> stack1; pr
  • Nginx配置性能优化 cfyme nginx
    转载地址：http://blog.csdn.net/xifeijian/article/details/20956605   大多数的Nginx安装指南告诉你如下基础知识——通过apt-get安装，修改这里或那里的几行配置，好了，你已经有了一个Web服务器了。而且，在大多数情况下，一个常规安装的nginx对你的网站来说已经能很好地工作了。然而，如果你真的想挤压出Nginx的性能，你必
  • [JAVA图形图像]JAVA体系需要稳扎稳打,逐步推进图像图形处理技术 comsci java
         对图形图像进行精确处理，需要大量的数学工具，即使是从底层硬件模拟层开始设计，也离不开大量的数学工具包，因为我认为，JAVA语言体系在图形图像处理模块上面的研发工作，需要从开发一些基础的，类似实时数学函数构造器和解析器的软件包入手，而不是急于利用第三方代码工具来实现一个不严格的图形图像处理软件......   &nb
  • MonkeyRunner的使用 dai_lm androidMonkeyRunner
    要使用MonkeyRunner，就要学习使用Python，哎 先抄一段官方doc里的代码 作用是启动一个程序（应该是启动程序默认的Activity），然后按MENU键，并截屏 # Imports the monkeyrunner modules used by this program from com.android.monkeyrunner import MonkeyRun
  • Hadoop-- 海量文件的分布式计算处理方案 datamachine mapreducehadoop分布式计算
    csdn的一个关于hadoop的分布式处理方案，存档。 原帖：http://blog.csdn.net/calvinxiu/article/details/1506112。     Hadoop 是Google MapReduce的一个Java实现。MapReduce是一种简化的分布式编程模式，让程序自动分布到一个由普通机器组成的超大集群上并发执行。就如同ja
  • 以資料庫驗證登入 dcj3sjt126com yii
    以資料庫驗證登入 由於 Yii 內定的原始框架程式, 採用綁定在UserIdentity.php 的 demo 與 admin 帳號密碼:    public function authenticate()    {        $users=array( &nbs
  • github做webhooks：[2]php版本自动触发更新 dcj3sjt126com githubgitwebhooks
    上次已经说过了如何在github控制面板做查看url的返回信息了。这次就到了直接贴钩子代码的时候了。 工具/原料 git github 方法/步骤   在github的setting里面的webhooks里把我们的url地址填进去。   钩子更新的代码如下： error_reportin
  • Eos开发常用表达式 蕃薯耀 Eos开发Eos入门Eos开发常用表达式
    Eos开发常用表达式 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> 蕃薯耀 2014年8月18日 15:03:35 星期一     &
  • SpringSecurity3.X--SpEL 表达式 hanqunfeng SpringSecurity
    使用 Spring 表达式语言配置访问控制，要实现这一功能的直接方式是在<http>配置元素上添加 use-expressions 属性：   <http auto-config="true" use-expressions="true"> 这样就会在投票器中自动增加一个投票器：org.springframework
  • Redis vs Memcache IXHONG redis
    1. Redis中，并不是所有的数据都一直存储在内存中的，这是和Memcached相比一个最大的区别。 2. Redis不仅仅支持简单的k/v类型的数据，同时还提供list，set，hash等数据结构的存储。 3. Redis支持数据的备份，即master-slave模式的数据备份。 4. Redis支持数据的持久化，可以将内存中的数据保持在磁盘中，重启的时候可以再次加载进行使用。 Red
  • Python - 装饰器使用过程中的误区解读 kvhur JavaScriptjqueryhtml5css
    大家都知道装饰器是一个很著名的设计模式，经常被用于AOP(面向切面编程)的场景，较为经典的有插入日志，性能测试，事务处理，Web权限校验， Cache等。 原文链接：http://www.gbtags.com/gb/share/5563.htm Python语言本身提供了装饰器语法（@），典型的装饰器实现如下：   @function_wrapper de
  • 架构师之mybatis-----update 带case when 针对多种情况更新 nannan408 case when
    1.前言.    如题. 2. 代码.   <update id="batchUpdate" parameterType="java.util.List"> <foreach collection="list" item="list" index=&
  • Algorithm算法视频教程 栏目记者 Algorithm算法
    课程：Algorithm算法视频教程 百度网盘下载地址： http://pan.baidu.com/s/1qWFjjQW 密码: 2mji 程序写的好不好,还得看算法屌不屌！Algorithm算法博大精深。 一、课程内容： 课时1、算法的基本概念 + Sequential search 课时2、Binary search 课时3、Hash table 课时4、Algor
  • C语言算法之冒泡排序 qiufeihu c算法
    任意输入10个数字由小到大进行排序。 代码： #include <stdio.h> int main() { int i,j,t,a[11]; /*定义变量及数组为基本类型*/ for(i = 1;i < 11;i++){ scanf("%d",&a[i]); /*从键盘中输入10个数*/ } for
  • JSP异常处理 wyzuomumu Webjsp
    1.在可能发生异常的网页中通过指令将HTTP请求转发给另一个专门处理异常的网页中: <%@ page errorPage="errors.jsp"%>   2.在处理异常的网页中做如下声明： errors.jsp: <%@ page isErrorPage="true"%>，这样设置完后就可以在网页中直接访问exc