svg webtopo原型（1）基本功能
考虑到svg也是html5的标准之一，考虑继续抽空把svg的topo原型移植完。
阻力：已经有webtopology开源包了，实现的功能基本类似
参照vml模型的顺序，先实现基本的文本和画线功能。
之前在前期探索中，已经完成了画矩形、画线的探索，包括ie/opera的兼容，中文处理等。因此基本功能还算顺利。
主要实现文本、线条的显示。
以及基本的js操作的简单封装。
兼容ie+asv和opera。
其中ie使用embed,opera动态创建。
注意：在opera上，如果不指定style,默认的线是看不见的。
测试页面1basic.htm
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>
图例
</title>
<!-- legengd.html
1.显示文字、线
2.兼容ie和opera.ie用embed（empty.svg,只包含一个组g1）,
opera用create
-->
</head>
<script type="text/javascript" language="javascript" src=".\js\svg.js"></script>
<script>
</script>
<body bgcolor="#ffffff">
<div id="divsvg">
<embed name="svg1" pluginspage="http://www.adobe.com/svg/viewer/install/" align="top" src="empty.svg" height=10 width=10 type="image/svg+xml">
</div>
</body>
<script>
var svg;
var plat;
function show(){
//var svg;
//ie使用embed方式预先加载svg
svg=initSVG(200,200,1);
var svgdoc;
svgdoc=getSVGDocument(svg);
plat=getrootg(svg,svgdoc);
//位置为相对位置
//超出范围会被截掉
//生成一行文本
curentStyle="stroke:black;fill:white";
createText(svgdoc,5,20,"电路带宽图例",curentStyle);
//生成一个矩形
curentStyle="stroke:black;fill:green";
createrect(svgdoc,100,100,3,curentStyle);
//生成一条线
curentStyle="stroke:black;fill:none;stroke-width:1";
createline(svgdoc,0,0,200,0,curentStyle);
curentStyle="stroke:red;fill:none;stroke-width:3";
createline(svgdoc,0,0,0,200,curentStyle);
curentStyle="stroke:blue;fill:none;stroke-width:5";
createline(svgdoc,0,0,200,200,curentStyle);
curentStyle="stroke:#3366ff;fill:red;stroke-width:5";
createline(svgdoc,100,0,100,200,curentStyle);
}
</script>
</html>
空的svg,只包含一个g1,作为底层。同时设置编码，可以支持中文显示
empty.svg
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd" >
<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink">
<g id="g1">
</g>
</svg>
基本封装的svg.js
http://download.csdn.net/detail/luqin1988/5005164
以研究出很多模型，包括跨浏览器移动，缩放，3D，滤镜特效，动画，弹球，绘图，以及多款SVG游戏，如需要请留言。