Canvas scale() మార్గం
నిర్వచనం మరియు ఉపయోగం
scale() ప్రస్తుత చిత్రక్షేత్రాన్ని పెంచినట్లు లేదా చికిత్సించినట్లు చేయు మార్గం
ప్రకటన:మీరు చిత్రక్షేత్రాన్ని పెంచినట్లయితే, తరువాత చిత్రించబడే అన్ని చిత్రాలు కూడా పెంచబడతాయి. స్థానాలు కూడా పెంచబడతాయి. మీరు వ్రాయగలరు: scale(2,2)అప్పుడు, చిత్రక్షేత్రం యొక్క ఎడమ పై మూలలో రెండు రెట్లు దూరంలో చిత్రక్షేత్రం లోకి చిత్రం లోకి పెట్టబడుతుంది.
ఉదాహరణ
ఉదాహరణ 1
రెక్టాంగలాన్ని చిత్రించండి, 200% పెంచి మళ్ళీ రెక్టాంగలాన్ని చిత్రించండి:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.strokeRect(5,5,25,15);
ctx.scale(2,2);
ctx.strokeRect(5,5,25,15);
సూచన:పేజీ అడుగున మరిన్ని ఉదాహరణలు లభిస్తాయి.
సింథాక్సిస్
context.scale(scalewidth,scaleheight);
పారామీటర్ విలువ
| పారామీటర్ | వివరణ |
|---|---|
| scalewidth | ప్రస్తుత చిత్రక్షేత్రం యొక్క వెడల్పును పెంచండి (1=100%, 0.5=50%, 2=200%, మొదలైనది). |
| scaleheight | ప్రస్తుత చిత్రక్షేత్రం యొక్క పొడవును పెంచండి (1=100%, 0.5=50%, 2=200%, మొదలైనది). |
మరిన్ని ఉదాహరణలు
ఉదాహరణ 2
ఒక రెక్టాంగలాన్ని చిత్రించండి; 200% పెంచి రెక్టాంగలాన్ని మళ్ళీ చిత్రించండి; 200% పెంచి మళ్ళీ రెక్టాంగలాన్ని చిత్రించండి; 200% పెంచి మళ్ళీ రెక్టాంగలాన్ని చిత్రించండి:
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.strokeRect(5,5,25,15);
ctx.scale(2,2);
ctx.strokeRect(5,5,25,15);
ctx.scale(2,2);
ctx.strokeRect(5,5,25,15);
ctx.scale(2,2);
ctx.strokeRect(5,5,25,15);
బ్రౌజర్ మద్దతు
ఈ పట్టికలో అంకుర బ్రౌజర్ వెర్షన్లు ఈ లక్షణాన్ని పూర్తిగా మద్దతు చేస్తాయి.
| చ్రోమ్ | ఎడ్జ్ | ఫైర్ఫాక్స్ | సఫారీ | ఓపెరా |
|---|---|---|---|---|
| చ్రోమ్ | ఎడ్జ్ | ఫైర్ఫాక్స్ | సఫారీ | ఓపెరా |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
ప్రకటన:ఇంటర్నెట్ ఎక్స్ప్లోరర్ 8 మరియు అంతకు ముంది వెర్షన్లు <canvas> ఎలమెంట్ ను మద్దతు చేయవు.
