MetaStanza: Generic WebComponents Widgets for Visualizing SPARQL Results on the Web Toshiaki Katayama Database Center for Life Science, Research Organization of Information and Systems, 178-4-4 Wakashiba, Kashiwa-shi, Chiba 277-0871, Japan ktym@dbcls.jp Abstract. SPARQL queries are used to retrieve information from RDF datasets while visualizing the results on a web page still requires development of custom modules especially when it needs to be graphically displayed. To ease this situa- tion, I have developed MetaStanza as a generic framework to generate typical visualizations based on the TogoStanza and the d3sparql.js tools that have also been in-house developed. With MetaStanza, user can specify a SPARQL query API with desired parameters to embed 15 different types of visualizations in any web site as a WebComponents widget. Keywords: SPARQL, JavaScript, WebComponents, visualization, MetaStanza. 1 Introduction To introduce a modularity in web applications, IFRAME or WebComponents are being used with which a web page can be constructed as a combination of widgets showing different information blocks. The TogoStanza framework1 enables to create such modules showing information obtained from SPARQL queries and has been used to develop the TogoGenome database2 and several other databases in life sciences [1]. Even with TogoStanza, web application developers still needed to be responsible for the implementation of a visualization in each widget. To lower the burden, I have cre- ated the d3sparql.js library 3 to generate typical visualizations by transforming a SPARQL Query Result JSON Format into an expected JSON structure such as tables, trees and graphs. However, it was still required to code some JavaScript for calling functions of the d3sparql.js in each TogoStanza module. To resolve this situation, I developed a set of MetaStanza which currently provides 15 different typical types of visualizations on top of the TogoStanza framework and the d3sparql.js library. As a result, users can embed a MetaStanza in any web page only by writing a small amount of the HTML markup which in turn automatically converted to a WebComponents widget showing the result of a designated SPARQL query. 1 http://togostanza.org/ 2 http://togogenome.org/ 3 http://biohackathon.org/d3sparql/ Copyright © 2019 for this paper by its authors. Use permitted under Creative Commons License Attribution 4.0 International (CC BY 4.0). 2 2 Results Each MetaStanza takes the URI of a SPARQL query or a REST API which returns the SPARQL Query Result JSON Format with some additional parameters to adjust visualizations (Fig 1). Fig. 1 Embedding MetaStanza in a web page where the italic parts are variables. Currently 15 different types of visualizations are available4 including barchart, cir- clepack, coordmap, dendrogram, forcegraph, htmlhash, htmltable, namedmap, piechart, roundtree, sankey, scatterplot, sunburst, treemap, and treemapzoom (Fig 2). Fig 2. MetaStanza showing a zoomable treemap visualization embedded in the help page (left panel) and a web page (right panel). The source code of MetaStanza5 and d3sparql.js are freely available on GitHub and example REST APIs returning SPARQL results are provided by the SPARQList 6 which can be easily customized according to the developer’s needs. Reference. 1. Katayama T, Kawashima S, Okamoto S, Moriya Y, Chiba H, Naito Y, Fujisawa T, Mori H, Takagi T: TogoGenome/TogoStanza: modularized Semantic Web genome database. Database (Oxford) 2019, 2019:1–11. 4 http://togostanza.org/dist/metastanza/ 5 https://github.com/ktym/metastanza 6 http://togostanza.org/sparqlist/