source: gs2-extensions/apache-jena/trunk/src/web-ext-js/sgvizler/example/exNPD2.html@ 28687

Last change on this file since 28687 was 28687, checked in by davidb, 10 years ago

Javascript files needed to support Google visualizations, made possible through SGVizer, which takes Sparql queries and converts the returned data into a format suitable for Google's visualization library
File size: 7.4 KB
Line 
1<!DOCTYPE HTML>
2<html>
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
5 <title>Sgvizler</title>
6 <meta charset="UTF-8">
7 <link rel="shortcut icon" href="http://sgvizler.googlecode.com/svn/www/favicon.ico">
8 <link rel="stylesheet" type="text/css" href="http://sgvizler.googlecode.com/svn/www/sgvizler.css">
9 <link rel="stylesheet" type="text/css" href="examples.css"><script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script><script type="text/javascript" src="https://www.google.com/jsapi"></script><script type="text/javascript" id="sgvzlr_script" src="../sgvizler.js"></script><script type="text/javascript">sgvizler.option.namespace.npd = 'http://sws.ifi.uio.no/npd/';
10 sgvizler.option.namespace.npdv = 'http://sws.ifi.uio.no/vocab/npd#';
11
12 $(document).ready(sgvizler.go());
13 </script></head>
14 <body>
15 <div id="logo"><a href="http://code.google.com/p/sgvizler/"><img src="http://sgvizler.googlecode.com/svn/www/mr.sgvizler.png" alt="mr.sgvizler.png"></a><br>Mr. Sgvizler
16
17 </div>
18 <h3><code>gColumnChart</code>: Total production per year on Ekofisk
19 </h3>
20 <p></p>
21 <div id="sgvzl_example_query" data-sgvizler-endpoint="http://sws.ifi.uio.no/sparql/npd" data-sgvizler-query="SELECT ?year ?Oil_millSm3 ?Gas_billSm3 ?NGL_millSm3 ?Condensate_millSm3 ?Water_millSm3 WHERE{ ?period a npdv:FieldProductionPeriod ; npdv:hasField <http://sws.ifi.uio.no/npd/field/Ekofisk&gt; ; npdv:year ?year ; npdv:producedNetOilMillSm3 ?Oil_millSm3 ; npdv:producedNetGasBillSm3 ?Gas_billSm3 ; npdv:producedNetNGLMillSm3 ?NGL_millSm3 ; npdv:producedNetCondensateMillSm3 ?Condensate_millSm3 ; npdv:producedWaterMillSm3 ?Water_millSm3 ; OPTIONAL{?period npdv:month ?month} . FILTER (!bound(?month)) FILTER (xsd:int(?year) < 2011) } ORDER BY ?year" data-sgvizler-chart="gColumnChart" data-sgvizler-loglevel="2" style="width:800px; height:400px;"></div>
22 <p>The element which draws the above chart:</p><pre id="sgvzl_example_pre">&lt;div id="sgvzl_example_query"
23 data-sgvizler-endpoint="http://sws.ifi.uio.no/sparql/npd"
24 data-sgvizler-query="SELECT ?year ?Oil_millSm3 ?Gas_billSm3 ?NGL_millSm3 ?Condensate_millSm3 ?Water_millSm3 WHERE{ ?period a npdv:FieldProductionPeriod ; npdv:hasField &amp;lt;http://sws.ifi.uio.no/npd/field/Ekofisk&gt; ; npdv:year ?year ; npdv:producedNetOilMillSm3 ?Oil_millSm3 ; npdv:producedNetGasBillSm3 ?Gas_billSm3 ; npdv:producedNetNGLMillSm3 ?NGL_millSm3 ; npdv:producedNetCondensateMillSm3 ?Condensate_millSm3 ; npdv:producedWaterMillSm3 ?Water_millSm3 ; OPTIONAL{?period npdv:month ?month} . FILTER (!bound(?month)) FILTER (xsd:int(?year) &amp;lt; 2011) } ORDER BY ?year"
25 data-sgvizler-chart="gColumnChart"
26 data-sgvizler-loglevel="2"
27 style="width:800px; height:400px;"/&gt;</pre><h3>The results of the query in <code>gTable</code></h3>
28 <div id="sgvzl_example_table" data-sgvizler-endpoint="http://sws.ifi.uio.no/sparql/npd" data-sgvizler-query="SELECT ?year ?Oil_millSm3 ?Gas_billSm3 ?NGL_millSm3 ?Condensate_millSm3 ?Water_millSm3 WHERE{ ?period a npdv:FieldProductionPeriod ; npdv:hasField <http://sws.ifi.uio.no/npd/field/Ekofisk&gt; ; npdv:year ?year ; npdv:producedNetOilMillSm3 ?Oil_millSm3 ; npdv:producedNetGasBillSm3 ?Gas_billSm3 ; npdv:producedNetNGLMillSm3 ?NGL_millSm3 ; npdv:producedNetCondensateMillSm3 ?Condensate_millSm3 ; npdv:producedWaterMillSm3 ?Water_millSm3 ; OPTIONAL{?period npdv:month ?month} . FILTER (!bound(?month)) FILTER (xsd:int(?year) < 2011) } ORDER BY ?year" data-sgvizler-chart="gTable" data-sgvizler-loglevel="2" style="width:800px; height:200px;"></div>
29 <h3>Same query, different charts</h3>
30 <p>Not all charts may be well-suited for displaying this dataset.</p>
31 <h4><code>gBarChart</code></h4>
32 <div id="sgvzl_example_query_copy_1" data-sgvizler-endpoint="http://sws.ifi.uio.no/sparql/npd" data-sgvizler-query="SELECT ?year ?Oil_millSm3 ?Gas_billSm3 ?NGL_millSm3 ?Condensate_millSm3 ?Water_millSm3 WHERE{ ?period a npdv:FieldProductionPeriod ; npdv:hasField <http://sws.ifi.uio.no/npd/field/Ekofisk&gt; ; npdv:year ?year ; npdv:producedNetOilMillSm3 ?Oil_millSm3 ; npdv:producedNetGasBillSm3 ?Gas_billSm3 ; npdv:producedNetNGLMillSm3 ?NGL_millSm3 ; npdv:producedNetCondensateMillSm3 ?Condensate_millSm3 ; npdv:producedWaterMillSm3 ?Water_millSm3 ; OPTIONAL{?period npdv:month ?month} . FILTER (!bound(?month)) FILTER (xsd:int(?year) < 2011) } ORDER BY ?year" data-sgvizler-chart="gBarChart" data-sgvizler-loglevel="2" style="width:800px; height:400px;"></div>
33 <h4><code>gLineChart</code></h4>
34 <div id="sgvzl_example_query_copy_2" data-sgvizler-endpoint="http://sws.ifi.uio.no/sparql/npd" data-sgvizler-query="SELECT ?year ?Oil_millSm3 ?Gas_billSm3 ?NGL_millSm3 ?Condensate_millSm3 ?Water_millSm3 WHERE{ ?period a npdv:FieldProductionPeriod ; npdv:hasField <http://sws.ifi.uio.no/npd/field/Ekofisk&gt; ; npdv:year ?year ; npdv:producedNetOilMillSm3 ?Oil_millSm3 ; npdv:producedNetGasBillSm3 ?Gas_billSm3 ; npdv:producedNetNGLMillSm3 ?NGL_millSm3 ; npdv:producedNetCondensateMillSm3 ?Condensate_millSm3 ; npdv:producedWaterMillSm3 ?Water_millSm3 ; OPTIONAL{?period npdv:month ?month} . FILTER (!bound(?month)) FILTER (xsd:int(?year) < 2011) } ORDER BY ?year" data-sgvizler-chart="gLineChart" data-sgvizler-loglevel="2" style="width:800px; height:400px;"></div>
35 <h4><code>gAreaChart</code></h4>
36 <div id="sgvzl_example_query_copy_3" data-sgvizler-endpoint="http://sws.ifi.uio.no/sparql/npd" data-sgvizler-query="SELECT ?year ?Oil_millSm3 ?Gas_billSm3 ?NGL_millSm3 ?Condensate_millSm3 ?Water_millSm3 WHERE{ ?period a npdv:FieldProductionPeriod ; npdv:hasField <http://sws.ifi.uio.no/npd/field/Ekofisk&gt; ; npdv:year ?year ; npdv:producedNetOilMillSm3 ?Oil_millSm3 ; npdv:producedNetGasBillSm3 ?Gas_billSm3 ; npdv:producedNetNGLMillSm3 ?NGL_millSm3 ; npdv:producedNetCondensateMillSm3 ?Condensate_millSm3 ; npdv:producedWaterMillSm3 ?Water_millSm3 ; OPTIONAL{?period npdv:month ?month} . FILTER (!bound(?month)) FILTER (xsd:int(?year) < 2011) } ORDER BY ?year" data-sgvizler-chart="gAreaChart" data-sgvizler-loglevel="2" style="width:800px; height:400px;"></div>
37 <h4><code>gSteppedAreaChart</code></h4>
38 <div id="sgvzl_example_query_copy_4" data-sgvizler-endpoint="http://sws.ifi.uio.no/sparql/npd" data-sgvizler-query="SELECT ?year ?Oil_millSm3 ?Gas_billSm3 ?NGL_millSm3 ?Condensate_millSm3 ?Water_millSm3 WHERE{ ?period a npdv:FieldProductionPeriod ; npdv:hasField <http://sws.ifi.uio.no/npd/field/Ekofisk&gt; ; npdv:year ?year ; npdv:producedNetOilMillSm3 ?Oil_millSm3 ; npdv:producedNetGasBillSm3 ?Gas_billSm3 ; npdv:producedNetNGLMillSm3 ?NGL_millSm3 ; npdv:producedNetCondensateMillSm3 ?Condensate_millSm3 ; npdv:producedWaterMillSm3 ?Water_millSm3 ; OPTIONAL{?period npdv:month ?month} . FILTER (!bound(?month)) FILTER (xsd:int(?year) < 2011) } ORDER BY ?year" data-sgvizler-chart="gSteppedAreaChart" data-sgvizler-loglevel="2" style="width:800px; height:400px;"></div>
39 <div id="footer">
40 <!--Please leave a link to the Sgvizler homepage.-->
41 <p>
42 Sgvizler visualizes the result of SPARQL SELECT queries using
43 javascript and the Google Visualization API. For more
44 information, see the <a href="http://code.google.com/p/sgvizler/">Sgvizler</a>
45 homepage. (c) 2011--2012 Martin G. SkjÊveland.
46
47 </p>
48 </div>
49 </body>
50</html>
Note: See TracBrowser for help on using the repository browser.