ล่าสุดการพัฒนาเว็บบทเรียน
×

JavaScript การอ้างอิง

ภาพรวม

JavaScript

JS เชือก JS จำนวน JS ผู้ประกอบการ JS งบ JS คณิตศาสตร์ JS วันที่ JS แถว JS บูลีน JS นิพจน์ทั่วไป JS สถานการณ์โดยรวม JS การแปลง

เบราว์เซอร์ BOM

Window Navigator Screen History Location

HTML DOM

DOM เอกสาร DOM องค์ประกอบ DOM แอตทริบิวต์ DOM เหตุการณ์ DOM รูปแบบ

HTML วัตถุ

<a> <abbr> <address> <area> <article> <aside> <audio> <b> <base> <bdo> <blockquote> <body> <br> <button> <canvas> <caption> <cite> <code> <col> <colgroup> <datalist> <dd> <del> <details> <dfn> <dialog> <div> <dl> <dt> <em> <embed> <fieldset> <figcaption> <figure> <footer> <form> <head> <header> <h1> - <h6> <hr> <html> <i> <iframe> <img> <ins> <input> button <input> checkbox <input> color <input> date <input> datetime <input> datetime-local <input> email <input> file <input> hidden <input> image <input> month <input> number <input> password <input> radio <input> range <input> reset <input> search <input> submit <input> text <input> time <input> url <input> week <kbd> <keygen> <label> <legend> <li> <link> <map> <mark> <menu> <menuitem> <meta> <meter> <nav> <object> <ol> <optgroup> <option> <output> <p> <param> <pre> <progress> <q> <s> <samp> <script> <section> <select> <small> <source> <span> <strong> <style> <sub> <summary> <sup> <table> <td> <th> <tr> <textarea> <time> <title> <track> <u> <ul> <var> <video>

วัตถุอื่น ๆ

CSSStyleDeclaration


 

HTML canvas strokeText() Method

<ผ้าใบวัตถุ

ตัวอย่าง

เขียน "Hello world!" และ "Big smile!" (with gradient) บนผืนผ้าใบโดยใช้ strokeText() :

YourbrowserdoesnotsupporttheHTML5canvastag

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");

ctx.font="20px Georgia";
ctx.strokeText("Hello World!",10,50);

ctx.font="30px Verdana";
// Create gradient
var gradient=ctx.createLinearGradient(0,0,c.width,0);
gradient.addColorStop("0","magenta");
gradient.addColorStop("0.5","blue");
gradient.addColorStop("1.0","red");
// Fill with gradient
ctx.strokeStyle=gradient;
ctx.strokeText("Big smile!",10,90);
ลองตัวเอง»

สนับสนุนเบราว์เซอร์

ตัวเลขในตารางระบุราว์เซอร์รุ่นแรกที่สนับสนุนอย่างเต็มที่วิธีการ

วิธี
strokeText() 4.0 9.0 3.6 4.0 10.1

Note: พารามิเตอร์ maxWidth ไม่สนับสนุนใน Safari


ความหมายและการใช้งาน

strokeText() วิธีการดึงข้อความ (with no fill) บนผืนผ้าใบ สีเริ่มต้นของข้อความที่เป็นสีดำ

Tip: ใช้ ตัวอักษร คุณสมบัติเพื่อระบุตัวอักษรและขนาดตัวอักษรและใช้ strokeStyle คุณสมบัติการแสดงข้อความในสีอื่น / การไล่ระดับสี

ไวยากรณ์ JavaScript: context strokeText( text,x,y,maxWidth ) ;

ค่าพารามิเตอร์

พารามิเตอร์ ลักษณะ เล่น
text ระบุข้อความที่จะถูกเขียนบนผืนผ้าใบ เล่น "
x พิกัด x ที่จะเริ่มต้นการวาดภาพข้อความ (เทียบกับผ้าใบ) เล่น "
y พิกัด y ที่จะเริ่มต้นการวาดภาพข้อความ (เทียบกับผ้าใบ) เล่น "
maxWidth ไม่จำเป็น. ความกว้างสูงสุดที่อนุญาตของข้อความพิกเซล เล่น "

<ผ้าใบวัตถุ