头像星球html,HTML5 Canvas 星球大战黑武士头像

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();

};

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/417045.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

webflux 对url参数的接收处理

普通写法 GetMapping("/person/{id}")Mono<Person> findById(PathVariable String id) {return this.repository.findOne(id);} 函数式写法-方法 public Mono<ServerResponse> getPerson(ServerRequest request) { int personId Integer.valueOf(req…

yii源码学习心得

1.通过看源代码&#xff0c;对yii的框架学习有了更多的认识和理解 assets 前端资源文件夹&#xff0c;用于管理css js等前端资源文件等 commands 包含命令行命令&#xff0c;文件为控制器文件 config 应用的配置文件 controllers 控制器文件 mail &#xff08;应用的前后台…

div添加html链接,DIV添加超链接小记

接上篇&#xff0c;已经实现了上面是纯文字“图片”下面是文字的效果&#xff0c;但是有个问题是“图片”没有超链接&#xff0c;点击没反应&#xff0c;体验不太好&#xff0c;于是想着把“图片”(实际是文字)加上超链接。最简单的方法是加标签&#xff0c;但是测试后发现点击…

consul删除无效服务

curl http://server_ip:8500/v1/agent/service/deregister/paas-portal-sit-9003 -X PUT 删除无效服务&#xff1a; paas-portal-sit-9003 为服务名称 页面上进入服务详单(/ui/dc1/services/xxx)从这里找 删除无效节点&#xff1a; http://server_ip:8500/v1/agent/force-l…

redis 超时失效key 的监听触发

1. 事件通过 Redis 的订阅与发布功能&#xff08;pub/sub&#xff09;来进行分发,故需要订 阅 __keyevent0__:expired 通道 0表示db0 根据自己的dbindex选择合适的数字 2. 修改 redis.conf 文件 修改 notify-keyspace-events Ex # K 键空间通知&#xff0c;以__keyspace&l…

英语四级真题作文 计算机,2019年6月大学英语四级作文范文50例:电脑

新东方在线英语四级频道为备考英语四级的同学们整理了英语四级作文范文&#xff0c;希望可以为大家带来帮助&#xff0c;一起来学习一下吧。Computers in Students’ Flats1. 现在大学生宿舍几乎人手一台电脑2. 有些人认为会促进学生的学习&#xff0c;有些人认为会影响学生的学…

图数据库neo4j安装、neo4j使用

安装 yum install java-1.8.0-openjdk tar -xf neo4j-community-3.5.2-unix.tar.gz ./bin/neo4j start 外部访问需修改 vi conf/neo4j.conf 如下这行去掉注释 dbms.connectors.default_listen_address0.0.0.0 需要开放端口 7474 7687 浏览器访问url http://192.168.91.…

关于计算机网络的未来综述,计算机网络综述

摘要&#xff1a; 从计算机网络软件硬件进行阐述&#xff0c;使人们对计算机网络的构造以及设备有一个整体了解&#xff0c;以使在以后的工作和学习中&#xff0c;面对网络问题不再束手无策&#xff0c;从而提高工作和学习的效率。关键词&#xff1a; 计算机网络&#xff1b;网…

spring cloud gateway集成hystrix全局断路器

pom.xml添加依赖 <dependency> <groupId>org.springframework.cloud</groupId> <artifactId>spring-cloud-starter-netflix-hystrix</artifactId> </dependency> 在配置文件中&#xff0c;增加spring.cloud.gateway.default-filters&…

java 抽象方法

int 是基本数据类型Integer是其包装类&#xff0c;注意是一个类。为什么要提供包装类呢&#xff1f;&#xff1f;&#xff1f;一是为了在各种类型间转化&#xff0c;通过各种方法的调用。否则 你无法直接通过变量转化。比如&#xff0c;现在int要转为Stringint a0;String resul…

html用变量存储颜色信息,我如何使用间隔循环修改HTML Canvas颜色?

hue变量和hsl样式中的百分比控制颜色。要从RGB颜色150,150,200开始&#xff0c;将色调设置为240&#xff0c;将饱和度(hsl中的第二个参数)设置为25%&#xff0c;将亮度(第三个参数)设置为78%。要以RGB颜色190,160,200结束&#xff0c;您需要循环&#xff0c;直到色相值达到285为…

spring cloud gateway跨域全局CORS配置

在Spring 5 Webflux中&#xff0c;配置CORS&#xff0c;可以通过自定义WebFilter实现&#xff1a; 注&#xff1a;此种写法需真实跨域访问&#xff0c;监控header中才会带相应属性。 代码实现方式 import org.springframework.http.HttpHeaders; import org.springframework…

1前端学习(2345):关于前端对于xml格式文件的渲染

一、xml和json对比 xml:扩展标记语言&#xff0c;     优点&#xff1a;格式统一&#xff0c;格式标准&#xff0c;容易与其他系统远程交互&#xff0c;数据共享比较方便     缺点&#xff1a;xml文件庞大&#xff0c;格式复杂&#xff0c;解析会花费大量时间和资源&am…

CDH集群异常处理ERROR  Failure due to stall on seeded torrent.、重装时hdfs提示目录已存在、CDH重启不正常

//集群安装报错 ERROR Failure due to stall on seeded torrent. 解决&#xff1a;重启agent服务 //重装时hdfs提示目录已存在 rm -rf /dfs rm -rf /impala/ ///CDH重启不正常 先启动cloudera-scm-server&#xff0c;等能进入web管理页面后/cloudera-scm-server statu…

java - 百钱百鸡小算法

传送门: 袁咩咩的小小博客 百钱百鸡是一个非常经典的不定方程问题&#xff0c;最早源于我国古代的《算经》&#xff0c;这是古代著名数学家张丘建首次提出的。百钱百鸡问题原文如下&#xff1a; 鸡翁一&#xff0c;值钱五&#xff0c;鸡母一&#xff0c;值钱三&#xff0c;鸡雏…

计算机网络管理员demo,计算机网络试题demo

计算机网络试题demo 1 北京交通大学 2006-2007 学年 第二学期考试试题 课程名称&#xff1a;计算机通信与网络技术 班级&#xff1a;电气 05 出题人&#xff1a;网络课程组 题 号 一 二 三 四 五 总分 得 分 签 字 一&#xff0e; 选择题(每题1 分&#xff0c;共20 分) 1&#…

C 语言中可以调用命令行指令的 system()函数

C语言有一个system函数&#xff08;在<stdlib.h>头中&#xff0c;C则为<cstdlib>头&#xff09;&#xff0c;可以用来调用终端命令。原型如下&#xff1a; int system(const char *cmdline /* 命令字符串 */); system函数调用/bin/sh 执行特定的shell命令&#xf…

文本怎么换成html,编辑html格式文本可改成txt格式(可以替换或更换某文本)新手...

该楼层疑似违规已被系统折叠 隐藏此楼查看此楼新的名字生活助手If Clock.Hour < 12 ThenTextWindow.WriteLine("早上好&#xff0c;测试者")ElseIf Clock.Hour < 14 ThenTextWindow.WriteLine("中午好&#xff0c;测试者")ElseIf Clock.Hour < 17…