d3js svg基础

        <svg width="8000" height="9000" version = "1.1">
                <!-- 矩形 -->	
                <rect x="20" y = "20" width="200" height="100" style="fill:red;stroke:blue;stroke-width:4;opacity:0.5"/>
                <rect x="300" y = "20" width="200" height="100" rx="20" ry="30" style="fill:red;stroke:blue;stroke-width:4;opacity:0.5"/>
                    <!-- 圆形 -->	
                <circle cx="150" cy="250"  r="80" style="fill:yellow;stroke:black;stroke-width:4" />
                        <!-- 椭圆-->	
                <ellipse cx="350" cy="250" rx="110" ry="80" style="fill:#33FF33;stroke:blue;stroke-width:4" />
                    <!-- 直线 线段 -->
                 <line x1="20" y1="300" x2="300" y2="400" style="stroke:black;stroke-width:4;" />
                    <!-- 多边形 折线 -->	
                <polygon points="100,20 20,90 60,160 140,160 180,90"
                    style="file:LawnGreen;stroke:black;stroke-width:3"/>

                    <!--  折线 -->	
                <!-- <polyline points="100,20+100 20,90+100 60,160+100 140,160+100 180,90+100"
                    style="file:white;stroke:black;stroke-width:3" transform="translate(200,0)"/> -->

                    <!-- 路径 -->	
                    <path d="M30,100 L270,300 M30,100 H270 M30,100 v300"
                        style="stroke:black;stroke-width:3" />
                    <!-- 圆形 -->	
                    <!-- 圆形 -->		
            </svg>
    <p>Hello World 1</p>
    <p id="myid">Hello World 2</p>
    <script src="js/d3.v4.js" charset="utf-8"></script> 
    <script>