File size: 7,697 Bytes
a88e731 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 |
<svg viewBox="0 0 300 300" xmlns="http://www.w3.org/2000/svg">
<!-- Radial gradient background -->
<defs>
<radialGradient id="orbGlow" cx="50%" cy="50%" r="50%" fx="50%" fy="50%">
<stop offset="0%" stop-color="#7f56d9" stop-opacity="0.2"/>
<stop offset="100%" stop-color="#4a90e2" stop-opacity="0"/>
</radialGradient>
<filter id="glow" x="-20%" y="-20%" width="140%" height="140%">
<feGaussianBlur stdDeviation="8" result="blur"/>
<feComposite in="SourceGraphic" in2="blur" operator="over"/>
</filter>
<linearGradient id="lensGradient" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#4a90e2" stop-opacity="0.8"/>
<stop offset="100%" stop-color="#6f42c1" stop-opacity="0.9"/>
</linearGradient>
<clipPath id="cutout">
<path d="M110,110 L150,130 L190,110 L190,210 L110,210 Z" />
</clipPath>
</defs>
<!-- Background glow -->
<circle cx="150" cy="150" r="140" fill="url(#orbGlow)"/>
<!-- Dynamic data flow circles -->
<g opacity="0.6">
<circle cx="150" cy="150" r="120" fill="none" stroke="#4a90e2" stroke-width="1" stroke-dasharray="3,6">
<animateTransform attributeName="transform" type="rotate" from="0 150 150" to="360 150 150" dur="40s" repeatCount="indefinite"/>
</circle>
<circle cx="150" cy="150" r="90" fill="none" stroke="#7f56d9" stroke-width="1" stroke-dasharray="5,5">
<animateTransform attributeName="transform" type="rotate" from="360 150 150" to="0 150 150" dur="30s" repeatCount="indefinite"/>
</circle>
<circle cx="150" cy="150" r="60" fill="none" stroke="#00BFFF" stroke-width="1" stroke-dasharray="1,3">
<animateTransform attributeName="transform" type="rotate" from="0 150 150" to="360 150 150" dur="20s" repeatCount="indefinite"/>
</circle>
</g>
<!-- Main lens -->
<g transform="translate(150, 150)">
<g transform="rotate(-15)">
<!-- Lens outer shape -->
<ellipse cx="0" cy="0" rx="85" ry="70" fill="none" stroke="url(#lensGradient)" stroke-width="8" filter="url(#glow)"/>
<!-- Lens reflection -->
<path d="M-40,-30 Q-25,-45 -10,-30" fill="none" stroke="white" stroke-width="3" opacity="0.7"/>
<!-- Lens inner details -->
<ellipse cx="0" cy="0" rx="65" ry="50" fill="none" stroke="#00BFFF" stroke-width="2" stroke-dasharray="2,4" opacity="0.7"/>
</g>
</g>
<!-- Floating papers -->
<g>
<!-- Paper 1 with data visualization -->
<g transform="translate(90, 130) rotate(-15) skewX(5)">
<rect x="0" y="0" width="70" height="90" fill="white" stroke="#4a90e2" stroke-width="1" rx="3"/>
<line x1="10" y1="15" x2="60" y2="15" stroke="#6f42c1" stroke-width="2"/>
<line x1="10" y1="25" x2="40" y2="25" stroke="#6f42c1" stroke-width="2"/>
<!-- Bar chart on paper -->
<rect x="15" y="40" width="10" height="30" fill="#00BFFF" opacity="0.7"/>
<rect x="30" y="35" width="10" height="35" fill="#7f56d9" opacity="0.7"/>
<rect x="45" y="45" width="10" height="25" fill="#4a90e2" opacity="0.7"/>
<line x1="15" y1="70" x2="55" y2="70" stroke="#6f42c1" stroke-width="1"/>
</g>
<!-- Paper 2 with network -->
<g transform="translate(170, 110) rotate(10) skewX(-5)">
<rect x="0" y="0" width="70" height="90" fill="white" stroke="#7f56d9" stroke-width="1" rx="3"/>
<line x1="10" y1="15" x2="60" y2="15" stroke="#4a90e2" stroke-width="2"/>
<line x1="10" y1="25" x2="50" y2="25" stroke="#4a90e2" stroke-width="2"/>
<!-- Network diagram -->
<circle cx="20" cy="45" r="5" fill="#7f56d9" opacity="0.8"/>
<circle cx="40" cy="40" r="5" fill="#4a90e2" opacity="0.8"/>
<circle cx="50" cy="55" r="5" fill="#00BFFF" opacity="0.8"/>
<circle cx="25" cy="60" r="5" fill="#6f42c1" opacity="0.8"/>
<line x1="20" y1="45" x2="40" y2="40" stroke="#6f42c1" stroke-width="1"/>
<line x1="40" y1="40" x2="50" y2="55" stroke="#6f42c1" stroke-width="1"/>
<line x1="50" y1="55" x2="25" y2="60" stroke="#6f42c1" stroke-width="1"/>
<line x1="25" y1="60" x2="20" y2="45" stroke="#6f42c1" stroke-width="1"/>
</g>
<!-- Paper 3 with citation tree -->
<g transform="translate(130, 170) rotate(-5)">
<rect x="0" y="0" width="70" height="90" fill="white" stroke="#00BFFF" stroke-width="1" rx="3"/>
<line x1="10" y1="15" x2="60" y2="15" stroke="#7f56d9" stroke-width="2"/>
<line x1="10" y1="25" x2="45" y2="25" stroke="#7f56d9" stroke-width="2"/>
<!-- Citation tree -->
<line x1="35" y1="40" x2="35" y2="60" stroke="#4a90e2" stroke-width="2"/>
<line x1="35" y1="50" x2="20" y2="60" stroke="#4a90e2" stroke-width="2"/>
<line x1="35" y1="50" x2="50" y2="60" stroke="#4a90e2" stroke-width="2"/>
<circle cx="35" cy="40" r="5" fill="#7f56d9"/>
<circle cx="20" cy="60" r="4" fill="#00BFFF"/>
<circle cx="35" cy="60" r="4" fill="#7f56d9"/>
<circle cx="50" cy="60" r="4" fill="#00BFFF"/>
</g>
</g>
<!-- Data particles -->
<g opacity="0.8">
<circle cx="120" cy="100" r="3" fill="#4a90e2">
<animate attributeName="cy" values="100;120;100" dur="3s" repeatCount="indefinite"/>
<animate attributeName="opacity" values="0.8;0.3;0.8" dur="3s" repeatCount="indefinite"/>
</circle>
<circle cx="200" cy="150" r="2" fill="#7f56d9">
<animate attributeName="cx" values="200;180;200" dur="4s" repeatCount="indefinite"/>
<animate attributeName="opacity" values="0.8;0.4;0.8" dur="4s" repeatCount="indefinite"/>
</circle>
<circle cx="150" cy="220" r="3" fill="#00BFFF">
<animate attributeName="cy" values="220;200;220" dur="5s" repeatCount="indefinite"/>
<animate attributeName="opacity" values="0.8;0.3;0.8" dur="5s" repeatCount="indefinite"/>
</circle>
<circle cx="100" cy="170" r="2" fill="#6f42c1">
<animate attributeName="cx" values="100;120;100" dur="3.5s" repeatCount="indefinite"/>
<animate attributeName="opacity" values="0.8;0.4;0.8" dur="3.5s" repeatCount="indefinite"/>
</circle>
</g>
<!-- Connection lines representing data mapping -->
<g stroke="#7f56d9" stroke-width="1" opacity="0.6">
<line x1="120" y1="100" x2="200" y2="150">
<animate attributeName="opacity" values="0.6;0.2;0.6" dur="6s" repeatCount="indefinite"/>
</line>
<line x1="200" y1="150" x2="150" y2="220">
<animate attributeName="opacity" values="0.6;0.3;0.6" dur="5s" repeatCount="indefinite"/>
</line>
<line x1="150" y1="220" x2="100" y2="170">
<animate attributeName="opacity" values="0.6;0.2;0.6" dur="7s" repeatCount="indefinite"/>
</line>
<line x1="100" y1="170" x2="120" y2="100">
<animate attributeName="opacity" values="0.6;0.3;0.6" dur="4s" repeatCount="indefinite"/>
</line>
</g>
<!-- P letterform integrated -->
<g transform="translate(105, 115) scale(0.6) rotate(-10)">
<path d="M0,0 L0,120 M0,15 Q40,0 40,40 Q40,80 0,65" fill="none" stroke="#4a90e2" stroke-width="10" stroke-linecap="round" stroke-linejoin="round" opacity="0.8"/>
</g>
<!-- L letterform integrated -->
<g transform="translate(175, 130) scale(0.5) rotate(10)">
<path d="M0,0 L0,120 L50,120" fill="none" stroke="#7f56d9" stroke-width="10" stroke-linecap="round" stroke-linejoin="round" opacity="0.8"/>
</g>
</svg> |