JavaScript

语言：

JaveScriptBabelCoffeeScript

确定

window.onload = function() {

var darthvader = document.getElementById("darthvader");

var context = darthvader.getContext("2d");

// Mask - base

context.lineJoin = "round";

context.beginPath();

context.moveTo(270, 360);

context.quadraticCurveTo(270, 150, 470, 130);

context.bezierCurveTo(470, 100, 530, 100, 530, 130);

context.quadraticCurveTo(730, 150, 730, 360);

context.quadraticCurveTo(765, 440, 880, 760);

context.quadraticCurveTo(500, 950, 120, 760);

context.quadraticCurveTo(250, 380, 270, 360);

context.closePath();

context.lineWidth = 10;

context.strokeStyle = "#230000";

context.fillStyle = "#2d1821";

context.stroke();

context.fill();

context.save();

context.clip();

// helm bg back

context.beginPath();

context.moveTo(320, 600);

context.quadraticCurveTo(190, 750, 500, 880);

context.quadraticCurveTo(810, 750, 680, 600);

context.closePath();

context.fillStyle = "#30222f";

context.fill();

// helm bg face shadow left

context.beginPath();

context.moveTo(300, 565);

context.lineTo(345, 740);

context.lineTo(470, 825);

context.lineTo(500, 810);

context.closePath();

context.fillStyle = "#230d22";

context.fill();

// helm bg face shadow right

context.beginPath();

context.moveTo(700, 565);

context.lineTo(660, 705);

context.lineTo(630, 730);

context.lineTo(600, 650);

context.closePath();

context.fill();

// helm bg left

context.beginPath();

context.moveTo(240, 620);

context.quadraticCurveTo(130, 740, 360, 880);

context.lineTo(100, 880);

context.lineTo(100, 620);

context.closePath();

context.fillStyle = "#291016";

context.fill();

// helm bg right

context.beginPath();

context.moveTo(760, 620);

context.quadraticCurveTo(870, 740, 640, 880);

context.lineTo(900, 880);

context.lineTo(900, 620);

context.closePath();

context.fill();

context.beginPath();

context.arc(316, 496, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#4a4152";

context.fill();

context.beginPath();

context.arc(304, 508, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(304, 520, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(304, 532, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#200f15";

context.fill();

context.beginPath();

context.arc(292, 640, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#4a4152";

context.fill();

context.beginPath();

context.arc(292, 652, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(304, 652, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(304, 664, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(328, 724, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(328, 736, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(328, 748, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(340, 748, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(340, 760, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(364, 760, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(364, 772, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(364, 796, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(708, 640, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#200f15";

context.fill();

context.beginPath();

context.arc(708, 652, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(696, 652, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(696, 664, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(672, 712, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(672, 724, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(600, 760, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(600, 772, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(588, 772, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(588, 784, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(576, 784, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(576, 772, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(576, 796, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(564, 796, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(564, 808, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(564, 832, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(636, 760, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(636, 772, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(636, 796, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

// helm side left

context.beginPath();

context.moveTo(240, 813);

context.quadraticCurveTo(120, 750, 176, 750);

context.lineTo(291, 500);

context.quadraticCurveTo(295, 370, 385, 395);

context.lineTo(200, 200);

context.lineTo(100, 900);

context.closePath();

context.fillStyle = "#2f3447";

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(350, 370);

context.quadraticCurveTo(265, 380, 260, 480);

context.lineTo(210, 620);

context.lineTo(150, 720);

context.lineTo(170, 740);

context.closePath();

context.fillStyle = "#454f68";

context.fill();

context.beginPath();

context.moveTo(200, 490);

context.quadraticCurveTo(220, 465, 250, 465);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(200, 505);

context.quadraticCurveTo(220, 480, 265, 480);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(160, 625);

context.quadraticCurveTo(200, 600, 240, 610);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(165, 705);

context.quadraticCurveTo(175, 700, 185, 705);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.arc(296, 390, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#230000";

context.fill();

context.beginPath();

context.arc(296, 402, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(284, 402, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(284, 414, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(240, 496, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(240, 508, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(228, 508, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(228, 520, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(182, 690, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.restore();

// helm side right

context.beginPath();

context.moveTo(760, 813);

context.quadraticCurveTo(880, 750, 824, 750);

context.lineTo(709, 500);

context.quadraticCurveTo(705, 370, 615, 395);

context.lineTo(800, 200);

context.lineTo(900, 900);

context.closePath();

context.fillStyle = "#2f3447";

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(650, 370);

context.quadraticCurveTo(735, 380, 740, 480);

context.lineTo(790, 620);

context.lineTo(850, 720);

context.lineTo(830, 740);

context.closePath();

context.fillStyle = "#454f68";

context.fill();

context.beginPath();

context.moveTo(700, 475);

context.quadraticCurveTo(730, 465, 760, 480);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.arc(768, 484, 3, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#230000";

context.fill();

context.beginPath();

context.moveTo(840, 625);

context.quadraticCurveTo(800, 600, 760, 610);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(835, 705);

context.quadraticCurveTo(815, 700, 815, 705);

context.lineWidth = 5;

context.stroke();

context.restore();

// helm top highlight left

context.beginPath();

context.moveTo(250, 350);

context.lineTo(470, 420);

context.lineTo(470, 100);

context.lineTo(250, 100);

context.closePath();

context.fillStyle = "#d6deeb";

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(290, 360);

context.quadraticCurveTo(270, 180, 470, 150);

context.lineTo(470, 260);

context.quadraticCurveTo(400, 250, 390, 340);

context.quadraticCurveTo(320, 320, 290, 360);

context.closePath();

context.fillStyle = "#7489a6";

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(290, 360);

context.quadraticCurveTo(270, 180, 400, 160);

context.lineTo(420, 180);

context.lineTo(470, 180);

context.lineTo(470, 250);

context.quadraticCurveTo(335, 200, 360, 360);

context.closePath();

context.fillStyle = "#525e74";

context.fill();

context.restore();

context.beginPath();

context.arc(454, 212, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#d6deeb";

context.fill();

context.beginPath();

context.arc(454, 224, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(442, 224, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(442, 252, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(454, 252, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#230000";

context.fill();

context.beginPath();

context.arc(454, 264, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(292, 264, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(282, 308, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(282, 320, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(294, 320, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(282, 332, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(454, 360, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(454, 372, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.restore();

// helm top highlight right

context.beginPath();

context.moveTo(750, 350);

context.lineTo(530, 420);

context.lineTo(530, 100);

context.lineTo(750, 100);

context.closePath();

context.fillStyle = "#7489a6";

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(730, 360);

context.quadraticCurveTo(740, 300, 680, 220);

context.quadraticCurveTo(580, 220, 530, 160);

context.lineTo(530, 410);

context.closePath();

context.fillStyle = "#53637d";

context.fill();

context.beginPath();

context.moveTo(530, 130);

context.lineTo(530, 410);

context.quadraticCurveTo(580, 350, 640, 330);

context.quadraticCurveTo(630, 280, 580, 280);

context.quadraticCurveTo(545, 280, 545, 150);

context.closePath();

context.fillStyle = "#454f68";

context.fill();

context.beginPath();

context.arc(546, 148, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#230000";

context.fill();

context.beginPath();

context.arc(546, 160, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(546, 196, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(624, 312, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#7489a6";

context.fill();

context.beginPath();

context.arc(636, 312, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#230000";

context.fill();

context.beginPath();

context.arc(636, 324, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(570, 342, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#7489a6";

context.fill();

context.beginPath();

context.arc(570, 354, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(558, 354, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(582, 366, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#230000";

context.fill();

context.beginPath();

context.arc(570, 366, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(558, 366, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#7489a6";

context.fill();

context.beginPath();

context.arc(546, 378, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#230000";

context.fill();

context.beginPath();

context.arc(558, 378, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(546, 390, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.restore();

context.restore();

// Mask - inner side left

context.beginPath();

context.moveTo(369, 387);

context.quadraticCurveTo(290, 360, 280, 500);

context.lineTo(170, 740);

context.quadraticCurveTo(100, 750, 240, 813);

context.quadraticCurveTo(120, 750, 176, 750);

context.lineTo(291, 500);

context.quadraticCurveTo(295, 370, 385, 395);

context.lineWidth = 5;

context.fillStyle = "#7489a6";

context.stroke();

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(280, 500);

context.lineTo(291, 500);

context.lineWidth = 3;

context.stroke();

context.beginPath();

context.moveTo(170, 740);

context.lineTo(176, 750);

context.lineWidth = 3;

context.stroke();

context.restore();

// Mask - inner side right

context.beginPath();

context.moveTo(631, 387);

context.quadraticCurveTo(710, 360, 720, 500);

context.lineTo(830, 740);

context.quadraticCurveTo(900, 750, 760, 813);

context.quadraticCurveTo(880, 750, 824, 750);

context.lineTo(709, 500);

context.quadraticCurveTo(705, 370, 615, 395);

context.lineWidth = 5;

context.stroke();

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(720, 500);

context.lineTo(709, 500);

context.lineWidth = 4;

context.stroke();

context.beginPath();

context.moveTo(830, 740);

context.lineTo(824, 750);

context.lineWidth = 3;

context.stroke();

context.restore();

// Mask - chic left

context.beginPath();

context.moveTo(470, 490);

context.lineTo(350, 500);

context.quadraticCurveTo(330, 540, 300, 570);

context.quadraticCurveTo(350, 620, 370, 730);

context.quadraticCurveTo(500, 680, 470, 490);

context.closePath();

context.lineWidth = 10;

context.stroke();

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(480, 485);

context.quadraticCurveTo(410, 550, 430, 600);

context.lineTo(372, 650);

context.lineTo(372, 720);

context.lineTo(480, 580);

context.closePath();

context.fillStyle = "#525e74";

context.fill();

context.beginPath();

context.moveTo(320, 545);

context.quadraticCurveTo(356, 570, 356, 630);

context.lineTo(280, 570);

context.closePath();

context.fill();

context.beginPath();

context.arc(326, 574, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#230000";

context.fill();

context.beginPath();

context.arc(326, 586, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(338, 586, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(374, 586, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#d6deeb";

context.fill();

context.beginPath();

context.arc(374, 598, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(338, 598, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#230000";

context.fill();

context.beginPath();

context.arc(386, 646, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(386, 658, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.restore();

// Mask - chic left detail

context.beginPath();

context.moveTo(298, 570);

context.quadraticCurveTo(360, 640, 375, 650);

context.lineTo(375, 730);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(375, 650);

context.quadraticCurveTo(430, 610, 475, 550);

context.lineWidth = 5;

context.stroke();

// Mask - chic right

context.beginPath();

context.moveTo(530, 490);

context.lineTo(650, 500);

context.quadraticCurveTo(670, 540, 700, 570);

context.quadraticCurveTo(650, 620, 630, 730);

context.quadraticCurveTo(500, 680, 530, 490);

context.closePath();

context.lineWidth = 10;

context.fillStyle = "#525e74";

context.stroke();

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(680, 545);

context.quadraticCurveTo(644, 570, 644, 630);

context.lineTo(720, 570);

context.closePath();

context.fillStyle = "#2f3447";

context.fill();

context.beginPath();

context.arc(536, 504, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#230000";

context.fill();

context.beginPath();

context.arc(548, 516, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(536, 516, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(536, 528, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(596, 540, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#d6deeb";

context.fill();

context.beginPath();

context.arc(608, 540, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(620, 540, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(608, 552, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(536, 574, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#230000";

context.fill();

context.beginPath();

context.arc(536, 586, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(548, 586, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(548, 598, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(560, 622, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.restore();

// Mask - chic right detail

context.beginPath();

context.moveTo(702, 570);

context.quadraticCurveTo(640, 640, 625, 650);

context.lineTo(625, 730);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(625, 650);

context.quadraticCurveTo(570, 610, 525, 550);

context.lineWidth = 5;

context.stroke();

// Mask - Eyes left

context.beginPath();

context.moveTo(470, 490);

context.quadraticCurveTo(400, 530, 340, 500);

context.quadraticCurveTo(320, 420, 470, 430);

context.closePath();

context.lineWidth = 10;

context.fillStyle = "#314085";

context.stroke();

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(360, 440);

context.quadraticCurveTo(375, 510, 420, 530);

context.quadraticCurveTo(390, 475, 420, 415);

context.closePath();

context.fillStyle = "#58b1ed";

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(360, 440);

context.quadraticCurveTo(360, 475, 370, 470);

context.lineTo(390, 470);

context.lineTo(390, 420);

context.closePath();

context.fillStyle = "#466eb4";

context.fill();

context.beginPath();

context.moveTo(383, 475);

context.lineTo(383, 450);

context.lineWidth = 5;

context.strokeStyle = "#58b1ed";

context.stroke();

context.restore();

context.beginPath();

context.arc(438, 448, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(438, 460, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(450, 460, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(450, 472, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#fff";

context.fill();

context.restore();

// Mask - Eyes left detail top back

context.beginPath();

context.moveTo(435, 425);

context.quadraticCurveTo(325, 420, 350, 505);

context.lineTo(335, 510);

context.quadraticCurveTo(280, 410, 385, 395);

context.closePath();

context.lineWidth = 10;

context.fillStyle = "#d6deeb";

context.stroke();

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(385, 395);

context.quadraticCurveTo(300, 420, 350, 510);

context.lineTo(420, 510);

context.lineTo(420, 395);

context.closePath();

context.fillStyle = "#7489a6";

context.fill();

context.restore();

// Mask - Eyes left detail top

context.beginPath();

context.moveTo(435, 425);

context.quadraticCurveTo(325, 420, 350, 505);

context.lineTo(350, 510);

context.quadraticCurveTo(310, 420, 410, 415);

context.closePath();

context.lineWidth = 10;

context.fillStyle = "#2f3447";

context.stroke();

context.fill();

// Mask - Eyes left detail bottom

context.beginPath();

context.moveTo(470, 480);

context.quadraticCurveTo(400, 530, 340, 490);

context.lineTo(320, 510);

context.quadraticCurveTo(410, 555, 470, 490);

context.closePath();

context.lineWidth = 10;

context.fillStyle = "#7489a6";

context.stroke();

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(470, 480);

context.quadraticCurveTo(400, 530, 340, 490);

context.lineTo(320, 495);

context.quadraticCurveTo(395, 535, 460, 490);

context.closePath();

context.fillStyle = "#d6deeb";

context.fill();

context.restore();

// Mask - Eyes right

context.beginPath();

context.moveTo(530, 490);

context.quadraticCurveTo(600, 530, 660, 500);

context.quadraticCurveTo(680, 420, 530, 430);

context.closePath();

context.lineWidth = 10;

context.fillStyle = "#314085";

context.stroke();

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(580, 470);

context.lineTo(580, 530);

context.lineTo(620, 530);

context.quadraticCurveTo(605, 500, 615, 470);

context.closePath();

context.fillStyle = "#58b1ed";

context.fill();

context.beginPath();

context.moveTo(596, 475);

context.lineTo(610, 475);

context.lineWidth = 5;

context.strokeStyle = "#466eb4";

context.stroke();

context.beginPath();

context.moveTo(585, 472);

context.lineTo(585, 495);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(589, 472);

context.lineTo(589, 490);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.arc(570, 470, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.beginPath();

context.arc(570, 482, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.restore();

// Mask - Eyes right detail top back

context.beginPath();

context.moveTo(565, 425);

context.quadraticCurveTo(675, 420, 650, 505);

context.lineTo(665, 510);

context.quadraticCurveTo(720, 410, 615, 395);

context.closePath();

context.lineWidth = 10;

context.fillStyle = "#7489a6";

context.stroke();

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(615, 395);

context.quadraticCurveTo(700, 420, 650, 510);

context.lineTo(580, 510);

context.lineTo(580, 395);

context.closePath();

context.fillStyle = "#525e74";

context.fill();

context.restore();

// Mask - Eyes right detail top

context.beginPath();

context.moveTo(565, 425);

context.quadraticCurveTo(675, 420, 650, 505);

context.lineTo(650, 510);

context.quadraticCurveTo(690, 420, 590, 415);

context.closePath();

context.lineWidth = 10;

context.fillStyle = "#2f3447";

context.stroke();

context.fill();

// Mask - Eyes right detail bottom

context.beginPath();

context.moveTo(530, 480);

context.quadraticCurveTo(600, 530, 660, 490);

context.lineTo(680, 510);

context.quadraticCurveTo(590, 555, 530, 490);

context.closePath();

context.lineWidth = 10;

context.fillStyle = "#7489a6";

context.stroke();

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(530, 480);

context.quadraticCurveTo(600, 530, 660, 490);

context.lineTo(680, 495);

context.quadraticCurveTo(605, 535, 540, 490);

context.closePath();

context.fillStyle = "#454f68";

context.fill();

context.restore();

// Mask - sopraciglia left

context.lineJoin = "miter";

context.beginPath();

context.moveTo(470, 420);

context.quadraticCurveTo(270, 250, 228, 450);

context.quadraticCurveTo(290, 300, 470, 450);

context.closePath();

context.lineWidth = 10;

context.fillStyle = "#d6deeb";

context.stroke();

context.fill();

// Clip for hightlight

context.save();

context.clip();

context.beginPath();

context.moveTo(500, 450);

context.quadraticCurveTo(270, 260, 228, 450);

context.lineTo(500, 450);

context.closePath();

context.fillStyle = "#7489a6";

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(500, 450);

context.quadraticCurveTo(270, 260, 228, 450);

context.quadraticCurveTo(270, 260, 500, 470);

context.closePath();

context.fillStyle = "#525e74";

context.fill();

context.restore();

context.beginPath();

context.moveTo(300, 380);

context.quadraticCurveTo(290, 350, 315, 340);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(420, 378);

context.quadraticCurveTo(445, 400, 445, 415);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(310, 380);

context.quadraticCurveTo(310, 355, 325, 350);

context.lineWidth = 5;

context.stroke();

context.restore();

// Mask - sopraciglia right

context.beginPath();

context.moveTo(530, 420);

context.quadraticCurveTo(730, 250, 768, 450);

context.quadraticCurveTo(710, 300, 530, 450);

context.closePath();

context.lineWidth = 10;

context.fillStyle = "#7489a6";

context.stroke();

context.fill();

// Clip for hightlight

context.save();

context.clip();

context.beginPath();

context.moveTo(500, 450);

context.quadraticCurveTo(730, 260, 772, 450);

context.lineTo(500, 450);

context.closePath();

context.fillStyle = "#525e74";

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(500, 450);

context.quadraticCurveTo(730, 260, 772, 450);

context.quadraticCurveTo(730, 260, 500, 470);

context.closePath();

context.fillStyle = "#454f68";

context.fill();

context.restore();

context.beginPath();

context.moveTo(700, 380);

context.quadraticCurveTo(710, 350, 675, 340);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(580, 378);

context.quadraticCurveTo(555, 400, 555, 415);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(690, 380);

context.quadraticCurveTo(690, 355, 675, 350);

context.lineWidth = 5;

context.stroke();

context.restore();

// Mask - middle

context.lineJoin = "round";

context.beginPath();

context.moveTo(470, 130);

context.bezierCurveTo(470, 100, 530, 100, 530, 130);

context.lineTo(530, 430);

context.bezierCurveTo(530, 460, 470, 460, 470, 430);

context.lineTo(470, 430);

context.closePath();

context.lineWidth = 10;

context.fillStyle = "#d6deeb";

context.stroke();

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(470, 150);

context.lineTo(470, 330);

context.quadraticCurveTo(500, 330, 490, 480);

context.lineTo(530, 480);

context.lineTo(530, 150);

context.arc(500, 150, 30, 0, Math.PI, true);

context.closePath();

context.fillStyle = "#7489a6";

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(485, 400);

context.lineTo(485, 480);

context.lineTo(530, 480);

context.lineTo(530, 100);

context.lineTo(470, 100);

context.lineTo(470, 200);

context.quadraticCurveTo(485, 200, 485, 260);

context.quadraticCurveTo(485, 320, 510, 320);

context.lineTo(510, 360);

context.quadraticCurveTo(510, 400, 485, 400);

context.closePath();

context.fillStyle = "#53637d";

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(510, 480);

context.lineTo(530, 480);

context.lineTo(530, 160);

context.quadraticCurveTo(510, 160, 510, 180);

context.lineTo(510, 200);

context.quadraticCurveTo(525, 200, 525, 300);

context.lineTo(525, 400);

context.quadraticCurveTo(525, 480, 510, 480);

context.closePath();

context.fillStyle = "#454f68";

context.fill();

context.restore();

context.restore();

context.beginPath();

context.moveTo(470, 145);

context.lineTo(490, 145);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(470, 160);

context.lineTo(500, 160);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(470, 200);

context.lineTo(480, 200);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(470, 360);

context.lineTo(480, 360);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(470, 375);

context.lineTo(480, 375);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.arc(520, 426, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#230000";

context.fill();

context.beginPath();

context.arc(520, 438, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.restore();

// Mask - nose mid

context.beginPath();

context.moveTo(470, 452);

context.quadraticCurveTo(480, 500, 474, 550);

context.lineTo(526, 550);

context.quadraticCurveTo(520, 500, 530, 452);

context.closePath();

context.lineWidth = 10;

context.fillStyle = "#d6deeb";

context.stroke();

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(490, 460);

context.lineTo(490, 474);

context.lineTo(495, 474);

context.lineTo(495, 488);

context.lineTo(500, 488);

context.lineTo(500, 505);

context.lineTo(510, 505);

context.lineTo(510, 530);

context.lineTo(540, 530);

context.lineTo(540, 460);

context.closePath();

context.fillStyle = "#7489a6";

context.fill();

context.beginPath();

context.moveTo(510, 460);

context.lineTo(510, 474);

context.lineTo(515, 474);

context.lineTo(515, 492);

context.lineTo(518, 492);

context.lineTo(518, 510);

context.lineTo(520, 510);

context.lineTo(520, 530);

context.lineTo(540, 530);

context.lineTo(540, 460);

context.closePath();

context.fillStyle = "#454f68";

context.fill();

context.restore();

// Mask - triangle external bottom

context.lineJoin = "round";

context.beginPath();

context.moveTo(370, 730);

context.lineTo(630, 730);

context.lineTo(500, 820);

context.closePath();

context.lineWidth = 10;

context.fillStyle = "#525e74";

context.stroke();

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(370, 730);

context.lineTo(370, 820);

context.lineTo(500, 880);

context.lineTo(420, 730);

context.closePath();

context.fillStyle = "#7489a6";

context.fill();

context.beginPath();

context.moveTo(470, 730);

context.lineTo(560, 880);

context.lineTo(630, 880);

context.lineTo(630, 730);

context.closePath();

context.fillStyle = "#2f3447";

context.fill();

context.restore();

// Mask - triangle inner clip() bottom

context.beginPath();

context.moveTo(410, 745);

context.lineTo(590, 745);

context.lineTo(500, 805);

context.closePath();

context.lineWidth = 10;

context.fillStyle = "#7489a6";

context.stroke();

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(400, 770);

context.lineTo(400, 810);

context.lineTo(600, 810);

context.lineTo(600, 770);

context.closePath();

context.fillStyle = "#525e74";

context.fill();

context.beginPath();

context.moveTo(415, 730);

context.lineTo(450, 810);

context.lineWidth = 5;

context.strokeStyle = "#230000";

context.stroke();

context.beginPath();

context.moveTo(435, 730);

context.lineTo(465, 810);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(455, 730);

context.lineTo(475, 810);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(475, 730);

context.lineTo(485, 810);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(490, 730);

context.lineTo(495, 810);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(510, 730);

context.lineTo(505, 810);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(525, 730);

context.lineTo(515, 810);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(545, 730);

context.lineTo(525, 810);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(565, 730);

context.lineTo(535, 810);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(585, 730);

context.lineTo(550, 810);

context.lineWidth = 5;

context.stroke();

context.restore();

// Mask - triangle external

context.beginPath();

context.moveTo(370, 730);

context.lineTo(630, 730);

context.lineTo(500, 560);

context.closePath();

context.lineWidth = 10;

context.fillStyle = "#525e74";

context.stroke();

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(380, 560);

context.lineTo(470, 730);

context.lineTo(630, 730);

context.lineTo(630, 560);

context.closePath();

context.fillStyle = "#2f3447";

context.fill();

context.restore();

// Mask - triangle inner clip()

context.beginPath();

context.moveTo(390, 720);

context.lineTo(610, 720);

context.lineTo(500, 580);

context.closePath();

context.lineWidth = 10;

context.fillStyle = "#7489a6";

context.stroke();

context.fill();

context.save();

context.clip();

// Mask - triangle inner masked

context.beginPath();

context.moveTo(430, 700);

context.lineTo(570, 700);

context.lineTo(570, 500);

context.lineTo(430, 500);

context.closePath();

context.lineWidth = 10;

context.fillStyle = "#d6deeb";

context.stroke();

context.fill();

context.beginPath();

context.moveTo(430, 500);

context.lineTo(430, 655);

context.lineTo(440, 655);

context.lineTo(440, 660);

context.lineTo(455, 660);

context.lineTo(455, 665);

context.lineTo(470, 665);

context.lineTo(470, 675);

context.lineTo(486, 675);

context.lineTo(486, 680);

context.lineTo(530, 680);

context.lineTo(530, 675);

context.lineTo(545, 675);

context.lineTo(545, 670);

context.lineTo(560, 670);

context.lineTo(560, 665);

context.lineTo(570, 665);

context.lineTo(570, 500);

context.closePath();

context.fillStyle = "#7489a6";

context.fill();

context.beginPath();

context.moveTo(430, 500);

context.lineTo(430, 645);

context.lineTo(440, 645);

context.lineTo(440, 650);

context.lineTo(455, 650);

context.lineTo(455, 655);

context.lineTo(470, 655);

context.lineTo(470, 660);

context.lineTo(486, 660);

context.lineTo(486, 645);

context.lineTo(530, 645);

context.lineTo(530, 635);

context.lineTo(545, 635);

context.lineTo(545, 625);

context.lineTo(560, 625);

context.lineTo(560, 615);

context.lineTo(570, 615);

context.lineTo(570, 500);

context.closePath();

context.fillStyle = "#525e74";

context.fill();

context.beginPath();

context.moveTo(440, 700);

context.lineTo(440, 500);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(455, 700);

context.lineTo(455, 500);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(470, 700);

context.lineTo(470, 500);

context.lineWidth = 5;

context.stroke();

context.beginPath();

context.moveTo(481, 615);

context.lineTo(481, 500);

context.lineWidth = 5;

context.strokeStyle = "#2f3447";

context.stroke();

context.beginPath();

context.moveTo(486, 700);

context.lineTo(486, 500);

context.lineWidth = 5;

context.strokeStyle = "#230000";

context.stroke();

context.beginPath();

context.moveTo(509, 625);

context.lineTo(509, 500);

context.lineWidth = 5;

context.strokeStyle = "#2f3447";

context.stroke();

context.beginPath();

context.moveTo(514, 700);

context.lineTo(514, 500);

context.lineWidth = 5;

context.strokeStyle = "#230000";

context.stroke();

context.beginPath();

context.moveTo(525, 640);

context.lineTo(525, 500);

context.lineWidth = 5;

context.strokeStyle = "#2f3447";

context.stroke();

context.beginPath();

context.moveTo(530, 700);

context.lineTo(530, 500);

context.lineWidth = 5;

context.strokeStyle = "#230000";

context.stroke();

context.beginPath();

context.moveTo(540, 655);

context.lineTo(540, 500);

context.lineWidth = 5;

context.strokeStyle = "#2f3447";

context.stroke();

context.beginPath();

context.moveTo(545, 700);

context.lineTo(545, 500);

context.lineWidth = 5;

context.strokeStyle = "#230000";

context.stroke();

context.beginPath();

context.moveTo(555, 675);

context.lineTo(555, 500);

context.lineWidth = 5;

context.strokeStyle = "#2f3447";

context.stroke();

context.beginPath();

context.moveTo(560, 700);

context.lineTo(560, 500);

context.lineWidth = 5;

context.strokeStyle = "#230000";

context.stroke();

context.beginPath();

context.moveTo(569, 700);

context.lineTo(569, 500);

context.lineWidth = 5;

context.strokeStyle = "#2f3447";

context.stroke();

context.restore();

// Mask - nose top

context.beginPath();

context.moveTo(465, 452);

context.bezierCurveTo(465, 465, 535, 465, 535, 452);

context.closePath();

context.lineWidth = 10;

context.fillStyle = "#d6deeb";

context.stroke();

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(500, 452);

context.lineTo(500, 465);

context.lineTo(540, 465);

context.lineTo(540, 452);

context.closePath();

context.fillStyle = "#7489a6";

context.fill();

context.beginPath();

context.moveTo(520, 452);

context.lineTo(520, 465);

context.lineTo(540, 465);

context.lineTo(540, 452);

context.closePath();

context.fillStyle = "#454f68";

context.fill();

context.restore();

// Mask - nose external

context.beginPath();

context.arc(500, 550, 26, 0, Math.PI, true);

context.lineTo(474, 580);

context.lineTo(526, 580);

context.closePath();

context.lineWidth = 10;

context.fillStyle = "#7489a6";

context.stroke();

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(535, 510);

context.lineTo(465, 590);

context.lineTo(535, 590);

context.closePath();

context.fillStyle = "#454f68";

context.fill();

context.restore();

// Mask - nose

context.lineJoin = "round";

context.beginPath();

context.arc(500, 550, 14, 0, Math.PI, true);

context.lineTo(486, 570);

context.lineTo(514, 570);

context.closePath();

context.lineWidth = 10;

context.fillStyle = "#d6deeb";

context.stroke();

context.fill();

context.save();

context.clip();

context.beginPath();

context.moveTo(530, 530);

context.quadraticCurveTo(485, 530, 495, 600);

context.lineTo(530, 600);

context.closePath();

context.fillStyle = "#7489a6";

context.fill();

context.beginPath();

context.arc(508, 550, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fillStyle = "#d6deeb";

context.fill();

context.beginPath();

context.arc(508, 562, 4, 0, 2 * Math.PI, true);

context.closePath();

context.fill();

context.restore();

// Mask - nose detail

context.beginPath();

context.arc(500, 500, 27, 0, Math.PI, true);

context.lineWidth = 4;

context.stroke();

context.beginPath();

context.arc(500, 515, 27, 0, Math.PI, true);

context.lineWidth = 4;

context.stroke();

context.beginPath();

context.arc(500, 530, 27, 0, Math.PI, true);

context.lineWidth = 4;

context.stroke();

// Mask - line circle back left

context.beginPath();

context.moveTo(366, 740);

context.lineTo(310, 680);

context.lineWidth = 5;

context.strokeStyle = "#200f15";

context.stroke();

context.beginPath();

context.moveTo(366, 730);

context.lineTo(310, 670);

context.lineWidth = 5;

context.strokeStyle = "#7489a6";

context.stroke();

// Mask - line circle back right

context.beginPath();

context.moveTo(634, 740);

context.lineTo(690, 680);

context.lineWidth = 5;

context.strokeStyle = "#200f15";

context.stroke();

context.beginPath();

context.moveTo(634, 730);

context.lineTo(690, 670);

context.lineWidth = 5;

context.strokeStyle = "#7489a6";

context.stroke();

// Mask - triangle circle left

context.beginPath();

context.arc(366, 730, 8, 0, 2 * Math.PI, true);

context.closePath();

context.lineWidth = 10;

context.strokeStyle = "#230000";

context.stroke();

context.fill();

// Mask - triangle circle right

context.beginPath();

context.arc(634, 730, 8, 0, 2 * Math.PI, true);

context.closePath();

context.lineWidth = 10;

context.stroke();

context.fill();

};

头像星球html,HTML5 Canvas 星球大战黑武士头像相关推荐

  1. 谷歌开放其数据中心 惊现星球大战“黑武士”

    摘要:数据中心一直是很多大公司的"王牌",一般不愿意轻易示人,而且动用各种手段来保持数据中心的神秘性.今天谷歌开始解开了数据中心的面纱,甚至做了一个谷歌街景来展示这些位于世界各地的 ...

  2. 原力觉醒！《星球大战》黑武士要出VR电影

    卢卡斯将联手"超蝙"编剧制作<星球大战>VR电影,该电影情节围绕黑武士达斯•维达的故事展开. 在最近召开的星球大战庆典上,卢卡斯影业创意总监Pablo Hidalgo称 ...

  3. html5 canvas 头像上传

    html5 canvas 头像上传 <html> <head> <meta http-equiv="Content-Type" content=&qu ...

  4. 字 掉落 炫酷 网站_16个富有创意的HTML5 Canvas动画特效集合

    本文作者html5tricks,转载请注明出处 1.HTML5 Canvas高空瀑布下落湖面动画 HTML5 Canvas是一个神奇的网页技术,我们在Canvas画布上可以做任何有趣的事情.今天要分享 ...

  5. HTML5 canvas画图

    HTML5 canvas画图 HTML5 <canvas> 标签用于绘制图像(通过脚本,通常是 JavaScript). 不过,<canvas> 元素本身并没有绘制能力(它仅仅 ...

  6. HTML5 Canvas

    HTML5 Canvas 转自:https://blog.csdn.net/u012468376/article/details/73350998 一.canvas简介 ​  <canvas&g ...

  7. html5 canvas消除锯齿,HTML5 Canvas 如何取消反锯齿绘图

    一.问题的提出 我们都知道反锯齿(anti-aliasing)绘图给我们带来更好的视觉体验,有了这个技术,绘制的图形的边缘再不是以前毛毛躁躁的样子了.这就是采用反锯齿算法的功劳.其实质就是把要绘制的颜 ...

  8. html5 canvas消除锯齿,HTML5 Canvas 如何取消反锯齿绘图

    原文出自:http://blog.csdn.net/cheungmine/article/details/7053455 一.问题的提出 我们都知道反锯齿(anti-aliasing)绘图给我们带来更 ...

  9. HTML5 canvas 拖尾效果（或尾巴 或方向标 或留痕。。。）

    [canvas]带拖尾效果的旋转扩散 使用 HTML5 canvas 制作一个圆形的拖尾,以及附加上拖尾的扩散效果 我说说的拖尾,就是拖着一个尾巴,其他简短的名词暂时想不到了.下图效果弄出来,着实费劲 ...

最新文章

  1. 舍不得孩子套不着狼，早就应该换SSD硬盘了!
  2. blockquote 引用的分析
  3. Qt QWidget实现消息提示控件TipsWidget
  4. owa_util.get_cgi_env 函数参数说明.
  5. 学好Linux决心书
  6. 安卓逆向系列教程 4.1 字符串资源
  7. 在线CSV转SQL工具
  8. HIVE大数据出现倾斜怎么办
  9. android加载框效果《IT蓝豹》
  10. 20191111每日一句
  11. 号外号外：Exchange2010SP2已经发布
  12. linux 启动u盘引导,U盘启动引导安装linux
  13. textView 属性总结
  14. 谈谈核心网UPF和开放
  15. 实例6.1 六度空间 (30 分)+C语言实现
  16. 简历太空白怎么办？如何写简历
  17. window7系统怎么给电脑安装
  18. html背景自动切换带滚动,利用CSS固定背景交替实现视差滚动效果
  19. NORDIC softDevice 蓝牙协议栈初始化程序分析(蓝牙从机,ble_peripheral)
  20. SCI论文投稿到接收的时间

热门文章

  1. 工作102:设置url实现查询 秒呀
  2. 前端学习（2388）：封装请求模块
  3. 前端学习（2260）高校案例
  4. 前端学习（1066）:ES6里面的三个注意点1
  5. 前端学习（583）：在console中访问节点
  6. Java面试题19 牛客下面有关java的引用类型，说法正确的有？
  7. java numa_Java只使用2个CPU中的1个和NUMA(Neo4J)
  8. axios发送请求（baseURL有多个的情况）
  9. android image设置adjustviewbounds_探索 Android 平台的 CameraX
  10. Java基础之线程池