AGraphDrawingandTranslationServiceon StinaBridgeman,AshimGargandRobertoTamassia DepartmentofComputerScience thewww* Abstract.Bothpractitionersandresearcherscantakebetteradvantageofthelatestdevelopmentsingraphdrawingifimplementationsof graphdrawingalgorithmsaremadeavailableonthewww.weenvision Providence,RI02912{1910,USA fssb,ag,rtg@cs.brown.edu BrownUniversity agraphdrawingandtranslationserviceforthewwwwithdualobjectives:drawinguser-speciedgraphs,andtranslatinggraph-descriptions availableonthewww,wecanhelpbothpractitionersandresearcherstousethe 1Introduction Motivatedbynumerousapplications,newgraphdrawingalgorithmsarecontinuallybeingdeveloped.Bymakingimplementationsofgraphdrawingalgorithmableathttp://loki.cs.brown.edu:8081/graphserver/home.html. realizingthisvision,wehavedevelopedaprototypeservicewhichisavail- andgraphdrawingsfromoneformattoanother.asarststeptoward latesttechnologicalinnovations.this,however,alsorequirestacklingtheproblemoftheover-abundanceofformatsfordescribinggraphsanddrawings.while thereareeortsinthisdirection[3],thereisstillnosingleuniversally-accepted format.therefore,researcherstypicallydenetheirownformatswhenimplementinganalgorithm.becauseausercannotbeexpectedtoknowtheformat another.thiswillallowuserstoemployalargenumberofalgorithmswhile thatcanconvertthedescriptionsofgraphsanddrawingsfromoneformatto knowingonlyafewformats. twokindsofservices: {adrawingserviceforconstructingadrawingofagraphgivenbytheuser, WeenvisionagraphdrawingandtranslationserviceontheWWWthatoers usedbyeachandeveryimplementation,itisadvantageoustohavetranslators tioner'sviewpoint,shegetsacentralfacilityfromwhereshecan\shoparound" Suchaservicewouldbenetbothpractitionersandresearchers.Fromapracti- {atranslationservicefortranslatingthedescriptionofagraph/drawingfrom 9423847andagraduatefellowship,bytheU.S.ArmyResearchOceundergrant?ResearchsupportedinpartbytheNationalScienceFoundationundergrantCCR{ usinganalgorithmchosenbyher,and DAAH04{96{1{0013,andbyagiftfromTomSawyerSoftware. oneformattoanother.
foranalgorithmappropriateforherapplication.fromaresearcher'sviewpoint, shegetsarepositoryofalgorithmswhereshecanstudyandcomparetheirpropertiesandperformances.inaddition,bothpractitionersandresearcherscanuse thisservicejustfortranslationpurposes.potentialusesofthisserviceinclude: {creatingadatabaseofgraphsoccurringinuser-applications,and {demonstrationpurposesineducationalsettings. {translatingbetweentheformatsfordescribinggraphsandtheirdrawings, {drawinggraphsfromuser-applications, {studyingandcomparinggraphdrawingalgorithms, thegraphssenttoitbytheusers[5]. constructedusingdot[4].thisservicealsomaintainsadatabaseconsistingof thatacceptsagraphsenttoitbyemailandreturns,alsobyemail,adrawing drawingalgorithmsavailableonthewww.abibliography(andurls)ofmany implementationsismaintainedbygeorgsanderathttp://www.cs.uni-sb.de/ (visithttp://www.research.att.com/dist/drawdag/mailserverfordetails) RW/users/sander/html/gstools.html.StephenNorthhasdesignedaservice Wehavedevelopedaprototypegraphdrawingandtranslationserviceonthe Researchershaverecognizedtheneedofmakingimplementationsofgraph WWW.Tothebestofourknowledge,thereisnoothertranslationserviceover thewww,andtheclosestapproximationtoawwwgraphdrawingservice ways,byusinganhtmlform,orajava-basedgrapheditorembeddedinaweb istheemailserviceprovidedbystephennorth.theotherimplementations theformatoftheoutput,andthedrawingalgorithm(ifthegraphistobedrawn). selectstheformatoftheinput,thetypeofservicedesired(drawing/translation), page.inatypicalscenario,theuserprovidestheserverwiththeinputgraph,and onaremotemachine. home.html,andisveryeasytouse.theusercaninteractwiththeserviceintwo downloadedandinstalledlocally,ratherthanbeinginteractiveserversrunning availableonthewwwaresourcecodepackages/executableswhichmustbe Theserverreceivestherequest,performsthedesiredservice,andsendsbackthe result adrawingoratranslation totheuser. InSection2,wepresentthesoftwarearchitectureofourprototypeservice.In Ourserviceislocatedathttp://loki.cs.brown.edu:8081/graphserver/ Section3,wegivesomeexampleinteractionsbetweenusersandourprototype 2SoftwareArchitectureofourPrototypeService service.finally,insection4,wedescribefuturework. Webelievethatagraphdrawingandtranslationserviceshouldsatisfythefollowingrequirements: {Theinput/outputformatusedforagraphshouldbeasindependentas {Itshouldbeeasytoaddnewformatsandalgorithmstotheservice. possiblefromthealgorithmusedfordrawingit.
Server Translator Client Graph Editor database of translation functions Networking Interface graph or drawing Module Module translation with the names graph or graph or its format and the format the translation {Theuserinterfaceshouldbesimpleandintuitive. {Thearchitectureshouldbeclient-serverbasedwiththeassumptionthatthe Fig.1.Thesoftwarearchitectureofourgraphdrawingandtranslationservice. parser Manager clientmachineandthenetworkmaybeslow,whereastheserverisreasonably user-provided graph information names the graph and/or Client input and output name an formats an algorithm algorithm Forms Interface Graph Drawer database user.therearecurrentlytwoversionsoftheclient theformsinterfaceand Client.Theclientisresponsibleformaintainingtheinterfacepresentedtothe machine;theothercomponentsallresideontheserver. translator,andthegraphdrawer.onlytheclientcomponentrunsontheuser's vicehasvemainlogicalcomponents:theclient,themanager,theparser,the Figure1showsthesoftwarearchitectureofourprototypeservice.Theser- fast.thisassumptionisimportantforanetworksuchasthewww. algorithms ofvertices,edges,andedgebends,andenablingtheusertointeractivelycreate moduleisresponsibleforcreatingandmanagingthegrapheditorwindow,supportingbasicgrapheditingoperationssuchasinsertion,deletion,andmovement thegrapheditor. oftwomodules,theinterfacemoduleandthenetworkingmodule.theinterface thattheusercanlltoplaceherrequest.nocodeisneededtohandleserver communicationsormanagetheform,asthisisdonebytheuser'swebbrowser. FormsInterface.TheformsinterfaceissimplyanHTMLpagewithaform municatingwiththeserver itsendstherequest,providestheinterfacewith agraphtobesenttotheserver.thenetworkingmoduleisresponsibleforcom- GraphEditor.ThegrapheditorisimplementedasaJavaappletandconsists
spawnsmanythreadsforhandlingtheuserrequests. updatesonthecurrentstatusoftherequest,receivestheresponse,andensures Parser.Theparserreceivesfromthemanageracharacterstringthatcontainsa tohandlepotentiallysimultaneousrequestsfrommultipleclients,andtypically bleforcoordinatingtheparser,translator,andgraphdrawer.itismultithreaded goesdown. Manager.Themanageristhecentralcomponentoftheservice,andisresponsi- thatiftheusersendsarequest,aresponsewillbereceivedeveniftheserver owninput/outputformatwhichmaybedierentfromtheformatofthegraph requestatranslation.thetranslatortakesasinputagraphoradrawingand userrequestandextractsfromitthefollowinginformation:graphtobedrawn, formatoftheinput,typeofservicedesired(drawing/translation),formatofthe done,andperformsthedesiredtranslation.itmaintainsadatabaseofbasic givenbytheuser.therefore,theremaybeaneedfortranslatingfromone thenamesofthecurrentformatandtheformattowhichtranslationistobe formattoanotherondrawingrequests.inaddition,theusermayexplicitly Translator.Eachgraphdrawingalgorithmsupportedbytheservicedenesits output,anddrawingalgorithmtouse(ifthegraphistobedrawn). dierentexpressivepowersingeneral,somelossofinformationmayoccurduring atranslation.currently,thesequenceofbasictranslationfunctionsneededis tocarryoutthedesiredtranslation.noticethatbecausedierentformatshave explicitlycodedsothattheproblemoftranslatingfromamorepowerfulformat translationfunctions.givenatranslationrequest,itconstructsasequenceof basictranslationfunctionswhichisthenappliedtotheinputgraphordrawing thetic,gds,tomsawyer,andmalf,andthefollowingoutputformats:paren- thetic,gds,postscript,gif,gnuplot,mif,gandmalf. denetheirownkeywords.gds,tomsawyer,andmalfareminorvariations oftheformatsusedbygiotto[9],thetomsawyergraphlayouttoolkit, enclosedbyparentheses.itisveryexibleinthesensethatitallowstheusersto andgd-workbench[1],respectively.gnuplot,mifandgaretheformatsof Ourprototypeservicecurrentlysupportsthefollowinginputformats:paren- toalesspowerfuloneandthenbacktoamorepowerfuloneisavoided. algorithmandagraphdescribedinthealgorithm'sinputformat,andconstructs gnuplot,framemakerandxfig,respectively. GraphDrawer.Thegraphdraweracceptsasinputthenameofagraphdrawing Theparentheticformat[7]consistsofnestedlistsofkeyword-valuepairs labels,whichexpandstheverticestoaccommodatelabels.pairs[2]isourim- plementationofthealgorithmof[6],whichusesst-numberings.planarizerisnot adrawingofthegraphusingthealgorithm.currentlywesupportthefollowing implementationofgiotto,weoeravariationofitcalledgiotto-withtionapproachandabend-minimizationmethod[8].inadditiontotheoriginal threealgorithms:giotto,pairs,andplanarizer. GIOTTO[9]isageneral-purposedrawingalgorithmbasedontheplanariza-
morebrowserssothatthisrequirementisbecominglessrestrictive. asnetscape2.0orhigherformostplatforms.javasupportisbeingaddedto forms.thegrapheditorrequiresabrowserthatsupportsthejava1.0api,such onaclientmachineotherthanacommonlyavailablewebbrowser.theforms interfacerequiresabrowser,suchaslynxornetscape,thatsupportshtml vertices. planarembeddingoftheinputgraphbyreplacingcrossings(ifany)withdummy actuallyadrawingalgorithm:itistherststepofgiotto,whichconstructsa threading,andwithsucientmemoryforstoringtheusers'graphsanddrawings. Ourservicesatisestherequirementsstatedearlierinthissectionasfollows: Theservershouldbereasonablyfastwithsomekindofsupportformulti- Ourprototypeservicedoesnotrequireanyspecialhardwareorsoftware {Theuserisfreetospecifyanyinput/outputformatindependentofthealgorithmrequestedbyher.Thisdecouplingismadepossiblebythepresence ofthetranslator. mentationofanalgorithmcandeneitsowninput/outputformatprovided {Itisveryeasytoaddnewformatsandalgorithms.Alsonoticethatanimple- 3UsingourPrototypeService {Boththeformsinterfaceandthegrapheditoraresimpleandintuitive. {Allthecomputationallyintensiveworkisdonebytheserver.Hence,the servicecanbeusedbyclientswithlimitedresourcesaswell. betweenanewformatandtheparentheticformat. thatitisequippedwithatranslatorto/fromaformatalreadysupportedby service.webelievethatinmostcasesitwillbesucienttogiveatranslator usingthegiottoalgorithm,andwantsthedrawingtobeinpostscriptformat. Wenowgivetwoscenariostoshowhowauserinteractswithourprototype serviceandhowtheservicesatisesauserrequest. Scenario1.UsingtheFormsInterface(seeFigure2). Sheloadstheservice'shomepageintoherbrowser,clicksontheformsinterface link,andgetsanhtmlform.shecanspecifyagraphinoneoftwoways intheformitself.infigure2(a)shechoosesthelatteroptionandentersthe eitherbygivingtheurlofthegraphorbytypingthedescriptionofthegraph thenclicksontheappropriateselectionbuttonstospecifythattheinputformat ismalfinput,thedrawingalgorithmisgiotto,andtheoutputformatis graph(inmalfinputformat)intothetextareaprovidedintheform.she SupposetheuserwantstodrawagraphdescribedintheMALFinputformat postscript,andsubmitstheformtotheserver.figure2(a)showsapartofthis characterstring.themanagergivesthisstringtotheparserwhichextracts user-lledform. fromittheinputgraph,thetypeofservicerequested(drawing),thenames oftheinputandoutputformats(malfinputandpostscript,respectively), Theserverreceivestheformandpassesittothemanagerencodedasa
putformatusinggiotto,withoutputinpostscriptformat.(a)partoftheuser-lled form;(b)drawinginpostscriptformatreturnedtotheuseranddisplayedbythe Fig.2.Scenario1.Usingtheformsinterface.DrawingagraphdescribedinMALFin- (b) drawingisreturnedtothemanageringds,theoutputformatofgiotto,so browserwithghostview. themanagermustonceagaininvokethetranslatortoconvertthedrawingto andthedrawingalgorithmtouse(giotto).themanagerthenconsultsthe inputtogds.themanagersendsthegraphdescriptioningdsformattothe graphdrawer,whichusesgiottotoconstructadrawingofthegraph.the graphdrawertodeterminethegraphformatrequiredbythedrawingalgorithm (GIOTTOusesGDS)andcallsthetranslatortoconvertthegraphfromMALF Scenario2.UsingtheGraphEditor(seeFigure3). (assumingthebrowserisconguredtoautomaticallydisplaypostscriptles; otherwisetheuserwouldbepromptedtodownloadthele). automaticallyloadsthele,displayingitonthescreenasshowninfigure2(b) postscript.thenaldrawingissavedtoaleontheserverandtheurlofthis sherstclicksontheinteractiveappletinterfaceandthenonthestartclientlink. leisreturnedtotheclient. Thiscausesagrapheditorwindowtoappear.Figure3(a)showsagrapheditor Asbefore,theuserloadstheservice'shomepageintoherbrowser.Thistime Backontheclient,theuser'sbrowserreceivestheURLsentbytheserverand windowwithasamplegraphconstructedinteractivelybytheuser.toobtaina drawingofthegraphtheusermustspecifythealgorithmandtheoutputformat
(a) (b) andtheinputgraph;(b)drawingreturnedbytheserver;(c)statuswindowdisplayed wherethedrawingistobedisplayedinaneditorwindow.(a)theinterfaceoftheeditor Fig.3.Scenario2.Usingthegraph-editor.DrawingagraphwithGIOTTO-with-labels, whiletherequestisbeinghandledbytheserver. bymakingtheappropriateselectionsonthepulldownmenusatthetopofthe window.theexampleshowsthealgorithmgiotto-with-labelsandtheoutput (c) cancelarunningrequest(figure3(c)).theprocessingoftherequestonthe userwithinformationabouttheprocessingoftherequestandallowingherto \Run"buttontosendtherequest. format\interactive".(selecting\interactive"astheoutputformatwillcause serversidefollowsthesamebasicpatternasfortheformsinterface(parsing, supportedbythisinterfaceandwillbedisplayedinanewbrowserwindow.) Oncethealgorithmandoutputformathavebeenselected,theuserclicksonthe thedrawingtobedisplayedinanothereditorwindow;alloftheotherformats translation,drawing,translation);thedierencesareaslightlydierentfront- supportedbytheformsinterface,suchasparentheticnotationandgif,arealso Sendingtherequestcausesasmallstatuswindowtopopup,providingthe
endforreadingandparsingtherequestandsomeextramachinerytoensure thatresponsesdestinedforthesameclientaresentbackintheproperorder. 4FutureWork usingthebrowser'sown\saveas"mechanism. atextformat),whichisdisplayedinabrowserwindowandcanthenbesaved requesttotheservertoconvertthegraphintosomeotherformat(presumably andresubmittedtotheserver.itcanalsobesaved,bysendingatranslation scaledtotinthewindow.thisdrawingisfullyeditable,andcanbemodied chosenoutputformatwasinteractive)withtheresultingdrawing(figure3(b)), Whentherequestcompletes,anewgrapheditorwindowappears(sincethe Thereareseveraldirectionsforfurtherworkontheservice: {AddingsupportfornewformatssuchasGML[3]. {Addingnewalgorithms.WeplantostartwithimplementationsalreadyavailablefreelyontheWeb. References {Providingaservice(accessiblethroughtheWeb)throughwhichtheusers {Addingsupportforincrementalgraphdrawing. {Addingaprogrammer'sinterface,whereasmallJavaorC++libraryis providedtohandlecommunicationswiththeserver,allowingausertowrite aprogramwithacalltotheserverasasubroutine. 1.L.Buti,G.DiBattista,G.Liotta,E.Tassinari,F.Vargiu,andL.Vismara.GDworkbench:asystemforprototypingandtestinggraphdrawingalgorithms.Graph Drawing(Proc.GD'95).LNCS,1027:76{87,1996.F.J.Brandenburg,Ed. experimentalcomparisonoffourgraphdrawingalgorithms.comput.geom.theory canconductexperimentalstudiesongraphdrawingalgorithms. 2.G.DiBattista,A.Garg,G.Liotta,R.Tamassia,E.Tassinari,andF.Vargiu.An Appl.,1996.toappear. 3.M.Himsolt.GML:GraphModellingLanguage.Manuscript,UniversitatPassau, 4.E.KoutsoosandS.North.Drawinggraphswithdot.Technicalreport,AT&T 5.S.North.5114directedgraphs,1995.Manuscript.Availableat 6.A.PapakostasandI.G.Tollis.Improvedalgorithmsandboundsfororthogonal http://www.uni-passau.de/himsolt/graphlet/gml. Innstrae33,94030Passau,Germany,1996. BellLaboratories,MurrayHill,NJ.,1995.dotuser'smanual.Availableat http://www.research.att.com/dist/drawdag. drawings.graphdrawing(proc.gd'94).lncs,894:40{51,1995. ftp.research.att.com/dist/drawdag. 7.S.Singh.DocumentationforParen-to-GDS.Manuscript,Dept.ofComp.Sci., 8.R.Tamassia.Onembeddingagraphinthegridwiththeminimumnumberof 9.R.Tamassia,G.DiBattista,andC.Batini.Automaticgraphdrawingandreadabilityofdiagrams.IEEETrans.Syst.ManCybern.,SMC-18(1):61{79,1988. ThisarticlewasprocessedusingtheLaTEXmacropackagewithLLNCSstyle BrownUniversity,1991. bends.siamj.comput.,16(3):421{444,1987.