canvas畫一個時鐘

/**

?*?分針速率根據(jù)秒針來，時針速率根據(jù)分針來

?*??*/

function?Clock?(params,?dom)?{

??let?R?=?50,

??LINE_WIDTH?=?3,

??X_CENTER?=?200,

??Y_CENTER?=?200,

??canvas?=?dom;

??this.setR?=?function?(r)?{

????this.R?=?r;

??}

??this.setXCenter?=?function?(x)?{

????this.X_CENTER?=?x;

??}

??this.setYCenter?=?function?(y)?{

????this.Y_CENTER?=?y;

??}

??this.getXCenter?=?function?()?{

????return?this.X_CENTER;

??}

??this.getYCenter?=?function?()?{

????return?this.Y_CENTER;

??}

??this.getR?=?function?()?{

????return?this.R;

??}

??this.getDomElement?=?function()?{

????return?canvas;

??}

??//?this.setCanvas?=?function?(c)?{

??//???return?this.canvas?=?c

??//?}

??this.setXCenter(params.x);

??this.setYCenter(params.y);

??this.setR(params.r);

}

Clock.prototype?=?{

??constructor:?Clock,

??init:?function?()?{

????var?ctx?=?this.getDomElement().getContext('2d')

????//?var?s?=?0;

????setInterval(()?=>?{

??????var?x?=?this.getXCenter();

??????var?y?=?this.getYCenter();

??????var?r?=?this.getR();

??????ctx.clearRect(x?-?r?-?2,?y?-?r?-?2,?2?*?r?+?5,?2?*?r?+?5);

??????var?s?=?new?Date().getSeconds();

??????var?m?=?new?Date().getMinutes();

??????var?h?=?new?Date().getHours();

??????//?if?(s?===?60)?{

??????//???s?=?0;

??????//?}

??????this.drawClock(ctx);

??????this.drawCenter(ctx);

??????this.drawSecond(ctx,?s);

??????this.drawMin(ctx,?m,?s);

??????this.drawHour(ctx,?h,?m);

??????//?s?+=?1;

????},1000);

??},

??drawCenter:?function?(ctx)?{

????var?x?=?this.getXCenter();

????var?y?=?this.getYCenter();

????var?r?=?this.getR();

????ctx.beginPath();

????ctx.fillStyle?=?'#3f51b5';

????ctx.arc(x,?y,?0.1?*?r,?0,?2?*?Math.PI);

????ctx.stroke();

????ctx.fill();

????ctx.beginPath();

????ctx.fillStyle?=?'#ffffff';

????ctx.arc(x,?y,?0.05?*?r,?0,?2?*?Math.PI);

????ctx.stroke();

????ctx.fill();

??},

??drawClock:?function?(ctx)?{

????var?x?=?this.getXCenter();

????var?y?=?this.getYCenter();

????var?r?=?this.getR();

????ctx.beginPath();

????ctx.arc(x,?y,?r,?0,?2?*?Math.PI);

????ctx.stroke();

????//?畫刻度

????for?(let?i?=?0;?i?<?60;?i?+=?1)?{

??????ctx.beginPath();

??????ctx.font?=?`15px?Microsoft?Yahei`;

??????ctx.fillStyle?=?'#1d89d5';

???????ctx.textAlign?=?'center';

??????if?(0?<=?i?&&?i?<=15)?{

????????if?(i?%?5?!==?0)?{

??????????var?xPointS?=?x?+?(r?*?Math.cos((Math.PI?/?2)?-?(Math.PI?/?30?*?i)));

??????????var?yPointS?=?y?-?(r?*?Math.sin((Math.PI?/?2)?-?(Math.PI?/?30?*?i)));

??????????var?xPointE?=?x?+?(r?*?0.9?*?Math.cos((Math.PI?/?2)?-?(Math.PI?/?30?*?i)));

??????????var?yPointE?=?y?-?(r?*?0.9?*?Math.sin((Math.PI?/?2)?-?(Math.PI?/?30?*?i)))

??????????ctx.moveTo(xPointS,?yPointS);

??????????ctx.lineTo(xPointE,?yPointE);

????????}?else?{

??????????//?長刻度

??????????var?xPointS?=?x?+?(r?*?Math.cos((Math.PI?/?2)?-?(Math.PI?/?30?*?i)));

??????????var?yPointS?=?y?-?(r?*?Math.sin((Math.PI?/?2)?-?(Math.PI?/?30?*?i)));

??????????var?xPointE?=?x?+?(r?*?0.8?*?Math.cos((Math.PI?/?2)?-?(Math.PI?/?30?*?i)));

??????????var?yPointE?=?y?-?(r?*?0.8?*?Math.sin((Math.PI?/?2)?-?(Math.PI?/?30?*?i)))

??????????ctx.moveTo(xPointS,?yPointS);

??????????ctx.lineTo(xPointE,?yPointE);

???????????if?(i?===?0)?{

??????????????//?寫字

?????????????ctx.fillText('12',?xPointE,?yPointE?+?13);

???????????}?else?if?(i?===?5)?{

?????????????//?寫字

????????????ctx.fillText('1',?xPointE,?yPointE?+?13);

???????????}?else?if?(i?===?10)?{

?????????????//?寫字

????????????ctx.fillText('2',?xPointE?-?5,?yPointE?+?5);

???????????}?else?if?(i?===?15)?{

?????????????//?寫字

????????????ctx.fillText('3',?xPointE?-?5,?yPointE?+?5);

???????????}

????????}

??????}?else?if?(15?<?i?&&?i?<=?30)?{

????????if?(i?%?5?!==?0)?{

??????????var?xPointS?=?x?+?(r?*?Math.cos(Math.abs((Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????????var?yPointS?=?y?+?(r?*?Math.sin(Math.abs((Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????????var?xPointE?=?x?+?(r?*?0.9?*?Math.cos(Math.abs((Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????????var?yPointE?=?y?+?(r?*?0.9?*?Math.sin(Math.abs((Math.PI?/?2)?-?(Math.PI?/?30?*?i))))

??????????ctx.moveTo(xPointS,?yPointS);

??????????ctx.lineTo(xPointE,?yPointE);

????????}?else?{

??????????//?長刻度

??????????var?xPointS?=?x?+?(r?*?Math.cos(Math.abs((Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????????var?yPointS?=?y?+?(r?*?Math.sin(Math.abs((Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????????var?xPointE?=?x?+?(r?*?0.8?*?Math.cos(Math.abs((Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????????var?yPointE?=?y?+?(r?*?0.8?*?Math.sin(Math.abs((Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????????ctx.moveTo(xPointS,?yPointS);

??????????ctx.lineTo(xPointE,?yPointE);

??????????if?(i?===?20)?{

????????????//?寫字

????????????ctx.fillText('4',?xPointE?-?5,?yPointE);

?????????}?else?if?(i?===?25)?{

???????????//?寫字

??????????ctx.fillText('5',?xPointE?-?5,?yPointE);

?????????}?else?if?(i?===?30)?{

??????????//?寫字

??????????ctx.fillText('6',?xPointE,?yPointE?-?5);

?????????}

????????}

??????}?else?if?(30?<?i?&&?i?<?45)?{

????????if?(i?%?5?!==?0)?{

??????????var?xPointS?=?x?-?(r?*?Math.cos(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????????var?yPointS?=?y?+?(r?*?Math.sin(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????????var?xPointE?=?x?-?(r?*?0.9?*?Math.cos(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????????var?yPointE?=?y?+?(r?*?0.9?*?Math.sin(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?i))))

??????????ctx.moveTo(xPointS,?yPointS);

??????????ctx.lineTo(xPointE,?yPointE);

????????}?else?{

??????????//?長刻度

??????????var?xPointS?=?x?-?(r?*?Math.cos(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????????var?yPointS?=?y?+?(r?*?Math.sin(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????????var?xPointE?=?x?-?(r?*?0.8?*?Math.cos(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????????var?yPointE?=?y?+?(r?*?0.8?*?Math.sin(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????????ctx.moveTo(xPointS,?yPointS);

??????????ctx.lineTo(xPointE,?yPointE);

??????????if?(i?===?35)?{

????????????//?寫字

???????????ctx.fillText('7',?xPointE?+?5,?yPointE);

?????????}?else?if?(i?===?40)?{

???????????//?寫字

??????????ctx.fillText('8',?xPointE?+?5,?yPointE?+?5);

?????????}

????????}

??????}?else?if?(45?<=?i?&&?i?<?60){

????????if?(i?%?5?!==?0)?{

??????????var?xPointS?=?x?-?(r?*?Math.cos(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????????var?yPointS?=?y?-?(r?*?Math.sin(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????????var?xPointE?=?x?-?(r?*?0.9?*?Math.cos(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????????var?yPointE?=?y?-?(r?*?0.9?*?Math.sin(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?i))))

??????????ctx.moveTo(xPointS,?yPointS);

??????????ctx.lineTo(xPointE,?yPointE);

????????}?else?{

??????????//?長刻度

??????????var?xPointS?=?x?-?(r?*?Math.cos(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????????var?yPointS?=?y?-?(r?*?Math.sin(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????????var?xPointE?=?x?-?(r?*?0.8?*?Math.cos(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????????var?yPointE?=?y?-?(r?*?0.8?*?Math.sin(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????????ctx.moveTo(xPointS,?yPointS);

??????????ctx.lineTo(xPointE,?yPointE);

??????????if?(i?===?45)?{

????????????//?寫字

????????????ctx.fillText('9',?xPointE?+?5,?yPointE?+?3);

?????????}?else?if?(i?===?50)?{

????????????//?寫字

????????????ctx.fillText('10',?xPointE?+?8,?yPointE?+?5);

?????????}?else?if?(i?===?55)?{

????????????//?寫字

????????????ctx.fillText('11',?xPointE?+?3,?yPointE?+?13);

????????}

??????}

??????ctx.stroke();

????}

??},

??drawSecond:?function?(ctx,?s)?{

????var?x?=?this.getXCenter();

????var?y?=?this.getYCenter();

????var?r?=?this.getR();

????ctx.beginPath();

????ctx.moveTo(x,y);

????var?i?=?s

????if?(0?<=?i?&&?i?<=15)?{

??????//?第一現(xiàn)象線

??????var?xPointE?=?x?+?(r?*?0.9?*?Math.cos((Math.PI?/?2)?-?(Math.PI?/?30?*?i)));

??????var?yPointE?=?y?-?(r?*?0.9?*?Math.sin((Math.PI?/?2)?-?(Math.PI?/?30?*?i)))

??????ctx.lineTo(xPointE,?yPointE);

????}?else?if?(15?<?i?&&?i?<=?30)?{

??????//?第四象限

??????var?xPointE?=?x?+?(r?*?0.9?*?Math.cos(Math.abs((Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????var?yPointE?=?y?+?(r?*?0.9?*?Math.sin(Math.abs((Math.PI?/?2)?-?(Math.PI?/?30?*?i))))

??????ctx.lineTo(xPointE,?yPointE);

????}?else?if?(30?<?i?&&?i?<?45)?{

??????//?第三象限

??????var?xPointE?=?x?-?(r?*?0.9?*?Math.cos(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????var?yPointE?=?y?+?(r?*?0.9?*?Math.sin(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?i))))

??????ctx.lineTo(xPointE,?yPointE);

????}?else?if?(45?<=?i?&&?i?<?60){

??????//?第二象限

??????var?xPointE?=?x?-?(r?*?0.9?*?Math.cos(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?i))));

??????var?yPointE?=?y?-?(r?*?0.9?*?Math.sin(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?i))))

??????ctx.lineTo(xPointE,?yPointE);

????}

????ctx.stroke();

??},

??drawMin:?function?(ctx,?m,?s)?{

????var?x?=?this.getXCenter();

????var?y?=?this.getYCenter();

????var?r?=?this.getR();

????ctx.beginPath();

????ctx.moveTo(x,y);

????var?i?=?m

????if?(0?<=?i?&&?i?<=15)?{

??????//?第一象限

??????var?xPointE?=?x?+?(r?*?0.8?*?Math.cos((Math.PI?/?2)?-?(Math.PI?/?30?*?s?/?60)?-?(Math.PI?/?30?*?i)));

??????var?yPointE?=?y?-?(r?*?0.8?*?Math.sin((Math.PI?/?2)?-?(Math.PI?/?30?*?s?/?60)?-?(Math.PI?/?30?*?i)));

??????ctx.lineTo(xPointE,?yPointE);

????}?else?if?(15?<?i?&&?i?<=?30)?{

??????//?第四象限

??????var?xPointE?=?x?+?(r?*?0.8?*?Math.cos(Math.abs((Math.PI?/?2)?-?(Math.PI?/?30?*?s?/?60)?-(Math.PI?/?30?*?i))));

??????var?yPointE?=?y?+?(r?*?0.8?*?Math.sin(Math.abs((Math.PI?/?2)?-?(Math.PI?/?30?*?s?/?60)?-?(Math.PI?/?30?*?i))));

??????ctx.lineTo(xPointE,?yPointE);

????}?else?if?(30?<?i?&&?i?<?45)?{

??????//?第三象限

??????var?xPointE?=?x?-?(r?*?0.8?*?Math.cos(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?s?/?60)?-?(Math.PI?/?30?*?i))));

??????var?yPointE?=?y?+?(r?*?0.8?*?Math.sin(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?s?/?60)?-?(Math.PI?/?30?*?i))));

??????ctx.lineTo(xPointE,?yPointE);

????}?else?if?(45?<=?i?&&?i?<?60){

??????//?第二象限

??????var?xPointE?=?x?-?(r?*?0.8?*?Math.cos(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?s?/?60)?-?(Math.PI?/?30?*?i))));

??????var?yPointE?=?y?-?(r?*?0.8?*?Math.sin(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?30?*?s?/?60)?-?(Math.PI?/?30?*?i))));

??????ctx.lineTo(xPointE,?yPointE);

????}

????ctx.stroke();

??},

??drawHour:?function?(ctx,?h,?m)?{

????var?x?=?this.getXCenter();

????var?y?=?this.getYCenter();

????var?r?=?this.getR();

????ctx.beginPath();

????ctx.moveTo(x,y);

????var?i?=?h

????if?((0?<=?i?&&?i?<=?3)?||?(12?<=?i?&&?i?<=?15))?{

??????i?=?i?>=?12???i?-?12?:?i;

??????//?第一現(xiàn)象線

??????var?xPointE?=?x?+?(r?*?0.65?*?Math.cos((Math.PI?/?2)?-?(Math.PI?/?6?*?i)?-?(Math.PI?/?6?*?m?/?60)));

??????var?yPointE?=?y?-?(r?*?0.65?*?Math.sin((Math.PI?/?2)?-?(Math.PI?/?6?*?i)?-?(Math.PI?/?6?*?m?/?60)));

??????ctx.lineTo(xPointE,?yPointE);

????}?else?if?((15?<?i?&&?i?<=?18)?||?(3?<?i?&&?i?<=?6))?{

??????i?=?i?>=?12???i?-?12?:?i;

??????//?第四象限

??????var?xPointE?=?x?+?(r?*?0.65?*?Math.cos(Math.abs((Math.PI?/?2)?-?(Math.PI?/?6?*?i)?-?(Math.PI?/?6?*?m?/?60))));

??????var?yPointE?=?y?+?(r?*?0.65?*?Math.sin(Math.abs((Math.PI?/?2)?-?(Math.PI?/?6?*?i)?-?(Math.PI?/?6?*?m?/?60))));

??????ctx.lineTo(xPointE,?yPointE);

????}?else?if?((18?<?i?&&?i?<?21)?||?(6?<?i?&&?i?<?9))?{

??????i?=?i?>=?12???i?-?12?:?i;

??????//?第三象限

??????var?xPointE?=?x?-?(r?*?0.65?*?Math.cos(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?6?*?i)?-?(Math.PI?/?6?*?m?/?60))));

??????var?yPointE?=?y?+?(r?*?0.65?*?Math.sin(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?6?*?i)?-?(Math.PI?/?6?*?m?/?60))));

??????ctx.lineTo(xPointE,?yPointE);

????}?else?if?((21?<=?i?&&?i?<=?23)?||?(9?<=?i?&&?i?<=?11)){

??????i?=?i?>=?12???i?-?12?:?i;

??????//?第二象限

??????var?xPointE?=?x?-?(r?*?0.65?*?Math.cos(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?6?*?i)?-?(Math.PI?/?6?*?m?/?60))));

??????var?yPointE?=?y?-?(r?*?0.65?*?Math.sin(Math.abs((3?*?Math.PI?/?2)?-?(Math.PI?/?6?*?i)?-?(Math.PI?/?6?*?m?/?60))));

??????ctx.lineTo(xPointE,?yPointE);

????}

????ctx.stroke();

??},

}

var?canvas?=?document.getElementById('x');

canvas.width?=?window.innerWidth;

canvas.height?=?window.innerHeight;

var?c?=?new?Clock({?x:?400,?y:?400,?r:?200?},canvas);

c.init();

最后編輯于：2019.10.17 18:12:01

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者

人面猴
序言：七十年代末辣之，一起剝皮案震驚了整個濱河市掰伸，隨后出現(xiàn)的幾起案子，更是在濱河造成了極大的恐慌怀估，老刑警劉巖狮鸭，帶你破解...
沈念sama閱讀 210,914評論 6贊 490
死咒
序言：濱河連續(xù)發(fā)生了三起死亡事件，死亡現(xiàn)場離奇詭異多搀，居然都是意外死亡歧蕉，警方通過查閱死者的電腦和手機，發(fā)現(xiàn)死者居然都...
沈念sama閱讀 89,935評論 2贊 383
救了他兩次的神仙讓他今天三更去死
文/潘曉璐我一進店門康铭，熙熙樓的掌柜王于貴愁眉苦臉地迎上來惯退，“玉大人，你說我怎么就攤上這事。” “怎么了澡绩？”我有些...
開封第一講書人閱讀 156,531評論 0贊 345
道士緝兇錄：失蹤的賣姜人
文/不壞的土叔我叫張陵煎楣，是天一觀的道長。經(jīng)常有香客問我，道長，這世上最難降的妖魔是什么？我笑而不...
開封第一講書人閱讀 56,309評論 1贊 282
?港島之戀（遺憾婚禮）
正文為了忘掉前任骑丸，我火速辦了婚禮，結(jié)果婚禮上妒貌，老公的妹妹穿的比我還像新娘通危。我一直安慰自己，他們只是感情好苏揣，可當我...
茶點故事閱讀 65,381評論 5贊 384
惡毒庶女頂嫁案：這布局不是一般人想出來的
文/花漫我一把揭開白布黄鳍。她就那樣靜靜地躺著，像睡著了一般平匈。火紅的嫁衣襯著肌膚如雪框沟。梳的紋絲不亂的頭發(fā)上藏古，一...
開封第一講書人閱讀 49,730評論 1贊 289
城市分裂傳說
那天，我揣著相機與錄音忍燥，去河邊找鬼拧晕。笑死，一個胖子當著我的面吹牛梅垄，可吹牛的內(nèi)容都是我干的厂捞。我是一名探鬼主播，決...
沈念sama閱讀 38,882評論 3贊 404
雙鴛鴦連環(huán)套：你想象不到人心有多黑
文/蒼蘭香墨我猛地睜開眼队丝，長吁一口氣：“原來是場噩夢啊……” “哼靡馁！你這毒婦竟也來了？” 一聲冷哼從身側(cè)響起机久，我...
開封第一講書人閱讀 37,643評論 0贊 266
萬榮殺人案實錄
序言：老撾萬榮一對情侶失蹤臭墨，失蹤者是張志新（化名）和其女友劉穎，沒想到半個月后膘盖，有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體胧弛，經(jīng)...
沈念sama閱讀 44,095評論 1贊 303
?護林員之死
正文獨居荒郊野嶺守林人離奇死亡，尸身上長有42處帶血的膿包…… 初始之章·張勛以下內(nèi)容為張勛視角年9月15日...
茶點故事閱讀 36,448評論 2贊 325
?白月光啟示錄
正文我和宋清朗相戀三年侠畔，在試婚紗的時候發(fā)現(xiàn)自己被綠了结缚。大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
茶點故事閱讀 38,566評論 1贊 339
活死人
序言：一個原本活蹦亂跳的男人離奇死亡软棺，死狀恐怖红竭，靈堂內(nèi)的尸體忽然破棺而出，到底是詐尸還是另有隱情码党，我是刑警寧澤德崭，帶...
沈念sama閱讀 34,253評論 4贊 328
?日本核電站爆炸內(nèi)幕
正文年R本政府宣布斥黑，位于F島的核電站揖盘，受9級特大地震影響，放射性物質(zhì)發(fā)生泄漏锌奴。R本人自食惡果不足惜兽狭，卻給世界環(huán)境...
茶點故事閱讀 39,829評論 3贊 312
男人毒藥：我在死后第九天來索命
文/蒙蒙一、第九天我趴在偏房一處隱蔽的房頂上張望鹿蜀。院中可真熱鬧箕慧，春花似錦、人聲如沸茴恰。這莊子的主人今日做“春日...
開封第一講書人閱讀 30,715評論 0贊 21
一樁弒父案，背后竟有這般陰謀
文/蒼蘭香墨我抬頭看了看天上的太陽往枣。三九已至伐庭，卻和暖如春粉渠，著一層夾襖步出監(jiān)牢的瞬間，已是汗流浹背圾另。一陣腳步聲響...
開封第一講書人閱讀 31,945評論 1贊 264
情欲美人皮
我被黑心中介騙來泰國打工霸株，沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留，地道東北人集乔。一個月前我還...
沈念sama閱讀 46,248評論 2贊 360
代替公主和親
正文我出身青樓去件，卻偏偏與公主長得像，于是被迫代替她去往敵國和親扰路。傳聞我的和親對象是個殘疾皇子尤溜，可洞房花燭夜當晚...
茶點故事閱讀 43,440評論 2贊 348

canvas畫一個時鐘

推薦閱讀更多精彩內(nèi)容