实现5760px*2160px尺寸的大屏
九水厂3D水电平衡录制
九水厂3D驾驶舱录制
在UI的切图将那些拐弯的线保存为svg格式然后文件里的代码复制到项目中，
以下的代码可以实现一段渐变色再路径上跑动：
<svg width="408px" height="339px" viewBox="0 0 408 329" xmlns="http://www.w3.org/2000/svg"xmlns:xlink="http://www.w3.org/1999/xlink"><defs><!-- 定义渐变色 --><linearGradient x1="50%" y1="19.9646564%" x2="0%" y2="78.4528223%" id="linearGradient-1"><stop stop-color="#25F9FA" offset="0%"></stop><stop stop-color="#10F1F2" stop-opacity="0" offset="100%"></stop></linearGradient></defs><g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="水电平衡-流程切图" transform="translate(-421.000000, -1047.000000)"><!-- 现有路径 --><pathd="M407.24439,1375 L577,1375 C590.254834,1375 601,1364.25483 601,1351 L601,1068.11713 C601,1057.07143 609.954305,1048.11713 621,1048.11713 L829,1048.11713 L829,1048.11713"stroke="url(#linearGradient-1)" stroke-width="2"/><!-- 新增的渐变色光束路径 --><pathd="M407.24439,1375 L577,1375 C590.254834,1375 601,1364.25483 601,1351 L601,1068.11713 C601,1057.07143 609.954305,1048.11713 621,1048.11713 L829,1048.11713 L829,1048.11713"stroke="url(#linearGradient-1)"stroke-width="3"stroke-linecap="round"stroke-linejoin="round"stroke-dasharray="30, 200"stroke-dashoffset="3000"lengthAdjust="spacingAndGlyphs"><animate attributeName="stroke-dashoffset" from="1000" to="0" dur="15s" keyTimes="0;5"repeatCount="indefinite"/></path></g></g></svg>
以下的代码可以实现一个水滴状在路径上跑动，并且自动旋转指向：
<svg width="528px" height="97px" overflow="visible" viewBox="0 0 528 97" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="水电平衡-流程切图" transform="translate(-4268.000000, -1254.000000)" stroke="#00A534" stroke-width="2"><pathd="M4269.67268 1253.999996L4269.67268 1328.999996C4269.6791 1340.0431859999999 4278.62949 1348.9964559999999 4289.67268 1349.006416L4770.98155 1349.1607359999998C4784.23639 1349.1726859999999 4794.985 1338.430966 4794.98925 1325.176136C4794.98925 1325.173566 4794.98925 1325.171006 4794.98155 1325.168436L4794.98155 1253.999996L4794.98155 1253.999996"id="linePathGreen-2"></path><!-- 图片元素 --><image transform="translate(-19,-15.5)" width="38" height="31" xlink:href="../../../assets/hydropower/water/water-green.png"><animateMotion repeatCount="indefinite" dur="6s" rotate="auto"><mpath href="#linePathGreen-2" /></animateMotion></image></g></g></svg>