易经 Hexagram Unicode 符号 64 个基本图形

易经符号通用编码字元集相容国际性标准、地区性编码，使用二进位六爻，找出相对应的易经六十四个基本符号图形，对应 Unicode 字型符号十进位范围 &#19904; ~ &#19967; 可以针对符号正确显示应用于网页中、及 SVG 向量图形下载。

䷀干为天䷀
䷁坤为地䷁
䷂水雷屯䷂
䷃山水蒙䷃
䷄水天需䷄
䷅天水讼䷅
䷆地水师䷆
䷇水地比䷇
䷈风天小畜䷈
䷉天泽履䷉
䷊地天泰䷊
䷋天地否䷋
䷌天火同人䷌
䷍火天大有䷍
䷎地山谦䷎
䷏雷地豫䷏
䷐泽雷随䷐
䷑山风蛊䷑
䷒地泽临䷒
䷓风地观䷓
䷔火雷噬嗑䷔
䷕山火贲䷕
䷖山地剥䷖
䷗地雷復䷗
䷘天雷无妄䷘
䷙山天大畜䷙
䷚山雷颐䷚
䷛泽风大过䷛
䷜坎为水䷜
䷝离为火䷝
䷞泽山咸䷞
䷟雷风恆䷟
䷠天山遯䷠
䷡雷天大壮䷡
䷢火地晋䷢
䷣地火明夷䷣
䷤风火家人䷤
䷥火泽睽䷥
䷦水山蹇䷦
䷧雷水解䷧
䷨山泽损䷨
䷩风雷益䷩
䷪泽天夬䷪
䷫天风姤䷫
䷬泽地萃䷬
䷭地风升䷭
䷮泽水困䷮
䷯水风井䷯
䷰泽火革䷰
䷱火风鼎䷱
䷲震为雷䷲
䷳艮为山䷳
䷴风山渐䷴
䷵雷泽归妹䷵
䷶雷火丰䷶
䷷火山旅䷷
䷸巽为风䷸
䷹兑为泽䷹
䷺风水涣䷺
䷻水泽节䷻
䷼风泽中孚䷼
䷽雷山小过䷽
䷾水火既济䷾
䷿火水未济䷿

JavaScript createElementNS 建立 SVG 图形下载

栏位以二进位输入 1 = 阳、0 = 阴、阴爻符号「六个字元」来表示，再依照顺序使用 <rect> 绘制 SVG 图形。

八卦特殊符号，以下为页面中使用 JavaScript 进行 SVG 元素动态建立处理方式及产生 SVG 下载的程式码。

JavaScript 建立 SVG 子元素

使用 document.createElementNS 函数，创建具有指定的 SVG 子元素，须使用 createElementNS namespace 命名空间函数及 setAttribute 设置子元素的基本属性。

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

namespaceURI 指定与元素相关联的命名空间URI的字元串。创建的元素使用 namespaceURI 进行初始化。
qualifiedName 指定创建元素类型的字符串。元素的 nodeName 属性使用 qualifiedName 类型进行初始化。
options 可选项目、包含单个属性的 ElementCreationOptions 对象，是预先使用 customElements.define() 自定义元素标签名称。新元素将被赋予属性，其值是自定义元素的标签名称。

var svg = document.querySelector("SVG");
var newElement = document.createElementNS("http://www.w3.org/2000/svg", "rect");
newElement.setAttribute("x", "100");
newElement.setAttribute("y", "240");
newElement.setAttribute("width", "160");
newElement.setAttribute("height", "40");
newElement.style.fill = "#333333";
svg.appendChild(newElement);

JavaScript Save/Export 提供 SVG 下载

JavaScript 的 createElementNS 方法可以用来建立 SVG 图形的描述。这个方法需要两个参数 namespaceURI 和 qualifiedName。namespaceURI 是指定元素所属的命名空间、qualifiedName 是指定元素的类型。createElementNS 方法会回传新建的元素，可以使用 appendChild 或 insertBefore 等方法将它加入到当前网页的文件中。

于页面中使用 Button 按钮及 Blob 来指引下载 <SVG> 图形，将 createElement <a> downloadLink 附加到 document.body 并且在 click() 点选按钮之后将其删除，JavaScript 函数为网路上 stackoverflow.com 搜寻到的 <SVG> Download 下载方式。

JavaScript URL.createObjectURL() 静态方法会创建 DOMString 其中包含表示参数中给出的 URL 对象。其生命周期和创建时的 document 绑定。这个新的 URL 对象表示指定的 File 对象或 Blob 对象。revokeObjectURL() 销毁之前使用 URL.createObjectURL() 方法创建的 URL 实例。

function downloadSVG(svgElement, name) {
  svgElement.setAttribute("xmlns", "http://www.w3.org/2000/svg");
  var svgHtmlData = svgElement.outerHTML;
  var svgFormat = '<?xml version="1.0" standalone="no"?>\r\n';
  var convertBlob = new Blob([svgFormat, svgHtmlData], {
    type: "image/svg+xml;charset=utf-8"
  });
  var svgUrl = URL.createObjectURL(convertBlob);
  var downloadLink = document.createElement("a");
  downloadLink.href = svgUrl;
  downloadLink.download = name;
  document.body.appendChild(downloadLink);
  downloadLink.click();
  document.body.removeChild(downloadLink);
}

var svg = document.querySelector("SVG");
var gFileName = currentFile + ".svg";
downloadSVG(svg, gFileName)