User:Wingoli/SparqlCharts

The Sparql Charts extension allows to query SPARQL endpoints and display the query result in different formats.

Download
You can download the extension [TODO:Link here].

Installation

 * 1) Unzip the downloaded zip file. Put the folder 'SparqlCharts' into your wikis extension folder.
 * 2) Include the following line at the end of your LocalSettings.php:
 * 3) You can use the extension now! (There are no other extensions required as prerequisites and there is no setup procedure needed.)

Usage
This is a brief introduction on how to use the SparqlCharts extension.

Basic usage
After successful installation, you can execute a SPARQL query and display the results of that query by using the following pattern:

In the pattern, replace  with your SPARQL query and   with the endpoint you want to send your query to. A simple query could look like this:

Since we did not define a format by setting the format parameter, the query result gets displayed as the default format, which is a table. To display the results in a format other than a table, add the line  and replace   by any value listed below. Each format provides several parameters, to change it's visual appearance such as  or.

All available formats are listed below.

TODO: Explain xaxis, yaxis etc. bzw. bei boxplot: boxplot1...

TODO: welche werte kann man bei color eintragen

Simple Bar Chart
Click on "Expand" to see details about this format.



Mandatory parameters:,.

Used JavaScript library: D3.js

See HERE (TODO: Link) for a explanation of the parameters  and.

Click on "Expand" to see an example of the "bar chart" format.



The chart depicted in this screenshot has been created by the following code:

Multi-Bar Chart
Click on "Expand" to see details about this format.



Mandatory parameters:,.

Used JavaScript libraries: D3.js,  NVD3.js

See HERE (TODO: Link) for a explanation of the parameters,    and.

Click on "Expand" to see an example of the "mulit-bar chart" format.



The chart depicted in this screenshots has been created by the following code:

Pie Chart / Donut Chart
Click on "Expand" to see details about this format.



Mandatory parameters:,. (Note: For using the donut chart, you need to set  . As per default, this format is a pie chart.)

Used JavaScript libraries: D3.js,  NVD3.js

See HERE (TODO: Link) for a explanation of the parameters  and.

Click on "Expand" to see an example of the "donut chart" format.



The chart depicted in this screenshot has been created by the following code:

Simple Line Chart
Click on "Expand" to see details about this format.



Mandatory parameters:,.

Used JavaScript libraries: D3.js,  NVD3.js

See HERE (TODO: Link) for a explanation of the parameters  and.

Click on "Expand" to see an example of the "simple line-chart" format.



The chart depicted in this screenshot has been created by the following code:

Stacked Area Chart
Click on "Expand" to see details about this format.



Mandatory parameters:,.

Used JavaScript libraries: D3.js,  NVD3.js

Modes: Stacked, Stream, Expanded

See HERE (TODO: Link) for a explanation of the parameters,    and.

Boxplot
Click on "Expand" to see details about this format.



Mandatory parameters:,.

Used JavaScript libraries: D3.js

Outlier-Switch erklären: 0=keine outlier werden angezeigt

Click on "Expand" to see an example of the "bar chart" format.



The chart depicted in this screenshot has been created by the following code:

Force Directed Graph
Click on "Expand" to see details about this format.



Click on "Expand" to see an example of the "bar chart" format.

400px|SparqlCharts extension (boxplot format)

The chart depicted in this screenshot has been created by the following code:

Displaying annotations
To display annotations that you have created, click on the button View Annotations. Every annotation is represented by a horizontal line on the left side of the article's text. You can view the information which belong to an annotation by moving your mouse cursor over the respective horizontal line.

Changing and deleting annotations
When you select an annotation via mouseover you can press the button Change Annotation to change the values of the semantic properties that belong to the observed annotation. By clicking  Delete Annotation the annotation will be deleted.

Query annotations
You can query annotated text passages that have been given a certain value in one of its semantic properties. For example you can query all annotations where the value "King_Speech_Annotation " has been attached to the property "STAannotationType" and that where made by the user "Olutzi" by using the following syntax:

In the screenshot, the resulting annotations are ordered by the date of their creation.



How it works
The Semantic Text Annotator defines a custom namespace for annotations (TextAnnotation:). Each annotation is stored as a unique page in this namespace. The information of an annotation are stored in semantic properties on this page. Some property values are defined by the user through the pop up form window. By default there are two properties the user can define himself:
 * STAannotationType
 * Can be used to categorize the selected text passage.

STAcomment
 * Can be used to briefly describe the selected text passage within its category.

Semantic Text Annotator also defines a few custom properties that are added to an annotation page that are necessary to correctly store and retrieve annotations.
 * STAannotationSerialNumber
 * An unique number to identify every annotation.


 * STAarticleName
 * The name of the article the annotated text passage belongs to.


 * STAannotationDate
 * The date the annotation has been created or changed.


 * STAcreatedBy
 * The user that created the annotation.

Future development
Chart-Vorlagen, die man mit ins Programm aufnehmen könnte:

- NVD3 Scatter/Bubble Chart TODO: Screenshot

- NVD3 Multi-Line Chart with focus TODO: Screenshot

- NVD3 Horizontal Multi-Bar Chart TODO: Screenshot

The Semantic Text Annotator is still under heavy development. Feedback, bug reports and feature requests are therefore very welcome!

Charts nebeneinander anzeigen können (->bisher nur untereinander)

Planned features

 * 1) Executability of the extension on articles containing all possible syntax
 * 2) Customizable structure of the user-defined semantic properties
 * 3) Possibility to change the position of an annotated text passage ex post by dragging start and end of the selected area

Known issues
- width + height of Pie Chart does not work

- pipe-Symbol in SPARQL-Queries funzt nicht -> muss stattdessen | benutzen (siehe Beispiel vom Force-directed Graph)

Currently, the biggest problem of the extension is that it only works properly in short articles containing certain syntax. It has not been tested yet, which syntax causes malfunctions and which syntax can be processed adequately.

Credits
The Semantic Text Annotator is based on the extension "Semantic Image Annotator" by Felix Obenauer, which provides similiar functionality for image files.