svg+css实现卡车行驶动画效果代码
代码语言：html
所属分类：动画
代码描述：svg+css实现卡车行驶动画效果代码，点击鼠标可实现卡车前轮飞起来加速效果。
下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<style>
/* Background */
.bg-obj {
width: 100%;
height: 100vh;
display: flex;
justify-content: center;
align-items: center;
background: #df9aff;
background: rgb(223,154,255);
background: radial-gradient(circle, rgba(223,154,255,1) 48%, rgba(178,121,204,1) 83%);
}
/* Car */
.car-obj {
position: absolute;
top: calc(50% + 5px);
left: 50%;
transform: translate(-50%, -50%);
transform-origin: 50px 0;
transition: all 0.4s ease;
}
/* Events */
.car-obj.on {
transform: translate(-50%, -50%) rotate(-25deg);
}
.road-object {
width: 40%;
height: 3px;
background: rgba(0, 0, 0, 0.41);
position: absolute;
top: calc(50% + 52px);
left: 50%;
transform: translate(-50%, -50%);
box-shadow: 0px 8px 15px 1px #000000;
}
.streetlgiht {
position: absolute;
top: calc(50% - 2px);
left: 50%;
transform: translate(100%, -50%);
animation: moveBack 2s ease infinite;
}
.buildings {
position: absolute;
top: calc(50% - 50px);
left: 50%;
transform: translate(100%, -50%);
animation: moveBack 4s ease infinite;
}
.canvas {
width: 40%;
height: 170px;
display: flex;
justify-content: center;
position: relative;
overflow: hidden;
}
@keyframes moveBack {
100% {
transform: translate(-150%, -50%);
}
}
#tfront {
animation: frontwheelanim 1s ease infinite;
}
#tback {
animation: backwheelanim 1s ease 0.2s infinite;
}
@keyframes frontwheelanim {
80% {
transform: matrix(4.0764314, 0, 0, 4.0764314, -254.34846, -309.01206);
}
}
@keyframes backwheelanim {
80% {
transform: matrix(4.0764314, 0, 0, 4.0764314, -278.31911, -308.68738);
}
}
@media screen and (max-width: 600px) {
body {
background:#000000;
}
}
@media screen and (min-width: 1620px) {
.canvas {
width: 500px;
}
.road-object {
width: 500px;
}
}
</style>
</head>
<body >
<!-- Added SVG for base images -->
<div class="bg-obj">
<div class="canvas">
<div class="buildings">
<svg width="793.70081" height="205" viewBox="0 0 210 54.239584" version="1.1" id="svg48026">
<defs id="defs48023" />
<g inkscape:label="Layer 1" inkscape:groupmode="layer" id="layer1">
<g id="g51584" transform="translate(-6.3622202,-243.49951)">
<g id="g51074">
<g id="g50732" transform="matrix(1.0952269,0,0,1.3788085,6.791161,-112.4593)">
<rect style="fill:#deb5ff;fill-opacity:1;stroke-width:0.518991;stroke-linecap:round" id="rect50710" width="15.031741" height="31.309727" x="29.611851" y="265.56665" />
<g id="g50720">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50712" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50714" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50716" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50718" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
<g id="g50730" transform="translate(6.3499991)">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50722" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50724" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50726" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50728" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
<rect style="fill:#deb5ff;fill-opacity:1;stroke-width:0.518991;stroke-linecap:round" id="rect50734" width="15.031741" height="31.309727" x="76.849411" y="265.41833" />
<g id="g50744" transform="translate(47.237556,-0.14830885)">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50736" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50738" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50740" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50742" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
<g id="g50754" transform="translate(53.587555,-0.14830885)">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50746" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50748" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50750" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50752" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
</g>
<rect style="fill:#de99ff;fill-opacity:1;stroke-width:0.769673;stroke-linecap:round" id="rect49510" width="20.960173" height="49.384216" x="7.0548878" y="247.63676" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.31345;stroke-linecap:round" id="rect49875" width="4.2942786" height="39.977699" x="9.1840849" y="254.25218" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.31345;stroke-linecap:round" id="rect49877" width="4.2942786" height="39.977699" x="15.403072" y="254.14995" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.31345;stroke-linecap:round" id="rect49879" width="4.2942786" height="39.977699" x="21.248964" y="254.14995" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.31345;stroke-linecap:round" id="rect50607" width="4.2942786" height="39.977699" x="15.403072" y="254.14995" />
<rect style="fill:#de99ff;fill-opacity:1;stroke-width:0.144426;stroke-linecap:round" id="rect50609" width="11.706035" height="3.1135249" x="11.681956" y="244.52797" />
<g id="g50708">
<rect style="fill:#de99ff;fill-opacity:1;stroke-width:0.518991;stroke-linecap:round" id="rect50611" width="15.031741" height="31.309727" x="29.611851" y="265.56665" />
<g id="g50685">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50613" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50623" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50625" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50627" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
<g id="g50695" transform="translate(6.3499991)">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50687" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50689" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50691" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50693" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
</g>
<rect style="fill:#de99ff;fill-opacity:1;stroke-width:0.769673;stroke-linecap:round" id="rect50756" width="20.960173" height="49.384216" x="58.790733" y="247.43228" />
<rect style="fill:#de99ff;fill-opacity:1;stroke-width:0.144426;stroke-linecap:round" id="rect50766" width="11.706035" height="3.1135249" x="63.417801" y="244.32349" />
<g id="g50790" transform="translate(51.735843,-0.2044895)">
<g id="g50802" transform="translate(-19.737342,-19.665044)">
<g id="g50778">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50770" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50772" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50774" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50776" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
<g id="g50788" transform="translate(6.3499991)">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50780" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50782" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50784" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50786" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
</g>
</g>
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.229317;stroke-linecap:round" id="rect50804" width="4.2942786" height="21.397125" x="63.479851" y="275.43549" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.229317;stroke-linecap:round" id="rect50806" width="4.2942786" height="21.397125" x="70.20356" y="275.50778" />
<g id="g50852" transform="matrix(1.0952269,0,0,1.3788085,6.791161,-112.4593)">
<rect style="fill:#deb5ff;fill-opacity:1;stroke-width:0.518991;stroke-linecap:round" id="rect50808" width="15.031741" height="31.309727" x="29.611851" y="265.56665" />
<g id="g50818">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50810" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50812" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50814" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50816" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
<g id="g50828" transform="translate(6.3499991)">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50820" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50822" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50824" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50826" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
<rect style="fill:#deb5ff;fill-opacity:1;stroke-width:0.518991;stroke-linecap:round" id="rect50830" width="15.031741" height="31.309727" x="76.849411" y="265.41833" />
<g id="g50840" transform="translate(47.237556,-0.14830885)">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50832" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50834" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50836" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50838" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
<g id="g50850" transform="translate(53.587555,-0.14830885)">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50842" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50844" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50846" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50848" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
</g>
<rect style="fill:#de99ff;fill-opacity:1;stroke-width:0.769673;stroke-linecap:round" id="rect50854" width="20.960173" height="49.384216" x="7.0548878" y="247.63676" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.31345;stroke-linecap:round" id="rect50856" width="4.2942786" height="39.977699" x="9.1840849" y="254.25218" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.31345;stroke-linecap:round" id="rect50858" width="4.2942786" height="39.977699" x="15.403072" y="254.14995" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.31345;stroke-linecap:round" id="rect50860" width="4.2942786" height="39.977699" x="21.248964" y="254.14995" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.31345;stroke-linecap:round" id="rect50862" width="4.2942786" height="39.977699" x="15.403072" y="254.14995" />
<rect style="fill:#de99ff;fill-opacity:1;stroke-width:0.144426;stroke-linecap:round" id="rect50864" width="11.706035" height="3.1135249" x="11.681956" y="244.52797" />
<g id="g50888">
<rect style="fill:#de99ff;fill-opacity:1;stroke-width:0.518991;stroke-linecap:round" id="rect50866" width="15.031741" height="31.309727" x="29.611851" y="265.56665" />
<g id="g50876">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50868" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50870" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50872" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50874" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
<g id="g50886" transform="translate(6.3499991)">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50878" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50880" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50882" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50884" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
</g>
<rect style="fill:#de99ff;fill-opacity:1;stroke-width:0.769673;stroke-linecap:round" id="rect50890" width="20.960173" height="49.384216" x="58.790733" y="247.43228" />
<rect style="fill:#de99ff;fill-opacity:1;stroke-width:0.144426;stroke-linecap:round" id="rect50892" width="11.706035" height="3.1135249" x="63.417801" y="244.32349" />
<g id="g50918" transform="translate(51.735843,-0.2044895)">
<g id="g50916" transform="translate(-19.737342,-19.665044)">
<g id="g50904">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50896" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50898" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50900" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50902" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
<g id="g50914" transform="translate(6.3499991)">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50906" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50908" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50910" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50912" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
</g>
</g>
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.229317;stroke-linecap:round" id="rect50920" width="4.2942786" height="21.397125" x="63.479851" y="275.43549" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.229317;stroke-linecap:round" id="rect50922" width="4.2942786" height="21.397125" x="70.20356" y="275.50778" />
<g id="g50946" transform="translate(53.35589)">
<rect style="fill:#de99ff;fill-opacity:1;stroke-width:0.518991;stroke-linecap:round" id="rect50924" width="15.031741" height="31.309727" x="29.611851" y="265.56665" />
<g id="g50934">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50926" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50928" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50930" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50932" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
<g id="g50944" transform="translate(6.3499991)">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50936" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50938" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50940" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect50942" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
</g>
</g>
<g id="g51328" transform="translate(102.5185,-0.28919182)">
<g id="g51120" transform="matrix(1.0952269,0,0,1.3788085,6.791161,-112.4593)">
<rect style="fill:#deb5ff;fill-opacity:1;stroke-width:0.518991;stroke-linecap:round" id="rect51076" width="15.031741" height="31.309727" x="29.611851" y="265.56665" />
<g id="g51086">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51078" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51080" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51082" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51084" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
<g id="g51096" transform="translate(6.3499991)">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51088" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51090" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51092" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51094" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
<rect style="fill:#deb5ff;fill-opacity:1;stroke-width:0.518991;stroke-linecap:round" id="rect51098" width="15.031741" height="31.309727" x="76.849411" y="265.41833" />
<g id="g51108" transform="translate(47.237556,-0.14830885)">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51100" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51102" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51104" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51106" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
<g id="g51118" transform="translate(53.587555,-0.14830885)">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51110" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51112" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51114" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51116" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
</g>
<rect style="fill:#de99ff;fill-opacity:1;stroke-width:0.769673;stroke-linecap:round" id="rect51122" width="20.960173" height="49.384216" x="7.0548878" y="247.63676" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.31345;stroke-linecap:round" id="rect51124" width="4.2942786" height="39.977699" x="9.1840849" y="254.25218" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.31345;stroke-linecap:round" id="rect51126" width="4.2942786" height="39.977699" x="15.403072" y="254.14995" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.31345;stroke-linecap:round" id="rect51128" width="4.2942786" height="39.977699" x="21.248964" y="254.14995" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.31345;stroke-linecap:round" id="rect51130" width="4.2942786" height="39.977699" x="15.403072" y="254.14995" />
<rect style="fill:#de99ff;fill-opacity:1;stroke-width:0.144426;stroke-linecap:round" id="rect51132" width="11.706035" height="3.1135249" x="11.681956" y="244.52797" />
<g id="g51156">
<rect style="fill:#de99ff;fill-opacity:1;stroke-width:0.518991;stroke-linecap:round" id="rect51134" width="15.031741" height="31.309727" x="29.611851" y="265.56665" />
<g id="g51144">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51136" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51138" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51140" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51142" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
<g id="g51154" transform="translate(6.3499991)">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51146" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51148" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51150" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51152" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
</g>
<rect style="fill:#de99ff;fill-opacity:1;stroke-width:0.769673;stroke-linecap:round" id="rect51158" width="20.960173" height="49.384216" x="58.790733" y="247.43228" />
<rect style="fill:#de99ff;fill-opacity:1;stroke-width:0.144426;stroke-linecap:round" id="rect51160" width="11.706035" height="3.1135249" x="63.417801" y="244.32349" />
<g id="g51184" transform="translate(51.735843,-0.2044895)">
<g id="g51182" transform="translate(-19.737342,-19.665044)">
<g id="g51170">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51162" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51164" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51166" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51168" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
<g id="g51180" transform="translate(6.3499991)">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51172" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51174" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51176" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51178" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
</g>
</g>
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.229317;stroke-linecap:round" id="rect51186" width="4.2942786" height="21.397125" x="63.479851" y="275.43549" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.229317;stroke-linecap:round" id="rect51188" width="4.2942786" height="21.397125" x="70.20356" y="275.50778" />
<g id="g51234" transform="matrix(1.0952269,0,0,1.3788085,6.791161,-112.4593)">
<rect style="fill:#deb5ff;fill-opacity:1;stroke-width:0.518991;stroke-linecap:round" id="rect51190" width="15.031741" height="31.309727" x="29.611851" y="265.56665" />
<g id="g51200">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51192" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51194" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51196" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51198" width="4.2942786" height="3.8287218" x="31.741047" y="270.78232" />
</g>
<g id="g51210" transform="translate(6.3499991)">
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51202" width="4.2942786" height="3.8287218" x="31.741047" y="290.25656" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51204" width="4.2942786" height="3.8287218" x="31.741047" y="283.74976" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id="rect51206" width="4.2942786" height="3.8287218" x="31.741047" y="277.53214" />
<rect style="fill:#ce8eed;fill-opacity:1;stroke-width:0.0970033;stroke-linecap:round" id=".........完整代码请登录后点击上方下载按钮下载查看
热门代码搜索
其他语言代码库
Html代码库
Python代码库
Java代码库
Php代码库
Phpcli代码库
Golang代码库
C#代码库
Nodejs代码库
C代码库
C++代码库
Sql代码库
R代码库
Rust代码库
Ruby代码库
Dart代码库
Vb代码库
D代码库
F#代码库
Typescript代码库
Coffeescript代码库
Julia代码库
Kotlin代码库
Perl代码库
Groovy代码库
Lua代码库
Vala代码库
Ocaml代码库
Assembly代码库
Objectc代码库
Scala代码库
Erlang代码库
Pascal代码库
Swift代码库
Fortran代码库
Bash代码库
Clojure代码库
Ada代码库
Elixir代码库
Cobol代码库
Haskell代码库
Nim代码库
Racket代码库
Lisp代码库
网友评论0