D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
katsumitakano
Full window
Github gist
二次ベジェ曲線
<!doctype html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> body{ width: 960px; height: 500px; } </style> </head> <body> <svg width="960" height="500"> <g transform="translate(10,10)"> <path stroke="black" fill="none" d=" M 0,0 Q 100,300 200,200 "></path> <!-- 以下は付加情報 --> <circle cx="0" cy="0" r="5" fill="black"></circle> <text x="0" y="0" dx="10" dy="10" fill="red">M0, 0</text> <circle cx="100" cy="300" r="10" fill="blue"></circle> <text x="100" y="300" dx="10" dy="10" fill="red">Q100, 300</text> <circle cx="200" cy="200" r="5" fill="black"></circle> <text x="200" y="200" dx="10" dy="10" fill="red">200, 200</text> <line x1="0" y1="0" x2="100" y2="300" stroke="black" stroke-dasharray="5 5" opacity="0.2"></line> <line x1="100" y1="300" x2="200" y2="200" stroke="black" stroke-dasharray="5 5" opacity="0.2"></line> </g> </svg> </body> </html>