{"id":305,"date":"2016-03-24T15:57:58","date_gmt":"2016-03-24T07:57:58","guid":{"rendered":"http:\/\/www.xttblog.com\/?p=305"},"modified":"2016-03-24T15:58:12","modified_gmt":"2016-03-24T07:58:12","slug":"%e4%bd%bf%e7%94%a8canvas%e7%bb%99%e5%9b%be%e7%89%87%e6%b7%bb%e5%8a%a0%e6%b0%b4%e5%8d%b0","status":"publish","type":"post","link":"https:\/\/www.xttblog.com\/?p=305","title":{"rendered":"\u4f7f\u7528Canvas\u7ed9\u56fe\u7247\u6dfb\u52a0\u6c34\u5370"},"content":{"rendered":"

\n\t\u5728\u751f\u6d3b\u4e2d\u6211\u4eec\u5230\u5904\u90fd\u53ef\u4ee5\u89c1\u5230\u5e26\u6709\u6c34\u5370\u7684\u6587\u6863\u3002\u7f51\u4e0a\u4e5f\u5230\u5904\u53ef\u89c1\u7684\u6c34\u5370\u56fe\u7247\uff0c\u5982csdn\uff0c\u6dd8\u5b9d\uff0c\u767e\u5ea6\u4e0a\u7684\u56fe\u7247\u90fd\u5e26\u6709\u6c34\u5370\u3002
\n\t\u5c24\u5176\u662f\u73b0\u5728\u76d7\u7248\u975e\u5e38\u4e25\u91cd\u7684\u793e\u4f1a\u3002\u4f60\u521a\u5199\u7684\u6587\u7ae0\uff0c\u51e0\u79d2\u949f\u540e\u5c31\u51fa\u73b0\u5728\u5176\u4ed6\u7f51\u7ad9\u4e0a\uff0c\u7136\u540e\u5c31\u4f1a\u51fa\u73b0\uff0c\u5230\u5e95\u8c01\u662f\u539f\u521b\u95ee\u9898\u3002\u5982\u4f55\u89e3\u51b3\u76d7\u7248\u95ee\u9898\uff0c\u5176\u4ed6\u7684\u65b9\u6cd5\u4e4b\u4e00\u5c31\u662f\u56fe\u7247\u6dfb\u52a0\u6c34\u5370\uff0c\u8ba9\u76d7\u6587\u7ae0\u7684\u4eba\u6ca1\u6709\u7acb\u8db3\u4e4b\u5730\u3002
\n\t\u8fd0\u884c\u6548\u679c\u5982\u4e0b\uff1a\n<\/p>\n

\n\t\n<\/p>\n

\n\t\u5168\u90e8\u6e90\u4ee3\u7801\u5982\u4e0b\uff1a\n<\/p>\n

\r\n<!DOCTYPE html>\r\n<html lang="en">\r\n<head>\r\n    <title>\u4f7f\u7528Canvas\u7ed9\u56fe\u7247\u6dfb\u52a0\u6c34\u5370<\/title>\r\n<\/head>\r\n<body>\r\n\t<canvas id="xttblog" width="500" height="200"><\/canvas>\r\n\t<br\/><input value="www.xttblog.com" id="test"\/><br\/>\r\n\t<input value="\u91cd\u65b0\u751f\u6210\u6c34\u5370" type="button" onclick="watermark(document.getElementById('test').value);"\/>\r\n <script>\r\n\tfunction watermark(url) {\r\n\t\tcanvas = document.getElementById("xttblog");\r\n\t\tif (canvas.getContext){\r\n\t\t\tctx = canvas.getContext('2d');\r\n\t\t\tvar img1 = new Image();\r\n\t\t\timg1.src='xttblog.bmp';\r\n\t\t\timg1.onload = function(){\r\n\t\t\t\tvar imgWidth=img1.width;\r\n\t\t\t\tvar imgHeight=img1.height;\r\n\t\t\t\tcanvas.width= imgWidth;\r\n\t\t\t\tcanvas.height=imgHeight;\r\n\t\t\t\tctx.drawImage(img1,0,0);\r\n\t\t\t\t\/\/ \u521b\u5efa\u6e10\u53d8\r\n\t\t\t\tvar gradient=ctx.createLinearGradient(0,0,canvas.width,0);\r\n\t\t\t\tgradient.addColorStop("0","magenta");\r\n\t\t\t\tgradient.addColorStop("0.5","blue");\r\n\t\t\t\tgradient.addColorStop("1.0","red");\r\n\t\t\t\t\/\/ \u7528\u6e10\u53d8\u586b\u8272\r\n\t\t\t\tctx.fillStyle    = gradient;\r\n\t\t\t\t\/\/ \u6c34\u5370\u5b57\u4f53\r\n\t\t\t\tctx.font         = '30px Verdana';\r\n\t\t\t\t\/\/ \u6c34\u5370\r\n\t\t\t\tctx.fillText(url, canvas.width-450,canvas.height-100);\t\t\t\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\twatermark('www.xttblog.com');\r\n<\/script>\r\n<\/body>\r\n<\/html>\r\n<\/pre>\n
\"\u4e1a\u4f59\u8349\u516c\u4f17\u53f7\"\/<\/p>
\u6700\u540e\uff0c\u6b22\u8fce\u5173\u6ce8\u6211\u7684\u4e2a\u4eba\u5fae\u4fe1\u516c\u4f17\u53f7\uff1a\u4e1a\u4f59\u8349\uff08yyucao\uff09\uff01\u53ef\u52a0\u4f5c\u8005\u5fae\u4fe1\u53f7\uff1axttblog2<\/font>\u3002\u5907\u6ce8\uff1a\u201c1\u201d\uff0c\u6dfb\u52a0\u535a\u4e3b\u5fae\u4fe1\u62c9\u4f60\u8fdb\u5fae\u4fe1\u7fa4\u3002\u5907\u6ce8\u9519\u8bef\u4e0d\u4f1a\u540c\u610f\u597d\u53cb\u7533\u8bf7\u3002<\/b>\u518d\u6b21\u611f\u8c22\u60a8\u7684\u5173\u6ce8\uff01\u540e\u7eed\u6709\u7cbe\u5f69\u5185\u5bb9\u4f1a\u7b2c\u4e00\u65f6\u95f4\u53d1\u7ed9\u60a8\uff01\u539f\u521b\u6587\u7ae0\u6295\u7a3f\u8bf7\u53d1\u9001\u81f3532009913@qq.com\u90ae\u7bb1\u3002\u5546\u52a1\u5408\u4f5c\u4e5f\u53ef\u6dfb\u52a0\u4f5c\u8005\u5fae\u4fe1\u8fdb\u884c\u8054\u7cfb\uff01<\/p>
\u672c\u6587\u539f\u6587\u51fa\u5904\uff1a\u4e1a\u4f59\u8349<\/a>\uff1a » \u4f7f\u7528Canvas\u7ed9\u56fe\u7247\u6dfb\u52a0\u6c34\u5370<\/a><\/p>","protected":false},"excerpt":{"rendered":"
\u5728\u751f\u6d3b\u4e2d\u6211\u4eec\u5230\u5904\u90fd\u53ef\u4ee5\u89c1\u5230\u5e26\u6709\u6c34\u5370\u7684\u6587\u6863\u3002\u7f51\u4e0a\u4e5f\u5230\u5904\u53ef\u89c1\u7684\u6c34\u5370\u56fe\u7247\uff0c\u5982csdn\uff0c\u6dd8\u5b9d\uff0c\u767e\u5ea6\u4e0a\u7684\u56fe\u7247\u90fd\u5e26\u6709\u6c34\u5370\u3002 […]<\/p>\n","protected":false},"author":2,"featured_media":306,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4],"tags":[31,119,98],"class_list":["post-305","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-html5","tag-canvas","tag-html5","tag-98"],"_links":{"self":[{"href":"https:\/\/www.xttblog.com\/index.php?rest_route=\/wp\/v2\/posts\/305","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.xttblog.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.xttblog.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.xttblog.com\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.xttblog.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=305"}],"version-history":[{"count":2,"href":"https:\/\/www.xttblog.com\/index.php?rest_route=\/wp\/v2\/posts\/305\/revisions"}],"predecessor-version":[{"id":308,"href":"https:\/\/www.xttblog.com\/index.php?rest_route=\/wp\/v2\/posts\/305\/revisions\/308"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.xttblog.com\/index.php?rest_route=\/wp\/v2\/media\/306"}],"wp:attachment":[{"href":"https:\/\/www.xttblog.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=305"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.xttblog.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=305"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.xttblog.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=305"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}