使用js来动态绘制svg图片,首先就是要创建svg 节点。

使用createElementNS(),语法:

document.createElementNS(namespaceURI, qualifiedName[, options]);

参数:

有效的命名空间URL有:

代码举例:

var nameSpace = 'http://www.w3.org/2000/svg';  //命名空间url
var max = Math.max.apply(null, data);
var proportion = max/350;
var interval = 40;
var columnStyle = 'stroke: blue; fill: blue';
for (var singleColumn of data) {
document.createElementNS(nameSpace,'rect') //创建矩形
}

SVG的学习(34—36)的更多相关文章

  1. SVG相关学习(一)SVG基础

    SVG 相关学习 SVG SVG 指可伸缩矢量图形 (Scalable Vector Graphics) SVG viewBox <svg width="500" heigh ...

  2. svg的学习

    svg的学习 1,初步了解 1,大致看了一下svg的简介,在图形的操作和展示上有很大的优势,例如不会失精:灵活的dom操作:很好的兼容性(IE需要下载插件).so,是一门值得深究的前端课程: 2,看了 ...

  3. SVG绘图学习总结

    在我们平时做的很多网站项目中都会需要绘制各种各样的二维矢量图形.比如做城市地下管网的断面图.管线管点的坐标位置矢量标识图.钻孔位置或地层剖面图等等.我们有很多中方法来绘制这些矢量图(vml.canva ...

  4. Android学习笔记36:使用SQLite方式存储数据

    在Android中一共提供了5种数据存储方式,分别为: (1)Files:通过FileInputStream和FileOutputStream对文件进行操作.具体使用方法可以参阅博文<Andro ...

  5. (数据科学学习手札36)tensorflow实现MLP

    一.简介 我们在前面的数据科学学习手札34中也介绍过,作为最典型的神经网络,多层感知机(MLP)结构简单且规则,并且在隐层设计的足够完善时,可以拟合任意连续函数,而除了利用前面介绍的sklearn.n ...

  6. JavaScript权威设计--jQuery,Ajax.animate,SVG(简要学习笔记二十)[完结篇]

    1.$和jquery在全局命名空间中定义的唯一两个变量.   2.jquery是工厂函数,不是构造函数.他返回一个新创建的对象.   3.jquery的四种调用方式:     <1>传递C ...

  7. Android学习系列(36)--App调试内存泄露之Context篇(上)

    Context作为最基本的上下文,承载着Activity,Service等最基本组件.当有对象引用到Activity,并不能被回收释放,必将造成大范围的对象无法被回收释放,进而造成内存泄漏. 下面针对 ...

  8. 我的android学习经历36

    最近把android的基础知识都学的差不多了,也写了许多demo,就想自己写一个app,可是写到后面的时候发现很混乱,所以还是得写一些文档,用xml语言写一下基础的类以及一些其他的东西.所以要想写一个 ...

  9. android学习笔记36——使用原始XML文件

    XML文件 android中使用XML文件,需要开发者手动创建res/xml文件夹. 实例如下: book.xml==> <?xml version="1.0" enc ...

随机推荐

  1. 目标检测算法(1)目标检测中的问题描述和R-CNN算法

    目标检测(object detection)是计算机视觉中非常具有挑战性的一项工作,一方面它是其他很多后续视觉任务的基础,另一方面目标检测不仅需要预测区域,还要进行分类,因此问题更加复杂.最近的5年使 ...

  2. Spark机器学习(上)

    1.机器学习概念 1.1 机器学习的定义 在维基百科上对机器学习提出以下几种定义: l“机器学习是一门人工智能的科学,该领域的主要研究对象是人工智能,特别是如何在经验学习中改善具体算法的性能”. l“ ...

  3. Javascript高级编程学习笔记(24)—— 函数表达式(2)闭包

    昨天的文章中主要记录了,函数表达式与函数声明的区别 以及在JS中如何安全地使用递归 那么既然要深入地理解JS中的函数,闭包就是一个绕不开的概念 闭包 JS高编一书中对闭包的概念定义如下: 闭包是指有权 ...

  4. Java项目启动时执行指定方法的几种方式

    很多时候我们都会碰到需要在程序启动时去执行的方法,比如说去读取某个配置,预加载缓存,定时任务的初始化等.这里给出几种解决方案供大家参考. 1. 使用@PostConstruct注解 这个注解呢,可以在 ...

  5. BaseDao优化

    BaseDao优化2种方法 1. try { //读取配置文件,配置文件保存了数据库的东西 String path=”database.properties”; //创建实例化对象 Propertie ...

  6. Spring 静态代理+JDK动态代理和CGLIB动态代理

    代理分为两种:静态代理 动态代理 静态代理:本质上会在硬盘上创建一个真正的物理类 动态代理:本质上是在内存中构建出一个类. 如果多个类需要进行方法增强,静态代理则需要创建多个物理类,占用磁盘空间.而动 ...

  7. 引入CSS的三种方式

    虽然入职已经大半年,并自诩前端工程师,但是我真的不会……(有一种我有罪我该死的感觉 从CSS 样式代码插入的形式来看基本可以分为以下3种:内联式.嵌入式和外部式三种. 1.内联式 内联式css样式表就 ...

  8. 使用IntelliJ IDEA新建Java Web后端resfulAPI模板

    初始化项目 打开IntelliJ IDEA,我的版本是Version 2018.1.4.点击Create New Project.在左侧的列表中选择Maven.然后在右侧勾选Create from a ...

  9. SVN不能解锁,报错:没有匹配的可用锁令牌的解决方法

    命令行进入到要解锁的目录,执行 svn unlock 要解锁的文档名 进行解锁:若还是打不开锁,就用强制解锁 , svn unlock -f(--force) 要解锁的文档名 也可以通过 svnadm ...

  10. 流式大数据计算实践(2)----Hadoop集群和Zookeeper

    一.前言 1.上一文搭建好了Hadoop单机模式,这一文继续搭建Hadoop集群 二.搭建Hadoop集群 1.根据上文的流程得到两台单机模式的机器,并保证两台单机模式正常启动,记得第二台机器core ...