svg缩放移动、移动轨迹追溯_SVG 动画示例：svg缩放移动、移动轨迹追溯

所实现的简单效果：移动轨迹刷新绘制、svg缩放/移动

使用相关技术：SVG SMIL Animation动画

*{ margin:0; padding:0;}

.main{ width: 600px; height: auto; margin: 20px auto;}

#svg1{ background-color: #ffc; border: 1px solid #900;}

/*#svg1:hover{ cursor: move;}*/

#pathborder{ stroke-width: 1; stroke: #f00; fill: none;}

#perlist_path .p{ stroke-width:1; fill:none;}

#perlist_path .p.hide{ display: none;}

#perlist_per .c{ stroke-width:1; stroke:#900; fill:#fff;}

#perlist_per .t{ fill:#900;}

#perlist_per .aM{}

刷新位置

显示路径

隐藏路径

清空所有

附件：