美文网首页
SVG 创建图片,设置属性,创建元素

SVG 创建图片,设置属性,创建元素

作者: 时子释 | 来源:发表于2018-12-14 10:37 被阅读0次

创建的SVG元素使用原生的js写都要加上NS

document.createElementNS(文档的声明,元素名)

设置除了class,如果要给SVG加上其他属性,如data-name等要加上NS

setAttributeNS(null,”height”,'30')

第一个参数是 元素的文档声明,也可以为null

下面是新建图片元素的例子

var xmlns = “http://www.w3.org/2000/svg“; //这就是svg文档声明

var svgImg = document.createElementNS(xmlns,”image”); //此处要使用createElementNS

svgImg.setAttributeNS(null,”x”,this.x); //屏幕x坐标位置

svgImg.setAttributeNS(null,”y”,this.y); //屏幕坐标y位置

svgImg.setAttributeNS(null,”width”,this.width); //宽度

svgImg.setAttributeNS(null,”height”,this.heigh); 高度

svgImg.href.baseVal = "img/..."; //传入图片路径

g.appendChild(svgImg);

相关文章

  • SVG 创建图片,设置属性,创建元素

    创建的SVG元素使用原生的js写都要加上NS document.createElementNS(文档的声明,元素名...

  • jQuery系列(三) -- DOM

    创建元素与属性 JavaScript: 创建元素:document.createElement() 设置属性:se...

  • JS弹幕实现

    实现原理 1、设置展示弹幕元素位置属性为relative2、动态创建弹幕元素,位置属性设置absolute,lef...

  • #2 基本API

    创建svg所需要的api createElementNS(namespace, tagName): 创建元素,因为...

  • jQuery中的DOM操作

    1.创建文本节点: 在js: 创建元素:document.createElement设置属性:setAttribu...

  • iOS控件之UIButton

    创建 状态 属性 // frame // 背景色 // 标题 // 图片 // 间距 // 设置高亮状态 加深图片...

  • canvas-基础

    创建一个canvas HTML 创建canvas元素 设置宽高使用标签width,height属性,注意不能使用c...

  • UIImageView属性(contentMode)

    (1)创建 (3)设置边框颜色和大小 (4)contentMode属性: 这个属性是用来设置图片的显示方式,如居中...

  • JS数组

    如何创建数组,数组元素的读和写数组元素的的length属性 第二种创建数组元素的读写读取和设置时,使用方括号[],...

  • svg之path详解

    一、svg 介绍 path元素是SVG基本形状中最强大的一个,它不仅能创建其他基本形状,还能创建更多其...

网友评论

      本文标题:SVG 创建图片,设置属性,创建元素

      本文链接:https://www.haomeiwen.com/subject/bwpwhqtx.html