svg.js的git地址https://github.com/svgdotjs/svg.js

实现可以拖动，可双击编辑，可拖动改变长短，线条可旋转以及一个可点击改变大小，可更改内容的二维码。
首先引入jquery和svg.js然后引入svg.select.js、svg.resize.js、svg.draggable.js，这几个都是svg.js的扩展，具体地址是：
https://github.com/fuzzyma/svg.resize.js
https://github.com/Fuzzyma/svg.select.js
https://github.com/svgdotjs/svg.draggable.js

基于svg.js实现可编辑的图像的更多相关文章

  1. 基于svg.js实现对图形的拖拽、选择和编辑操作

    本文主要记录如何使用 svg.js 实现对图形的拖拽,选择,图像渲染及各类形状的绘制操作. 1.关于SVG SVG 是可缩放的矢量图形,使用XML格式定义图像,可以生成对应的DOM节点,便于对单个图形 ...

  2. 基于SVG.js实现网页初始化线条描绘效果

    前端实现看到一个网页的效果很cool(参考https://tympanus.net/Development/SVGDrawingAnimation/index2.html),决定自己去实现以下这个效果 ...

  3. Svg.Js 简介(转)

    什么是SVG? SVG 指可伸缩矢量图形 (Scalable Vector Graphics) SVG 用来定义用于网络的基于矢量的图形 SVG 使用 XML 格式定义图形 SVG 图像在放大或改变尺 ...

  4. svg.js教程及使用手册详解（一）

    做毕设的时候,因为要使用到画图和自定义动画,所以接触到了SVG.网上关于SVG和Canvas的对比很多,具体的辨析这里就不赘言.网上关于SVG的所谓教程基本上都是SVG本身,但是却没有一个针对svg. ...

  5. 基于Node.js + jade + Mongoose 模仿gokk.tv

    原文摘自我的前端博客,欢迎大家来访问 http://www.hacke2.cn 关于gokk 大学的娱乐活动基本就是在寝室看电影了→_→,一般都会选择去goxiazai.cc上看,里面的资源多,质量高 ...

  6. 基于Node.js的强大爬虫 能直接发布抓取的文章哦

    基于Node.js的强大爬虫 能直接发布抓取的文章哦 基于Node.js的强大爬虫能直接发布抓取的文章哦!本爬虫源码基于WTFPL协议,感兴趣的小伙伴们可以参考一下 一.环境配置 1)搞一台服务器,什 ...

  7. 《基于Node.js实现简易聊天室系列之详细设计》

    一个完整的项目基本分为三个部分:前端.后台和数据库.依照软件工程的理论知识,应该依次按照以下几个步骤:需求分析.概要设计.详细设计.编码.测试等.由于缺乏相关知识的储备,导致这个Demo系列的文章层次 ...

  8. 基于Three.js的360度全景--photo-sphere-viewer--简介

    这个是基于three.js的全景插件  photo-sphere-viewer.js  ---------------------------------------- 1.能添加热点: 2.能调用陀 ...

  9. SVG.js 图案使用和use引用

    一.SVG.Pattern 图案设置 var draw = SVG('svg1').size(300, 300); //SVG.Pattern 图案设置 var pattern = draw.patt ...

随机推荐

  1. 【BZOJ 1011】[HNOI2008]遥远的行星

    [题目链接]:http://www.lydsy.com/JudgeOnline/problem.php?id=1011 [题意] [题解] 这里的答案误差不超过5%是突破点; 如果是直接暴力写; 复杂 ...

  2. kettle的job中运行每行

     job中运行每行 有时,我们须要job或转换执行多次.且每次传入的參数都不同.假如你正在做数据迁移的工作,须要导入每天的旧数据,则须要一个job依据指定的日期导入数据,该日期被指定作为參数.假设 ...

  3. matlab 运行 AlexNet

    0. alexnet 工具箱下载 下载地址:Neural Network Toolbox(TM) Model for AlexNet Network 需要先注册(十分简单),登陆,下载: 下载完成之后 ...

  4. Erlang OTP编程初体验——gen_server和行为模式

    http://blog.sina.com.cn/s/blog_3fe961ae0101k4p6.html 行为模式其实非常类似于面向对象语言中的接口,至少笔者是这么理解的.OTP行为模式将一些反复出现 ...

  5. 小强的HTML5移动开发之路（21）—— PhoneGap

    一.PhoneGap是什么 PhoneGap 是一个用基于 HTML,CSS 和 JavaScript 的,创建移动跨平台移动应用程序的快速开发框架.它使开发者能够利用 iPhone,Android, ...

  6. iOS RunLoop了解和使用

    RunLoop介绍和使用 上次讲了runtime,这次是runloop,虽然两者都是run开头的名词术语,但是在OC中,这两个东西压根没啥联系.这篇文章主要讲讲runloop的一些概念和用法.其中包含 ...

  7. NP、NP-完全、NP-难问题

    What are the differences between NP, NP-Complete and NP-Hard? 0. 基本定义 判定问题(decision problem):一个答案是是或 ...

  8. HDU-4432-Sum of divisors （ 2012 Asia Tianjin Regional Contest ）

    Sum of divisors Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) ...

  9. springCloud跨域访问

    转自:http://blog.csdn.net/wangkang80/article/details/72829390 什么是跨域? 假设你在http://xxx.com/test/下有一个js文件, ...

  10. ubuntu12.04下编译安装x86平台qt库qt-everywhere-opensource-src-4.8.5

    本文记录PC(x86)下安装Linux/X11版Qt 开发环境.下载页面:http://qt-project.org/downloads ARM嵌入式版本qt库的编译安装详见<unbunt12. ...