通过这个小案例熟悉一下svg中的一些属性
<svg id="svg">
<defs id = 'defs'></defs>
<g stroke = 'plum' stroke-width = '2'>
<!--x轴-->
<line x1 = '50' y1 = '550' x2 = '750' y2 = '550'></line>
<line x1 = '740' y1 = '540' x2 = '750' y2 = '550'></line>
<line x1 = '740' y1 = '560' x2 = '750' y2 = '550'></line>
<!--Y轴-->
<line x1 = '50' y1 = '50' x2 = '50' y2 = '550'></line>
<line x1 = '50' y1 = '50' x2 = '40' y2 = '60'></line>
<line x1 = '50' y1 = '50' x2 = '60' y2 = '60'></line>
</g>
</svg>
<script>
//准备数据 ===服务器中
var data = [
{
"department":"部门1","value":250},
{
"department":"部门2","value":470},
{
"department":"部门3"