canvas簡單入門(2)

文字方法

  • strokeText(text, x, y) 描邊寫字
  • fillText(text, x, y) 填充寫字
  • measureText(text) 返回對(duì)象 包換文本的寬度
  • font 屬性 設(shè)置 大小尿孔、字體 如 cxt.fon="100px MicrosoftYaHei";
  • textAlign 屬性 水平對(duì)齊方式 start(默認(rèn))/end/center/left/right
  • textBaseline 屬性 垂直對(duì)齊方式 alphabetic(默認(rèn))/top/bottom/middke/hanging/ideographic

繪制圖片(插入圖片)

插入圖片

drawImage(img, x, y)

  • img image的dom元素
  • x,y 插入到 畫布的位置 坐標(biāo)

插入圖片并改變大小

drawImage(img, x, y, width, height)

插入裁剪后的圖片

drawImage(img, sx,sy,swidth,sheight, x, y, width, height)

  • sx/sy: 圖片上開始裁剪的位置
  • swidth/sheight : 裁剪圖片的大小

陰影

  • shadowColor 陰影顏色
  • shadowBlur 陰影的模糊值
  • shadowOffsetX 陰影的左偏移量
  • shadowOffsetY 陰影的右偏移量

漸變

線性漸變

var grd = cxt.createLinearGradien(x, y, x1, y1);

grd.addColorStop(位置, color)

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末活合,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子留晚,更是在濱河造成了極大的恐慌,老刑警劉巖奖地,帶你破解...
    沈念sama閱讀 207,248評(píng)論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件赋焕,死亡現(xiàn)場離奇詭異,居然都是意外死亡犬庇,警方通過查閱死者的電腦和手機(jī)侨嘀,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,681評(píng)論 2 381
  • 文/潘曉璐 我一進(jìn)店門咬腕,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人涨共,你說我怎么就攤上這事煞赢。” “怎么了照筑?”我有些...
    開封第一講書人閱讀 153,443評(píng)論 0 344
  • 文/不壞的土叔 我叫張陵凝危,是天一觀的道長。 經(jīng)常有香客問我懦铺,道長支鸡,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 55,475評(píng)論 1 279
  • 正文 為了忘掉前任急前,我火速辦了婚禮瀑构,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘世吨。我一直安慰自己,他們只是感情好耘婚,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,458評(píng)論 5 374
  • 文/花漫 我一把揭開白布边篮。 她就那樣靜靜地躺著,像睡著了一般凌受。 火紅的嫁衣襯著肌膚如雪思杯。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,185評(píng)論 1 284
  • 那天誊册,我揣著相機(jī)與錄音暖璧,去河邊找鬼。 笑死嘲碱,一個(gè)胖子當(dāng)著我的面吹牛局蚀,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播琅绅,決...
    沈念sama閱讀 38,451評(píng)論 3 401
  • 文/蒼蘭香墨 我猛地睜開眼千扶,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了术陶?” 一聲冷哼從身側(cè)響起煤痕,我...
    開封第一講書人閱讀 37,112評(píng)論 0 261
  • 序言:老撾萬榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎塘匣,沒想到半個(gè)月后巷帝,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 43,609評(píng)論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,083評(píng)論 2 325
  • 正文 我和宋清朗相戀三年棍厂,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了超陆。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片牺弹。...
    茶點(diǎn)故事閱讀 38,163評(píng)論 1 334
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖时呀,靈堂內(nèi)的尸體忽然破棺而出张漂,到底是詐尸還是另有隱情,我是刑警寧澤谨娜,帶...
    沈念sama閱讀 33,803評(píng)論 4 323
  • 正文 年R本政府宣布航攒,位于F島的核電站,受9級(jí)特大地震影響趴梢,放射性物質(zhì)發(fā)生泄漏屎债。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,357評(píng)論 3 307
  • 文/蒙蒙 一垢油、第九天 我趴在偏房一處隱蔽的房頂上張望盆驹。 院中可真熱鬧,春花似錦滩愁、人聲如沸躯喇。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,357評(píng)論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至妻味,卻和暖如春正压,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背责球。 一陣腳步聲響...
    開封第一講書人閱讀 31,590評(píng)論 1 261
  • 我被黑心中介騙來泰國打工焦履, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留拓劝,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 45,636評(píng)論 2 355
  • 正文 我出身青樓嘉裤,卻偏偏與公主長得像郑临,于是被迫代替她去往敵國和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子屑宠,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,925評(píng)論 2 344

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

  • 一:canvas簡介 1.1什么是canvas厢洞? ①:canvas是HTML5提供的一種新標(biāo)簽 ②:HTML5 ...
    GreenHand1閱讀 4,667評(píng)論 2 32
  • 本文首發(fā)于我的個(gè)人博客:http://cherryblog.site/github項(xiàng)目地址:https://git...
    sunshine小小倩閱讀 1,973評(píng)論 1 8
  • canvas用途 游戲 小游戲 圖表 報(bào)表 如 Charts插件 炫酷效果 banner 模擬器、圖形編輯器 等...
    飛魚_JS閱讀 943評(píng)論 0 2
  • 內(nèi)容 文字方法 strokeText(text, x, y) 描邊寫字 fillText(text, x, y)...
    zjxl閱讀 278評(píng)論 0 0
  • 記得上中學(xué)時(shí)典奉,歷史課經(jīng)常要背一些時(shí)點(diǎn)地點(diǎn)人物事件躺翻,還要分析事件的起因,影響卫玖,意義公你。那時(shí)候讀世界史,好像都是推翻骇笔,建...
    林濤亂翻書閱讀 102評(píng)論 0 0