What is the difference between getContext('webgl') vs ...

A drawing context lets you draw on the canvas. Calling getContext with "2d" returns a CanvasRenderingContext2D object, whereas calling it with " ... 2022DeveloperSurveyisopen!Takesurvey. Home Public Questions Tags Users Companies Collectives ExploreCollectives Teams StackOverflowforTeams –Startcollaboratingandsharingorganizationalknowledge. CreateafreeTeam WhyTeams? Teams CreatefreeTeam Collectives™onStackOverflow Findcentralized,trustedcontentandcollaboratearoundthetechnologiesyouusemost. Learnmore Teams Q&Aforwork Connectandshareknowledgewithinasinglelocationthatisstructuredandeasytosearch. Learnmore WhatisthedifferencebetweengetContext('webgl')vsgetContext('3d')? AskQuestion Asked 8years,1monthago Modified 8years,1monthago Viewed 14ktimes 12 5 IstartlearningWebGL,andbecauseihavefoundsomeoldtutorials,idontknowwhatistherightwayin2014? Istartedthe(basic),andintutorialstheysaysomethinglike: usegetContext('2d')andifyouwanttouseWebGLthenyouput3dinsteadof2d Butnowthatiamlearning,ifoundtutorialstalkingaboutgetContext('webgl')andnotgetContext('3d'). Havethesyntaxechanged? Andthereisthisarticlesayingthatthereisnoreal3D,buttheyonlyusingRayCasting?! htmlcanvaswebgl Share Improvethisquestion Follow askedMar30,2014at23:32 AbdelouahabAbdelouahab 6,9291010goldbadges4848silverbadges8080bronzebadges 4 1 MDN'sreferencelistswebglandexperimental-webglassupportedinsomebrowsers. – IMSoP Mar30,2014at23:39 sothe3dwordhasbeendeprecated? – Abdelouahab Mar30,2014at23:43 1 Idon'tknowthefullstory,whichiswhyIonlyaddedacomment,butthatpagedoesn'tmentiona'3d'contexteverhavingexisted.Doyouhaveanexamplewhere'3d'isbeingrecommended?Perhapstheauthorwasjustguessing,since'2d'wasinitiallytheonlyoptionavailable. – IMSoP Mar30,2014at23:45 thewordwebglwillmakesense,sincewebglisnotonly3d – Abdelouahab Mar30,2014at23:50 Addacomment  |  1Answer 1 Sortedby: Resettodefault Highestscore(default) Datemodified(newestfirst) Datecreated(oldestfirst) 19 MozillaDeveloperNetowrk(MDN)Docssaysthis: getContext(inDOMStringcontextId)RenderingContextReturnsadrawingcontextonthecanvas,ornullifthecontextIDisnotsupported.Adrawingcontextletsyoudrawonthecanvas.CallinggetContextwith"2d"returnsaCanvasRenderingContext2Dobject,whereascallingitwith"experimental-webgl"(or"webgl")returnsaWebGLRenderingContextobject.ThiscontextisonlyavailableonbrowsersthatimplementWebGL. Results: |Context|Chrome(webkit)|Firefox(gekko)| |------------------|------------------------|------------------------| |2d|CanvasRenderingContext2D|CanvasRenderingContext2D| |3d|null|null| |webgl|WebGLRenderingContext|WebGLRenderingContext| |experimental-webgl|WebGLRenderingContext|null| Irecommendreadinguponthewebglwiki:http://www.khronos.org/webgl/wiki/FAQ HereisthefullWhatistherecommendedwaytoinitializeWebGL?section: (ThoughIsuggestyoureaditrightfromthewikiincaseitchanges!) WhatistherecommendedwaytoinitializeWebGL? Itisrecommendedthatyoucheckforsuccessorfailuretoinitialize.IfWebGLfailstoinitializeitisrecommendedyoudistinguishbetweenfailurebecausethebrowserdoesn'tsupportWebGLandfailureforsomeotherreason.IfthebrowserdoesnotsupportWebGLthenpresenttheuserwithalinkto"http://get.webgl.org".IfWebGLfailedforsomeotherreasonpresenttheuserwithalinkto"http://get.webgl.org/troubleshooting/" YoucandetermineifthebrowsersupportsWebGLbycheckingfortheexistenceofWebGLRenderingContext. if(window.WebGLRenderingContext){ //browsersupportsWebGL } IfthebrowsersupportsWebGLandcanvas.getContext("webgl")returnsnullthenWebGLfailedforsomereasonotherthanuser'sbrowser(noGPU,outofmemory,etc...) if(!window.WebGLRenderingContext){ //thebrowserdoesn'tevenknowwhatWebGLis window.location="http://get.webgl.org"; }else{ varcanvas=document.getElementById("myCanvas"); varctx=canvas.getContext("webgl"); if(!ctx){ //browsersupportsWebGLbutinitializationfailed. window.location="http://get.webgl.org/troubleshooting"; } } Note:YouMUSTcheckthatthebrowsersupportsWebGLtoknowthatgettingnullfromcanvas.getContext()means Thereisawrapperthatwilldoallofthisforyouhere. Exampleusingthewrapper Share Improvethisanswer Follow answeredMar31,2014at0:17 communitywiki ThorSummoner 3 ahhh!thankyou!sodefinitlyno3dandhowaboutthearticlesayingthatthecanvasfakethe3dtouseonly2d,orisitbecauseitisanoldarticle? – Abdelouahab Mar31,2014at3:00 1 @Abdelouahab,sayingthat3dAPIisactuallya2dAPIisveryoldquestion:stackoverflow.com/questions/13135210/…It'sjustwayofthinking,really.Ifsomeoneasksyou,canvasusesreal3d,it'snotfakinganything. – DraganOkanovic Mar31,2014at8:06 @AbstractAlgorithmahhhthankyou!nowiupdatemyinformation!internetcontainslotofoldtutorial,andthereareoutdatedones,sotheyneedtobefixed!thankyouagain^_^ – Abdelouahab Mar31,2014at18:34 Addacomment  |  YourAnswer ThanksforcontributingananswertoStackOverflow!Pleasebesuretoanswerthequestion.Providedetailsandshareyourresearch!Butavoid…Askingforhelp,clarification,orrespondingtootheranswers.Makingstatementsbasedonopinion;backthemupwithreferencesorpersonalexperience.Tolearnmore,seeourtipsonwritinggreatanswers. Draftsaved Draftdiscarded Signuporlogin SignupusingGoogle SignupusingFacebook SignupusingEmailandPassword Submit Postasaguest Name Email Required,butnevershown PostYourAnswer Discard Byclicking“PostYourAnswer”,youagreetoourtermsofservice,privacypolicyandcookiepolicy Nottheansweryou'relookingfor?Browseotherquestionstaggedhtmlcanvaswebgloraskyourownquestion. TheOverflowBlog Makeyouropen-sourceprojectpublicbeforeyou’reready(Ep.444) Thescienceofinterviewingdevelopers FeaturedonMeta AnnouncingthearrivalofValuedAssociate#1214:Dalmarus Improvementstositestatusandincidentcommunication RetiringOurCommunity-SpecificClosureReasonsforServerFaultandSuperUser Temporarilypausingthesitesatisfactionsurvey StagingGround:ReviewerMotivation,Scaling,andOpenQuestions Linked 13 WhydoesthisstatethatWebGLisa2DAPI,nota3DAPI? 3 whatarethegraphicallimitsWebGLandThree.jscanhandlegracefully? Related 2185 WhatarevalidvaluesfortheidattributeinHTML? 2458 Makeadivfilltheheightoftheremainingscreenspace 641 WhatisthedifferencebetweenHTMLdivandspanelements? 881 What'sthedifferencebetweenand,and? 2818 HowdoImodifytheURLwithoutreloadingthepage? 2513 Howtomakeadiv100%heightofthebrowserwindow 1721 Whatdoesenctype='multipart/form-data'mean? 3073 HowdoIdisabletheresizablepropertyofatextarea? 1107 Whatisthedifferencebetween