CINXE.COM
HKCAN Linked Data Service
<!DOCTYPE html> <html> <head> <title>HKCAN Linked Data Service</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0"> <style> body { margin:auto; padding:0; font-family: sans-serif; font-size: 1em; padding-top: 10px; background: white; } a { text-decoration:none; } a:hover { text-decoration:underline; } </style> <!-- Bootstrap --> <link rel="stylesheet" href="/lod/js/bootstrap/bootstrap.min.css" crossorigin="anonymous" > <!-- YASQE --> <link href='/lod/js/yasqe/yasqe.min.css' rel='stylesheet' type='text/css' crossorigin="anonymous" /> <!-- YASR --> <link href='/lod/js/yasr/yasr-custom.min.css' rel='stylesheet' type='text/css' crossorigin="anonymous" /> <!--fastselect --> <link href='/lod/js/fastselect/fastselect.min.css' rel='stylesheet' type='text/css' crossorigin="anonymous" /> <!-- bootbox --> <link href='/lod/js/init.css' rel='stylesheet' type='text/css' crossorigin="anonymous" /> </head> <body> <div class="container-fluid"> <!-- header --> <div class="row"> <div class="col" style="padding:10px 5px 10px 5px; font-size:1.5em; background:#003874; color:white;"><a href="/lod/../" class="home-url">HKCAN Linked Data Service</a></div> </div> <!-- body --> <div style="padding-left:5px; padding-right:5px; padding-top:5px; border:1px solid #003874;"> <!--MESSAGE_PLACEHOLDER--> <div class="row" style="margin-top:8px;"> <div class="col"> <h2 style="text-align:left;margin-bottom:20px;">About HKCAN Linked Data Service</h2> <div style='max-width:50em;margin-bottom:20px;'> JULAC HKCAN dataset is now available as linked open data. It can be accessed via the SPARQL query endpoint at <code>http://hkcan.julac.org/lod/sparql</code>. The triplestore currently contains <strong>321,858 named graphs, 21,103,370 triples</strong>. </div> <div style='max-width:50em;margin-bottom:20px;'>HKCAN MARC records from JULAC Alma Network Zone are transformed to MADSRDF and SKOS RDFs and injected to the triplestore as named graphs, with URI in the form of <code>hkcan:<hkcan_id></code>.</div> <div style='max-width:50em;margin-bottom:20px;'> HKCAN URI is de-referenced to an authority description page, from which users have the options to download the authority record in MARCXML, MADSRDF and SKOS/RDF formats. </div> <div style='max-width:50em;margin-bottom:20px;'> Users can also search names via the <a href="http://hkcan.julac.org/authorities">Search Form</a>. </div> <div style='max-width:50em;margin-bottom:20px;'> Example of <a href="http://hkcan.julac.org/authorities/names/9811105235303406.d3graph">visualizing</a> names in <code>hkcan:9811105235303406</code>. </div> <h2 style="text-align:left;margin-bottom:20px;">Use Cases</h2> <ol style='list-style:none;padding-left:0px;max-width:1020px;'> <li style='background-color:rgba(0,0,0,.05);padding:20px;'> <div class="row"> 1.<div class="col" style='max-width:300px;'>Retrieve triples of a graph by URI (e.g. <code>hkcan:9811105907603406</code>)</div> <div class="col"> <label class="sr-only" for="hkcanid">HKCANID</label> <!-- do not assign name to the input field as we do not want it to submit as query string --> <input type="text" style="max-width:400px;height:45.7px;display:inline-block;" class="form-control mb-2 mr-sm-2" placeholder='Enter graph URI' id="hkcanid" value="hkcan:9811106253003406"> <button class="btn btn-primary mb-2" type="button" onclick="searchGraph(); return false;" style="height:45.7px;width:55px;">Go</button> </div> </div> </li> <li style='margin-top:20px;background-color:rgba(0,0,0,.05);padding:20px;'> <div class="row"> 2.<div class="col" style='max-width:300px;'>Search keyword in labels (e.g. <code>林语堂</code> or <code>金庸</code>). Limit search by types of entities (e.g. <code>madsrdf:authoritativeLabel</code>)</div> <div class="col"> <label class="sr-only" for="keyword">Search Term</label> <!-- do not assign name to the input field as we do not want it to submit as query string --> <input type="text" style="max-width:250px;height:45.7px;display:inline-block;" class="form-control mb-2 mr-sm-2" placeholder="Enter Keyword" id="keyword" value=""> <span style="display:inline-block;margin-right:8px;">in</span> <label class="sr-only" for="label_type">Label Type</label> <select class="multipleSelect form-control" multiple name="label_type" id="label_type" style="display:inline-block;"> <option value="madsrdf:authoritativeLabel">madsrdf:authoritativeLabel</option> <option value="madsrdf:variantLabel">madsrdf:variantLabel</option> <option value="madsrdf:citation-note">madsrdf:citation-note</option> <option value="madsrdf:citation-source">madsrdf:citation-source</option> </select> <button class="btn btn-primary mb-2" type="button" onclick="searchKeyword(); return false;" style="height:45.7px;width:55px;">Go</button> </div> </div> </li> </ol> </div> </div> <hr> <h5 style="padding-left:20px;">SPARQL Query</h5> <div style="padding-left:20px;"> <strong style="margin-right:10px;">Endpoint</strong><span style="display:inline-block;">http://hkcan.julac.org/lod/sparql</span> </div> <small class="form-text text-muted" style="padding-left: 20px;"> Construct SPARQL query in the editor below </small> <!-- sparql search area --> <div class="row"> <div id="yasqe" class="col"></div> </div> <div style="clear: both;"></div> <hr> <!-- search result --> <h5 style="padding-left:20px;">Query Result</h5> <div class="row"> <div id="yasr" class="col" style=""></div> </div> <hr> </div> <!-- footer --> <div style="width:100%;" > <div style="padding:10px 5px 10px 5px;float: right;text-align:right;background:#003874;font-size:80%; color:#fff;">Developed by <a style="color:#fff;" title="About HKUST Library" href="http://library.ust.hk">HKUST Library</a> </div> <div style="padding:10px 5px 10px 5px; text-align:left;background:#003874;font-size:80%;color:#fff;" ><a style="color:#fff;" title="About HKCAN" href="http://www.julac.org/?page_id=2137">HKCAN</a> Linked Data Service - Project of <a style="color:#fff;" title="About JULAC" href="http://www.julac.org">JULAC</a></div> </div> </div> <!-- script that cannot load ASYNC --> <!-- put in bottom to optimize the performance --> <script src="/lod/js/jquery/3.3.1/jquery.min.js" crossorigin="anonymous" ></script> <script src="/lod/js/popper/popper.min.js" crossorigin="anonymous" ></script> <script src="/lod/js/bootstrap/bootstrap.bundle.min.js" crossorigin="anonymous" ></script> <script src='/lod/js/yasqe/yasqe.bundled.min.js' crossorigin="anonymous" ></script> <script src='/lod/js/yasr/yasr.bundle-custom.min.js' crossorigin="anonymous" ></script> <script src='/lod/js/fastselect/fastselect.standalone.min.js' crossorigin="anonymous" ></script> <script src='/lod/js/bootbox/bootbox.min.js' crossorigin='anonymous' ></script> <script type='text/javascript' defer> //$(document).ready(function(){ var yasqe = YASQE(document.getElementById('yasqe'),{ backdrop: false, persistent: null, autocompleters: ["properties", "classes", "variables"], // createShareLink:function(){ return {x:"123"};}, sparql: { showQueryButton: true, //endpoint: "http://lbnx08.ust.hk:3030/testdb/query" endpoint: "/lod/sparql", // endpoint : "http://hkcan.julac.org/lod/sparql" fullEndpoint: "http://hkcan.julac.org/lod/sparql" }}); //yasqe.options.sparql.endpoint = "http://hkcan.julac.org/lod/sparql"; var yasr = YASR(document.getElementById("yasr"), { //this way, the URLs in the results are prettified using the defined prefixes in the query //getUsedPrefixes: yasqe.getPrefixesFromQuery, getUsedPrefixes: function(){ var ns = { "recordinfo": "http://id.loc.gov/ontologies/RecordInfo#", "identifiers": "http://id.loc.gov/vocabulary/identifiers/", "organizations": "http://id.loc.gov/vocabulary/organizations/", "lcvocab": "http://id.loc.gov/vocabulary/", "cs": "http://purl.org/vocab/changeset/schema#", "madsrdf": "http://www.loc.gov/mads/rdf/v1#", "skos": "http://www.w3.org/2004/02/skos/core#", "rdf": "http://www.w3.org/1999/02/22-rdf-syntax-ns#", "rdfs": "http://www.w3.org/2000/01/rdf-schema#", "hkcan": "http://hkcan.julac.org/authorities/names/", "text": "http://jena.apache.org/text#" }; var yasqe_ns = yasqe.getPrefixesFromQuery(); $.extend(ns, yasqe_ns); return ns; }, outputPlugins: ["error", "boolean", "table","rawResponse"], drawOutputSelector: true, useGoogleCharts: false, output: "table", persistency:{prefix:false} }); //do not fetch label from preflabel yasr.plugins.table.options.fetchTitlesFromPreflabel = false; //do not merge the label with url. yasr.plugins.table.options.mergeLabelsWithUris = false; //set pagesize yasr.plugins.table.options.datatable.pageLength = 300; //link yasqe with yasr yasqe.options.sparql.callbacks.complete = yasr.setResponse; //set sparql to the editor var sparql_str = "PREFIX hkcan: <http://hkcan.julac.org/authorities/names/>\n\nSELECT ?s ?p ?o\nWHERE {\n GRAPH hkcan:9811106253003406 {\n ?s ?p ?o .\n }\n}\nORDER BY ?s\nLIMIT 500"; yasqe.setValue(sparql_str); //if this is search page, execute the query in the editor on page load. yasqe.query(); //event of the simple search box. $("#keyword").keyup(function(event) { if (event.keyCode === 13) { searchKeyword(); } }); //prevent the default form submit action $(document).ready(function() { $(window).keydown(function(event){ if(event.keyCode == 13) { event.preventDefault(); return false; } }); //bind the multiple select to rdftype for better ux. $('.multipleSelect').fastselect({placeholder:'All'}); }); /** * redirect to search keyword result page */ function searchKeyword() { var label_type = $('#label_type').val(); var keyword = $('#keyword').val(); if (keyword.length == 0) { return false; } var new_url = "/lod/search/"+keyword; if(label_type.length > 0){ new_url += "?label_type=" + label_type; } window.location = new_url; } /** * Redirect to search graph result page. */ function searchGraph(){ var hkcanid = $('#hkcanid').val(); if(hkcanid.length == 0){ return false; } //shortUriPattern var pattern1 = new RegExp('^hkcan\:[0-9]{16}$'); //longUriPattern var pattern2str = '^<?https\:\/\/hkcan\.julac\.org\/authorities\/names\/([0-9]{16})>?$'; var pattern2 = new RegExp(pattern2str); if(pattern1.test(hkcanid)){ window.location = "/lod/graph/"+hkcanid; return false; } // if(pattern1.test(mmsid) || pattern2.test(mmsid)){ if(pattern2.test(hkcanid)){ var x = hkcanid.match(pattern2str)[1]; window.location = "/lod/graph/hkcan:"+x; return false; }else{ bootbox.alert("Invalid Graph URI"); } } //window resize event handler var waitForFinalEvent = (function () { var timers = {}; return function (callback, ms, uniqueId) { if (!uniqueId) { uniqueId = "Don't call this twice without a uniqueId"; } if (timers[uniqueId]) { clearTimeout (timers[uniqueId]); } timers[uniqueId] = setTimeout(callback, ms); }; })(); //action to do after window resized $(window).resize(function () { waitForFinalEvent(function(){ //redraw the result. yasr.draw(); }, 500, "A28EQd6rYK"); //random string as unique Id }); </script> </body> </html>