కాన్వెక్స్ setTransform() పద్ధతి
నిర్వచనం మరియు ఉపయోగం
కాన్వెక్స్ పైని ప్రతి వస్తువుకు ఒక ప్రస్తుత మార్పదం ఉంది.
setTransform() పద్ధతి ప్రస్తుత మార్పదంను యూనిట్ మార్పదంగా పునఃస్థాపిస్తుంది మరియు ప్రత్యేకంగా అదే పారామీటర్లతో అదే మార్పదాన్ని అనుసరిస్తుంది transform().
లేదా మాటలో, setTransform() మీరు ప్రస్తుత పరిసరాన్ని స్కేల్, రోటేషన్, తిరుగుపెట్టడం మరియు స్లోయి చేయగలరు.
పేర్కొనుట:ఈ మార్పదం మాత్రమే setTransform() మార్పదం కాల్ తర్వాత చిత్రణను ప్రభావితం చేస్తుంది.
ఉదాహరణ
ఒక ఆయతను చిత్రణ చేయండి, setTransform() ద్వారా పునఃస్థాపించి కొత్త మార్పదంతో చిత్రణ చేయండి, పునఃస్థాపించి కొత్త మార్పదంతో మరోసారి చిత్రణ చేయండి. ప్రతిసారి మీరు setTransform() ని కాల్ చేసినప్పుడు, అది ముందస్తు మార్పదంను పునఃస్థాపించి కొత్త మార్పదాన్ని నిర్మిస్తుంది కాబట్టి, క్రింది ఉదాహరణలో ఎరుపు రంగు ఆయత కనిపించదు, ఎందుకంటే అది నీలరంగు ఆయత కింద ఉంది:
జావాస్క్రిప్ట్:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.fillStyle="yellow";
ctx.fillRect(0,0,250,100)
ctx.setTransform(1,0.5,-0.5,1,30,10);
ctx.fillStyle="red";
ctx.fillRect(0,0,250,100);
ctx.setTransform(1,0.5,-0.5,1,30,10);
ctx.fillStyle="blue";
ctx.fillRect(0,0,250,100);
సంజ్ఞాక్రమణం
context.setTransform(a,b,c,d,e,f);
పారామీటర్ విలువలు
| పారామీటర్స్ | వివరణ |
|---|---|
| a | హోరిజంటల్ రోటేషన్ చిత్రణ. |
| b | హోరిజంటల్ స్లోయి చిత్రణ. |
| c | వర్టికల్ స్లోయి చిత్రణ. |
| d | వర్టికల్ జాబ్తు చిత్రణ. |
| e | అడ్డతిరుగు గ్రాఫిక్ డ్రాయింగ్ |
| f | అడ్డతిరుగు గ్రాఫిక్ డ్రాయింగ్ |
బ్రౌజర్ మద్దతు
ఈ పట్టికలో పేర్కొన్న సంఖ్యలు ఈ లక్ష్యాన్ని పూర్తిగా మద్దతు ఇచ్చే మొదటి బ్రౌజర్ వెర్షన్ని నిర్దేశిస్తాయి.
| చ్రోమ్ | ఎడ్జ్ | ఫైర్ఫాక్స్ | సఫారీ | ఆపెరా |
|---|---|---|---|---|
| చ్రోమ్ | ఎడ్జ్ | ఫైర్ఫాక్స్ | సఫారీ | ఆపెరా |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
పేర్కొనుట:Internet Explorer 8 మరియు అంతకు ముంది వెర్షన్లు <canvas> అంశాన్ని మద్దతు ఇవ్వలేదు.
