deepseek-v4-pro 0813 cc鹈鹕测试
lovesusu
2026-08-13 00:11
1
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>鹈鹕骑自行车 · Pelican on a Bike</title>
<style>
html, body {
margin: 0;
height: 100%;
}
body {
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(#eaf6fd, #d9f0fb);
overflow: hidden;
}
svg {
display: block;
/* 900:500 为 viewBox 宽高比，保证 SVG 不会因 flex 收缩塌缩为 0 */
width: min(900px, 100vw, calc(100vh * 1.8));
height: auto;
}
</style>
</head>
<body>
<svg viewBox="0 0 900 500" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="一只鹈鹕骑着自行车">
<defs>
<linearGradient id="skyGrad" x1="0" y1="0" x2="0" y2="1">
<stop offset="0" stop-color="#6db6ea"/>
<stop offset="1" stop-color="#d9f0fb"/>
</linearGradient>
<linearGradient id="grassGrad" x1="0" y1="0" x2="0" y2="1">
<stop offset="0" stop-color="#8ed06b"/>
<stop offset="1" stop-color="#5cb147"/>
</linearGradient>
<linearGradient id="roadGrad" x1="0" y1="0" x2="0" y2="1">
<stop offset="0" stop-color="#646a72"/>
<stop offset="1" stop-color="#545a61"/>
</linearGradient>
<radialGradient id="sunGrad" cx="0.35" cy="0.35" r="0.9">
<stop offset="0" stop-color="#ffe27a"/>
<stop offset="1" stop-color="#f7b733"/>
</radialGradient>
<radialGradient id="bodyGrad" cx="0.4" cy="0.35" r="0.95">
<stop offset="0" stop-color="#fffdf7"/>
<stop offset="0.7" stop-color="#f9efe0"/>
<stop offset="1" stop-color="#f0e0c8"/>
</radialGradient>
<linearGradient id="wingGrad" x1="0" y1="0" x2="1" y2="0">
<stop offset="0" stop-color="#fffdf7"/>
<stop offset="1" stop-color="#ead9c0"/>
</linearGradient>
<linearGradient id="beakGrad" x1="0" y1="0" x2="1" y2="0">
<stop offset="0" stop-color="#f7b733"/>
<stop offset="1" stop-color="#ea8f24"/>
</linearGradient>
<!-- 轮辐（单根，通过 use 旋转复制） -->
<line id="spoke" x1="8" y1="0" x2="47" y2="0" stroke="#7c848d" stroke-width="2"/>
<!-- 阳光射线 -->
<line id="ray" y1="-48" y2="-64" stroke="#f6c445" stroke-width="5" stroke-linecap="round"/>
<!-- 路面虚线（图案，随地面滚动） -->
<pattern id="roadDash" width="100" height="6" patternUnits="userSpaceOnUse">
<rect x="0" y="0" width="46" height="6" rx="3" fill="#f0eee6" opacity="0.9"/>
</pattern>
<!-- 草丛与小花（图案，随地面滚动） -->
<pattern id="tuftPat" width="260" height="140" patternUnits="userSpaceOnUse">
<g fill="none" stroke-linecap="round">
<path d="M 20 47 C 17 39 12 37 10 33 M 20 47 C 20 37 20 35 20 31 M 20 47 C 23 39 28 38 30 34"
stroke="#4d8f3d" stroke-width="2.5"/>
<path d="M 165 47 C 162 39 157 37 155 33 M 165 47 C 165 37 165 35 165 31 M 165 47 C 168 39 173 38 175 34"
stroke="#4d8f3d" stroke-width="2.5"/>
<g>
<path d="M 95 47 L 95 36" stroke="#4d8f3d" stroke-width="2"/>
<circle cx="95" cy="33.5" r="4" fill="#f28fb8"/>
<circle cx="95" cy="33.5" r="1.7" fill="#f7d24c"/>
</g>
<g>
<path d="M 230 47 L 230 36" stroke="#4d8f3d" stroke-width="2"/>
<circle cx="230" cy="33.5" r="4" fill="#fdf3f7"/>
<circle cx="230" cy="33.5" r="1.7" fill="#f2b13c"/>
</g>
<path d="M 60 132 C 57 124 52 122 50 118 M 60 132 C 60 122 60 120 60 116 M 60 132 C 63 124 68 123 70 119"
stroke="#4d8f3d" stroke-width="2.5"/>
<g>
<path d="M 200 132 L 200 121" stroke="#4d8f3d" stroke-width="2"/>
<circle cx="200" cy="118.5" r="4" fill="#f28fb8"/>
<circle cx="200" cy="118.5" r="1.7" fill="#f7d24c"/>
</g>
</g>
</pattern>
</defs>
<!-- ===== 天空与太阳 ===== -->
<rect x="0" y="0" width="900" height="360" fill="url(#skyGrad)"/>
<circle cx="830" cy="72" r="48" fill="#f7ce5b" opacity="0.22"/>
<g id="rays">
<use href="#ray" transform="translate(830 72) rotate(0)"/>
<use href="#ray" transform="translate(830 72) rotate(45)"/>
<use href="#ray" transform="translate(830 72) rotate(90)"/>
<use href="#ray" transform="translate(830 72) rotate(135)"/>
<use href="#ray" transform="translate(830 72) rotate(180)"/>
<use href="#ray" transform="translate(830 72) rotate(225)"/>
<use href="#ray" transform="translate(830 72) rotate(270)"/>
<use href="#ray" transform="translate(830 72) rotate(315)"/>
</g>
<circle cx="830" cy="72" r="36" fill="url(#sunGrad)"/>
<!-- ===== 云朵（视差缓动） ===== -->
<g id="cloud1" transform="translate(-100 78)" fill="#fff" opacity="0.95">
<ellipse cx="0" cy="0" rx="30" ry="14"/>
<ellipse cx="22" cy="-8" rx="24" ry="12"/>
<ellipse cx="46" cy="2" rx="26" ry="11"/>
</g>
<g id="cloud2" transform="translate(320 118)" fill="#fff" opacity="0.9">
<ellipse cx="0" cy="0" rx="38" ry="18"/>
<ellipse cx="30" cy="-10" rx="28" ry="15"/>
<ellipse cx="62" cy="2" rx="26" ry="13"/>
</g>
<g id="cloud3" transform="translate(660 62)" fill="#fff" opacity="0.65">
<ellipse cx="0" cy="0" rx="24" ry="10"/>
<ellipse cx="18" cy="-6" rx="18" ry="9"/>
</g>
<text x="28" y="52" font-family="'Comic Sans MS','Chalkboard SE','Segoe Print','Noto Sans SC',sans-serif"
font-size="26" font-weight="700" fill="#2f6d9e">Pelican Peloton</text>
<text x="30" y="76" font-family="'Noto Sans SC','PingFang SC','Microsoft YaHei',sans-serif"
font-size="15" fill="#5b93b8">鹈鹕单车队 · 全速前进！</text>
<!-- 速度线 -->
<rect x="150" y="300" width="84" height="5" rx="2.5" fill="#fff" opacity="0.3"/>
<rect x="120" y="322" width="56" height="5" rx="2.5" fill="#fff" opacity="0.22"/>
<rect x="170" y="344" width="70" height="5" rx="2.5" fill="#fff" opacity="0.26"/>
<rect x="95" y="355" width="90" height="5" rx="2.5" fill="#fff" opacity="0.16"/>
<!-- ===== 地面 ===== -->
<rect x="0" y="360" width="900" height="140" fill="url(#grassGrad)"/>
<rect x="0" y="410" width="900" height="60" fill="url(#roadGrad)"/>
<rect x="0" y="410" width="900" height="4" fill="#eceade" opacity="0.9"/>
<rect x="0" y="466" width="900" height="4" fill="#eceade" opacity="0.9"/>
<g id="dashes">
<rect x="0" y="437" width="900" height="6" fill="url(#roadDash)"/>
</g>
<g id="tufts">
<rect x="0" y="360" width="900" height="140" fill="url(#tuftPat)"/>
</g>
<!-- ===== 远处的树 ===== -->
<g id="tree1" transform="translate(-280 0)">
<rect x="-5" y="372" width="10" height="36" rx="3" fill="#8a5a36"/>
<circle cx="-22" cy="352" r="24" fill="#3f8f5c"/>
<circle cx="0" cy="336" r="28" fill="#3f8f5c"/>
<circle cx="22" cy="354" r="23" fill="#3f8f5c"/>
<circle cx="-6" cy="326" r="12" fill="#55a86c" opacity="0.85"/>
</g>
<g id="tree2" transform="translate(100 0)">
<rect x="-4" y="380" width="8" height="28" rx="3" fill="#8a5a36"/>
<circle cx="-16" cy="362" r="18" fill="#4d9a66"/>
<circle cx="0" cy="350" r="22" fill="#4d9a66"/>
<circle cx="17" cy="364" r="17" fill="#4d9a66"/>
<circle cx="-4" cy="342" r="9" fill="#63b079" opacity="0.85"/>
</g>
<g id="tree3" transform="translate(520 0)">
<rect x="-5" y="372" width="10" height="36" rx="3" fill="#8a5a36"/>
<circle cx="-20" cy="354" r="22" fill="#439563"/>
<circle cx="0" cy="338" r="27" fill="#439563"/>
<circle cx="21" cy="355" r="21" fill="#439563"/>
<circle cx="-5" cy="328" r="11" fill="#5caf79" opacity="0.85"/>
</g>
<!-- 自行车影子 -->
<ellipse cx="445" cy="452" rx="215" ry="9" fill="#000" opacity="0.13"/>
<!-- ===== 鹈鹕左腿（远侧，位于车架之后） ===== -->
<line id="thighF" x1="415" y1="250" x2="465" y2="310" stroke="#d97e48" stroke-width="11" stroke-linecap="round"/>
<line id="shinF" x1="465" y1="310" x2="419" y2="385" stroke="#d98a52" stroke-width="9.5" stroke-linecap="round"/>
<circle id="kneeF" cx="465" cy="310" r="4.5" fill="#d97e48"/>
<g id="footF" transform="translate(419 385)">
<path d="M 0 2 C 5 -2 13 -3 19 0 C 22 1 22 4 19 5 C 13 8 5 7 0 6 Z"
fill="#e08a1c" stroke="#c96f1d" stroke-width="1.4"/>
<path d="M 5 2 L 13 -1 M 5 4 L 13 6" stroke="#c96f1d" stroke-width="1.2" fill="none"/>
</g>
<!-- ===== 车轮 ===== -->
<g>
<g id="spokesR">
<use href="#spoke" transform="translate(330 380) rotate(0)"/>
<use href="#spoke" transform="translate(330 380) rotate(45)"/>
<use href="#spoke" transform="translate(330 380) rotate(90)"/>
<use href="#spoke" transform="translate(330 380) rotate(135)"/>
<use href="#spoke" transform="translate(330 380) rotate(180)"/>
<use href="#spoke" transform="translate(330 380) rotate(225)"/>
<use href="#spoke" transform="translate(330 380) rotate(270)"/>
<use href="#spoke" transform="translate(330 380) rotate(315)"/>
</g>
<circle cx="330" cy="380" r="49" fill="none" stroke="#b9c0c8" stroke-width="3"/>
<circle cx="330" cy="380" r="55" fill="none" stroke="#2f3136" stroke-width="11"/>
<circle cx="330" cy="380" r="7" fill="#2f3136"/>
<circle cx="330" cy="380" r="2.6" fill="#e9c46a"/>
</g>
<g>
<g id="spokesF">
<use href="#spoke" transform="translate(560 380) rotate(0)"/>
<use href="#spoke" transform="translate(560 380) rotate(45)"/>
<use href="#spoke" transform="translate(560 380) rotate(90)"/>
<use href="#spoke" transform="translate(560 380) rotate(135)"/>
<use href="#spoke" transform="translate(560 380) rotate(180)"/>
<use href="#spoke" transform="translate(560 380) rotate(225)"/>
<use href="#spoke" transform="translate(560 380) rotate(270)"/>
<use href="#spoke" transform="translate(560 380) rotate(315)"/>
</g>
<circle cx="560" cy="380" r="49" fill="none" stroke="#b9c0c8" stroke-width="3"/>
<circle cx="560" cy="380" r="55" fill="none" stroke="#2f3136" stroke-width="11"/>
<circle cx="560" cy="380" r="7" fill="#2f3136"/>
<circle cx="560" cy="380" r="2.6" fill="#e9c46a"/>
</g>
<!-- ===== 远侧曲柄与踏板（车架之后） ===== -->
<circle cx="445" cy="385" r="11" fill="none" stroke="#2f3136" stroke-width="4"/>
<circle cx="445" cy="385" r="5.5" fill="none" stroke="#2f3136" stroke-width="2"/>
<g id="chainDot">
<circle cx="450" cy="385" r="2.2" fill="#e9c46a"/>
</g>
<line id="armF" x1="445" y1="385" x2="419" y2="385" stroke="#383c42" stroke-width="6" stroke-linecap="round"/>
<g id="pedalF" transform="translate(419 385)">
<rect x="-11" y="-3" width="22" height="6" rx="2.5" fill="#33373d"/>
</g>
<!-- ===== 车架 ===== -->
<g stroke-linecap="round">
<line x1="445" y1="374" x2="332" y2="371" stroke="#565c64" stroke-width="2.5"/>
<line x1="445" y1="396" x2="332" y2="389" stroke="#565c64" stroke-width="2.5"/>
<path d="M 268.9 369.2 A 62 62 0 0 1 391.1 369.2" fill="none" stroke="#e04f3a" stroke-width="7"/>
<path d="M 498.9 369.2 A 62 62 0 0 1 621.1 369.2" fill="none" stroke="#e04f3a" stroke-width="7"/>
<line x1="330" y1="380" x2="445" y2="385" stroke="#e04f3a" stroke-width="7"/>
<line x1="330" y1="380" x2="420" y2="258" stroke="#e04f3a" stroke-width="6"/>
<line x1="445" y1="385" x2="420" y2="258" stroke="#e04f3a" stroke-width="7"/>
<line x1="445" y1="385" x2="535" y2="312" stroke="#e04f3a" stroke-width="7"/>
<line x1="420" y1="258" x2="524" y2="238" stroke="#e04f3a" stroke-width="6"/>
<line x1="535" y1="312" x2="524" y2="238" stroke="#2f3136" stroke-width="9"/>
<line x1="535" y1="312" x2="560" y2="380" stroke="#2f3136" stroke-width="6"/>
<line x1="524" y1="238" x2="554" y2="223" stroke="#2f3136" stroke-width="6"/>
<path d="M 554 223 Q 572 215 583 226 Q 589 231 582 234" fill="none" stroke="#2f3136" stroke-width="7"/>
<line x1="420" y1="258" x2="416" y2="247" stroke="#2f3136" stroke-width="5"/>
</g>
<ellipse cx="412" cy="243" rx="25" ry="9" transform="rotate(-6 412 243)" fill="#2f3136"/>
<path d="M 390 240 Q 412 234 432 238" stroke="#4a4f57" stroke-width="2" fill="none"/>
<circle cx="574" cy="212" r="5" fill="#f6c445" stroke="#d9a02e" stroke-width="1.5"/>
<path d="M 574 217 L 574 221" stroke="#d9a02e" stroke-width="2" stroke-linecap="round"/>
<!-- ===== 近侧曲柄与踏板（车架之前） ===== -->
<line id="armN" x1="445" y1="385" x2="471" y2="385" stroke="#4a4e55" stroke-width="6" stroke-linecap="round"/>
<g id="pedalN" transform="translate(471 385)">
<rect x="-11" y="-3" width="22" height="6" rx="2.5" fill="#3b3f45"/>
</g>
<!-- ===== 鹈鹕右腿（近侧） ===== -->
<line id="thighN" x1="425" y1="248" x2="485" y2="298" stroke="#f5a05e" stroke-width="13" stroke-linecap="round"/>
<line id="shinN" x1="485" y1="298" x2="471" y2="385" stroke="#f7ab6a" stroke-width="11" stroke-linecap="round"/>
<circle id="kneeN" cx="485" cy="298" r="5" fill="#f5a05e"/>
<g id="footN" transform="translate(471 385)">
<path d="M 0 2 C 5 -2 13 -3 19 0 C 22 1 22 4 19 5 C 13 8 5 7 0 6 Z"
fill="#f5a623" stroke="#d9761f" stroke-width="1.4"/>
<path d="M 5 2 L 13 -1 M 5 4 L 13 6" stroke="#d9761f" stroke-width="1.2" fill="none"/>
</g>
<!-- ===== 鹈鹕身体（整体随蹬踏起伏） ===== -->
<g id="pelican" transform="translate(0 0) rotate(0 420 248)">
<!-- 尾巴 -->
<path d="M 328 216 L 288 198 L 314 222 L 278 214 L 306 232 L 292 240 L 332 244 Z" fill="#f3e7d6"/>
<!-- 身体 -->
<ellipse cx="398" cy="212" rx="80" ry="50" transform="rotate(-8 398 212)" fill="url(#bodyGrad)"/>
<ellipse cx="382" cy="198" rx="30" ry="13" transform="rotate(-8 382 198)" fill="#fff" opacity="0.55"/>
<!-- 远侧翅膀 -->
<path d="M 432 188 C 400 177 362 184 340 196 C 364 204 398 206 430 203 Z" fill="#e6d1b8"/>
<!-- 脖子 -->
<path d="M 452 202 Q 490 168 500 150" fill="none" stroke="#e3cfae" stroke-width="34" stroke-linecap="round"/>
<path d="M 452 202 Q 490 168 500 150" fill="none" stroke="#f8efe1" stroke-width="29" stroke-linecap="round"/>
<!-- 红围巾（迎风飘动） -->
<g id="scarf">
<path d="M 458 190 C 432 186 404 190 372 184 C 390 196 420 198 458 197 Z" fill="#c93a34"/>
<path d="M 458 188 C 430 180 398 188 360 176 C 380 192 415 196 458 196 Z" fill="#e0453f"/>
</g>
<!-- 冠羽 -->
<path d="M 482 132 Q 466 118 470 104 Q 477 118 488 124 Z" fill="#f3e4cd"/>
<path d="M 490 126 Q 480 116 484 108 Q 489 118 494 124 Z" fill="#ecdcbf"/>
<!-- 上喙 -->
<path d="M 528 136 C 570 120 602 118 614 125 C 618 127 617 132 612 135 C 592 144 560 149 530 153 Z"
fill="url(#beakGrad)" stroke="#d9761f" stroke-width="1.5"/>
<path d="M 530 147 C 558 152 588 147 604 137" stroke="#c96f1d" stroke-width="2.5" fill="none" stroke-linecap="round"/>
<path d="M 540 133 Q 548 132 556 134" stroke="#c96f1d" stroke-width="2" fill="none" stroke-linecap="round"/>
<!-- 喉囊（随节奏摇摆） + 小鱼 -->
<g id="pouch">
<path d="M 528 152 C 560 158 592 150 603 139 C 595 173 566 194 543 192 C 525 190 513 178 507 164 Z"
fill="#f09a3c" stroke="#d9761f" stroke-width="2" opacity="0.93"/>
<path d="M 520 160 C 540 172 570 176 590 162" stroke="#f7b84f" stroke-width="2.5" fill="none"
opacity="0.8" stroke-linecap="round"/>
<g transform="translate(556 172) rotate(-6)">
<path d="M -11 0 L -19 -7 L -18 7 Z" fill="#4fb8e8"/>
<ellipse cx="0" cy="0" rx="12.5" ry="6.5" fill="#63c6f2"/>
<path d="M -3 -6 Q 0 -11 4 -7 Z" fill="#4fb8e8"/>
<circle cx="6.5" cy="-1.5" r="1.7" fill="#123047"/>
</g>
</g>
<!-- 头 -->
<ellipse cx="505" cy="148" rx="32" ry="28" transform="rotate(-10 505 148)" fill="url(#bodyGrad)"/>
<!-- 眼睛（周期性眨眼） -->
<g id="eye">
<circle cx="508" cy="140" r="8" fill="#fff"/>
<circle cx="509.5" cy="140.5" r="4" fill="#22262b"/>
<circle cx="507.5" cy="138.5" r="1.7" fill="#fff"/>
</g>
<!-- 小红帽 -->
<ellipse cx="499" cy="119" rx="23" ry="9" transform="rotate(-14 499 119)" fill="#d64541"/>
<circle cx="521" cy="113" r="4" fill="#d64541"/>
<!-- 近侧翅膀（扶住车把） -->
<g id="wingN">
<path d="M 452 212 C 500 214 550 220 580 228 C 586 230 585 236 577 237 C 540 242 495 236 458 234 C 452 233 448 227 448 220 Z"
fill="url(#wingGrad)"/>
<path d="M 470 224 C 500 228 540 230 566 229" stroke="#dcc9ac" stroke-width="1.8" fill="none" opacity="0.8"/>
<path d="M 462 218 C 490 220 530 222 566 222" stroke="#fdf6ec" stroke-width="2" fill="none" opacity="0.9"/>
</g>
</g>
</svg>
<script>
(function () {
var $ = function (id) { return document.getElementById(id); };
// 自行车几何参数
var CRANK_X = 445, CRANK_Y = 385, CRANK_R = 26; // 曲柄中心与半径
var HIP_N = { x: 425, y: 248 }; // 近侧腿髋关节
var HIP_F = { x: 415, y: 250 }; // 远侧腿髋关节
var THIGH = 78, SHIN = 88; // 大腿 / 小腿长度
var CRANK_SPEED = 6.5; // 蹬踏角速度 rad/s
var SPEED = 150; // 前进速度 px/s
var WHEEL_R = 55; // 轮子半径
var els = {
spokesR: $('spokesR'), spokesF: $('spokesF'),
armN: $('armN'), armF: $('armF'),
pedalN: $('pedalN'), pedalF: $('pedalF'),
chainDot: $('chainDot'),
thighN: $('thighN'), shinN: $('shinN'), kneeN: $('kneeN'), footN: $('footN'),
thighF: $('thighF'), shinF: $('shinF'), kneeF: $('kneeF'), footF: $('footF'),
pelican: $('pelican'), pouch: $('pouch'), wingN: $('wingN'),
scarf: $('scarf'), eye: $('eye'),
dashes: $('dashes'), tufts: $('tufts'), rays: $('rays')
};
// 云和树：逐组计算并循环回绕
var clouds = [
[$('cloud1'), 60, 78],
[$('cloud2'), 480, 118],
[$('cloud3'), 820, 62]
];
var trees = [
[$('tree1'), 60],
[$('tree2'), 440],
[$('tree3'), 860]
];
function setLine(l, x1, y1, x2, y2) {
l.setAttribute('x1', x1);
l.setAttribute('y1', y1);
l.setAttribute('x2', x2);
l.setAttribute('y2', y2);
}
// 两段骨骼逆向运动学：大腿+小腿，脚必须踩在踏板上，膝盖朝前
function solveIK(H, P) {
var dx = P.x - H.x, dy = P.y - H.y;
var d = Math.hypot(dx, dy);
var dMax = THIGH + SHIN - 1.5;
var dMin = Math.abs(THIGH - SHIN) + 1.5;
if (d > dMax) d = dMax;
else if (d < dMin) d = dMin;
var a = Math.atan2(dy, dx);
var cosPhi = (THIGH * THIGH + d * d - SHIN * SHIN) / (2 * THIGH * d);
if (cosPhi > 1) cosPhi = 1;
else if (cosPhi < -1) cosPhi = -1;
var phi = Math.acos(cosPhi);
var k1 = { x: H.x + THIGH * Math.cos(a + phi), y: H.y + THIGH * Math.sin(a + phi) };
var k2 = { x: H.x + THIGH * Math.cos(a - phi), y: H.y + THIGH * Math.sin(a - phi) };
return k1.x >= k2.x ? k1 : k2;
}
var t0 = performance.now();
function frame(now) {
var t = (now - t0) / 1000;
var th = t * CRANK_SPEED; // 曲柄角
var dist = t * SPEED; // 前进距离
// 踏板位置（近侧 th，远侧 th+180°）
var pn = { x: CRANK_X + CRANK_R * Math.cos(th), y: CRANK_Y + CRANK_R * Math.sin(th) };
var pf = { x: CRANK_X + CRANK_R * Math.cos(th + Math.PI), y: CRANK_Y + CRANK_R * Math.sin(th + Math.PI) };
// 车轮
var wa = dist / WHEEL_R * 180 / Math.PI;
els.spokesR.setAttribute('transform', 'rotate(' + wa + ' 330 380)');
els.spokesF.setAttribute('transform', 'rotate(' + wa + ' 560 380)');
// 曲柄与踏板
setLine(els.armN, CRANK_X, CRANK_Y, pn.x, pn.y);
setLine(els.armF, CRANK_X, CRANK_Y, pf.x, pf.y);
els.pedalN.setAttribute('transform', 'translate(' + pn.x + ' ' + pn.y + ')');
els.pedalF.setAttribute('transform', 'translate(' + pf.x + ' ' + pf.y + ')');
els.chainDot.setAttribute('transform', 'rotate(' + (th * 180 / Math.PI) + ' ' + CRANK_X + ' ' + CRANK_Y + ')');
// 腿（IK 保证脚不离踏板）
var kn = solveIK(HIP_N, pn);
var kf = solveIK(HIP_F, pf);
setLine(els.thighN, HIP_N.x, HIP_N.y, kn.x, kn.y);
setLine(els.shinN, kn.x, kn.y, pn.x, pn.y);
els.kneeN.setAttribute('cx', kn.x);
els.kneeN.setAttribute('cy', kn.y);
els.footN.setAttribute('transform', 'translate(' + pn.x + ' ' + pn.y + ')');
setLine(els.thighF, HIP_F.x, HIP_F.y, kf.x, kf.y);
setLine(els.shinF, kf.x, kf.y, pf.x, pf.y);
els.kneeF.setAttribute('cx', kf.x);
els.kneeF.setAttribute('cy', kf.y);
els.footF.setAttribute('transform', 'translate(' + pf.x + ' ' + pf.y + ')');
// 身体起伏 + 轻微摇摆
var bobY = 3 * Math.sin(2 * th + 0.6);
var bobX = 1.2 * Math.sin(th);
var rot = 1.4 * Math.sin(2 * th + 0.6);
els.pelican.setAttribute('transform',
'translate(' + bobX.toFixed(2) + ' ' + bobY.toFixed(2) + ') rotate(' + rot.toFixed(2) + ' 420 248)');
// 喉囊摇摆 / 翅膀微动 / 围巾飘动 / 眨眼
els.pouch.setAttribute('transform', 'rotate(' + (2.2 * Math.sin(th + 0.9)).toFixed(2) + ' 528 152)');
els.wingN.setAttribute('transform', 'rotate(' + (-2 + 3 * Math.sin(th - 0.4)).toFixed(2) + ' 452 216)');
els.scarf.setAttribute('transform', 'rotate(' + (7 * Math.sin(2 * th + 1)).toFixed(2) + ' 455 190)');
var blink = (t % 4.2) < 0.13 ? 0.08 : 1;
els.eye.setAttribute('transform',
'translate(508 140) scale(1 ' + blink + ') translate(-508 -140)');
// 地面滚动
els.dashes.setAttribute('transform', 'translate(' + (-(dist % 100)).toFixed(1) + ' 0)');
els.tufts.setAttribute('transform', 'translate(' + (-(dist % 260)).toFixed(1) + ' 0)');
// 太阳光芒缓慢旋转
els.rays.setAttribute('transform', 'rotate(' + (t * 10) + ' 830 72)');
// 云（慢速视差）
for (var i = 0; i < clouds.length; i++) {
var cx = ((clouds[i][1] - dist * 0.3) % 1100 + 1100) % 1100 - 160;
clouds[i][0].setAttribute('transform', 'translate(' + cx.toFixed(1) + ' ' + clouds[i][2] + ')');
}
// 树（与地面同速）
for (var j = 0; j < trees.length; j++) {
var tx = ((trees[j][1] - dist) % 1280 + 1280) % 1280 - 340;
trees[j][0].setAttribute('transform', 'translate(' + tx.toFixed(1) + ' 0)');
}
requestAnimationFrame(frame);
}
requestAnimationFrame(frame);
})();
</script>
</body>
</html>
不过说实在, 有点看运气, 第一次跑的(这次)就挺好, 第二次就有点一般, 同样的提示词
最新回复 (12)
-
ryuki 08-13 00:221楼 -
SherkeyXD 08-13 00:382楼绷不住了 我刚用 api 没开 max 测出来长这样
然后我让他重新生成一个
变这样了
-
lovesusu 楼主 08-13 00:393楼
-
大树 08-13 00:394楼 -
安恩 08-13 00:405楼 -
lovesusu 楼主 08-13 00:416楼
这是第二次测试的结果, 同样的提示词
-
梦_良辰 08-13 01:037楼 -
SherkeyXD 08-13 01:058楼
果然开 max 正常多了
-
lovesusu 楼主 08-13 01:059楼
-
Angel 08-13 01:0610楼
绷不住了 我刚用 api 没开 max 测出来长这样
然后我让他重新生成一个
变这样了
哈哈哈 这他喵的 绝对是来搞笑的^-^^-^^-^^-^^-^
-
Kinney Lorraine 08-13 01:0611楼来个华丽静态
-
sallyn 08-13 01:0712楼
https://codepen.io/editor/Sallyn/pen/019ff6c6-99f5-7812-8c40-90d914f56849?orientation=left&panel=files&show=split
我的be like 不知道为什么能差的这么多
* 帖子来源Linux.do
附近帖子
飞读
lovesusu
随机推荐
- 这是啥意思，没咋看懂，反而我们成偏向保护劳动者的了
- 有没有坐标杭州的佬讲讲就业现状，打算落脚了
- 甲骨文ashburn免费arm额度还是4+24
- 收到了 [email protected] 的邮件
- 成功拿下中银hk，汇丰，众安
- 美西方向的联通9929 是不是和移动一样废了？
- 为啥别人中转站储存占用几百GB甚至几TB，我的CPA丢Render Free快半年没管也啥没事？
- 看CC最新的评测 还是DC2的水准吗？除了CC还有廉价的DC2 商家吗？
- 【快跑AI】 gpt特价分组 0.08倍率 国产模型 6折 渠道180+ 保证稳定 注册送10$
- 问下大佬，我VMISS 账户有2个鸡，可以单独push其中一个不能？