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

This page conserns Sgvizler/0.5.
Other available versions:

Sgvizler 0.5 Setup

To get Sgvizler, get the file sgvizler.html in the latest source:release and use it as a starting point to design your own visualization service for a SPARQL endpoint or RDF file(s). You can also use on of the example files found in the example folder in the latest release.

The file sgvizler.html contains examples of the two different ways of using Sgvizler. It is a bare-bones example html file with hotlinks to all the necessary javascripts; it links to the latest release of Sgvizler. Download this file to your server, change a few variables in this file as explained below, and you should be up and running. You can choose to download all the linked javascripts or you can stay "hotlinked".

Configuration is done by setting the variables in the javascript element in the html file, see below. The most important variable is endpoint. (Defaults are set in the javascript file, so this file should work without any changes, although it will not query the endpoint you probably want.) Settings are overwritten in the sequence you would expect: Settings in the html script element overwrites the defaults in the javascript file, and settings in an html element, e.g. by using data-sgvizler-chart-type overwrites the global settings (only for the given element, that is).

The block below shows an excerpt of the head of html file using Sgvizler. The first lines includes the necessary javascripts, including Sgvizler, the remaining lines configures this instance of Sgvizler. Uncomment and change the relevant attributes to fit your setup.

<script type="text/javascript" src=""></script>
<script type="text/javascript" src=""></script>
<script type="text/javascript" id="sgvzlr_script" src=""></script>
<script type="text/javascript">
  // CONFIGURATION Sgvizler 0.5: Set variables to fit your setup.
  // NB! Do not let the last item in a list end with a comma.

   //// Query settings. The defaults settings are listed.
   sgvizler.option.query = {
       // Default query. 
       //'query':                "SELECT ?class (count(?instance) AS ?noOfInstances)\nWHERE{ ?instance a ?class }\nGROUP BY ?class\nORDER BY ?class",

       // Endpoint URL. 
       //'endpoint':             "",

       // Endpoint output format. 
       //'endpoint_output':      'json',  // 'json', 'jsonp' or 'xml'.

       // This string is appended the 'endpoint' variable and the query to it again to give a link to the "raw" query results.
       //'endpoint_query_url':   "?output=text&amp;query=",

       // URL to SPARQL validation service. The query is appended to it. 
       //'validator_query_url':  ";outputFormat=sparql&amp;linenumbers=true&amp;query=",

       // Default chart type. 
       //'chart':                'gLineChart',

       // Default log level. Must be either 0, 1, or 2. 
       //'loglevel':             2

   //// Prefixes
   // Add convenient prefixes for your dataset. rdf, rdfs, xsd, owl
   // are already set.  Examples: 
   sgvizler.option.namespace['wd'] = '';
   sgvizler.option.namespace['w']  = '';

   //// Your chart drawing preferences. The defaults are listed.
   // See the Google visualization API for available options for
   // Google charts, and the Sgvizler homepage for other
   // options. Options applicable to all charts are put in the
   // "root" of sgvizler.chartOptions. Chart specific options are
   // put in a "child" with the chart's id as name,
   // e.g. 'gGeoMap'. 
   sgvizler.option.chart = { 
       //'width':           '800',
       //'height':          '400',
       //'chartArea':       { left: '5%', top: '5%', width: '75%', height: '80%' },
       //     'gGeoMap': {
       //        'dataMode':           'markers'
       //     },
       //     'gMap': {
       //        'dataMode':           'markers',
       //     },
       //     'sMap': {
       //        'dataMode':           'markers',
       //        'showTip':            true,
       //        'useMapTypeControl':  true
       //     } 

   //// Leave this as is. Ready, steady, GO!