Sgvizler has moved to github. This site and its repository will no longer be maintained.

Version 1 (modified by martin, 4 years ago) (diff)


Using Sgvizler 0.5

There are three intended ways to use Sgvizler. The first is to write queries and store them in <div> elements using attributes Sgvizler recognizes. These queries are read and executed on page load and the results are displayed in the same <div> element. The second is to setup a query form webpage where users can write and execute their own queries and view the results formatted as different types of charts and maps. The third is to explicitly call Sgvizler's javascript functions.

  1. Query stored in <div>
  2. Query Form

The two first are described below.

Query stored in <div>

Add <div> elements of the following format to your webpage:

<div id="sgvzl_example1"
     data-sgvizler-query="SELECT ?class (count(?instance) AS ?noOfInstances)
                          WHERE{ ?instance a ?class }
                          GROUP BY ?class
                          ORDER BY ?class"
     data-sgvizler-chart-options="is3D=true|title=Number of instances"
     style="width:800px; height:400px;"></div>

Explanation of attributes (Required attributes are marked by *):

Value: some string.
Description: The identifier for the <div> element. Necessary for Sgvizler to locate where to put the chart. The value must be unique to all elements on the same page.
Value: query string
Description: The SPARQL SELECT query specifying a query result to fit the chosen diagram. See DesigningQueries for more details.
Value: a string
Description: URL to SPARQL endpoint.
Note: There must of course exist a designated SPARQL endpoint, but this usually better set in the initialisation of Sgvizler; see Setup.
Value: json, jsonp or xml
Description: The format Sgvizler shall ask the endpoint to return query results as. Default is json.
Value: a string
Description: List of URLs to RDF files. The list must be separated by |-characters, and the configured SPARQL endpoint must allow FROMs in the query.
Note that data-sgvizler-rdf is just a shorthand way of telling Sgvizler to include a list of FROMs in the query. The configured endpoint reads the listed RDF files and executes the query on them; this means that the files must be accessible to the endpoint and the endpoint must be setup to allow FROM in queries.
Value: chart id
Description: The chart type to draw. Possible values are found in the id column in the table a DesigningQueries?. Default value is gLineChart.
Value: string
Description: List of options which are sent to the draw() function of the given chart type. Each option is given as option=value and each option-value-pair is separated with a vertical bar, e.g. option1=value1|option2=value2. If you are using a Google chart type you should consult the page they have for that chart type for the available options and permissible values. If your using a different chart type, you should find options and values on this page and/or in the file  sgvizler.visualization.js.
Note: This is not fully working.
Description: To what extent Sgvizler shall give feedback to the user. The default value is 2.
Value: a string of css
Description: This is just the normal way of adding css style to your elements, but width and height will also be picked up by Sgvizler to determine the size of the chart. The default values are respectively 800px and 400px.
Value: part of URL
Description: Part of URL to append to SPARQL endpoint URL such that (URL to SPARQL endpoint) + (this variable) + (query) = (query results (in a web browser)). Default is ?output=text&amp;query=.
Value: URL
Description: URL to some SPARQL validator such that (this variable) + (query) = (validation results for query). Default value is;outputFormat=sparql&amp;linenumbers=true&amp;query=.

Query Form

This form closely resembles the query forms of  SPARQLer and  Snorql. The form is found here:  sgvizler.html Write the query in the textarea, including necessary prefix declarations. In addition, it is possible to select different chart types in a drop-down menu and to specify the size of the resulting chart. The query result set format must fit the chosen chart type. More details are given in UserFunctions.