|
@@ -1,723 +0,0 @@
|
|
|
-// Raccatto i parametri dall'URL -- mi aspetto un parametro di nome 'link'!
|
|
|
-thisUrlParams = {};
|
|
|
-window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
|
|
|
- thisUrlParams[key] = value;
|
|
|
-});
|
|
|
-console.log('URL get params: ', thisUrlParams);
|
|
|
-
|
|
|
-// Funzioni per eseguire le queries
|
|
|
-function prepareQueryURL(query){
|
|
|
- sparqlEndpoint = 'http://dev.restore.ovi.cnr.it:8890/sparql/';
|
|
|
- sparqlUrlParams = '?default-graph-uri=&query=' + encodeURIComponent(query) + '&output=json&callback=?';
|
|
|
- return sparqlEndpoint + sparqlUrlParams;
|
|
|
-}
|
|
|
-
|
|
|
-function doJsonQuery(query){
|
|
|
-
|
|
|
- queryURL = prepareQueryURL(query);
|
|
|
-
|
|
|
- response = $.ajax({//OGGETTO
|
|
|
-
|
|
|
- url: queryURL,
|
|
|
- dataType: "json",
|
|
|
- success: function (data){},
|
|
|
- error: function (e) {}
|
|
|
- });
|
|
|
-
|
|
|
- return response;
|
|
|
-
|
|
|
-}
|
|
|
-
|
|
|
-// Funzioni per raccattare + stringhificare l'output
|
|
|
-queryStringOutput = "";
|
|
|
-function stringifyResponse(val){
|
|
|
- resultArray = val['results']['bindings'];
|
|
|
- out = "";
|
|
|
- for(i = 0; i < resultArray.length; i++){
|
|
|
- out = out + JSON.stringify(resultArray[i])
|
|
|
- }
|
|
|
- queryStringOutput = (queryStringOutput + out).replace("}{",",");
|
|
|
-}
|
|
|
-
|
|
|
-prefixes = "PREFIX rdfs: <http://www.w3.org/2000/01/rdf-schema#> \
|
|
|
-PREFIX rdf: <http://www.w3.org/1999/02/22-rdf-syntax-ns#> \
|
|
|
-PREFIX crm: <http://www.cidoc-crm.org/cidoc-crm/> \
|
|
|
-PREFIX owl: <http://www.w3.org/2002/07/owl#>"
|
|
|
-
|
|
|
-query = prefixes + " SELECT DISTINCT ?graph ?name_place ?coordinates {\
|
|
|
-GRAPH ?graph {<" + thisUrlParams.link + "> crm:P168_place_is_defined_by ?coordinates;\
|
|
|
-rdfs:label ?name_place .\
|
|
|
-}\
|
|
|
-}"
|
|
|
-
|
|
|
-queryRiferimenti = prefixes + " SELECT DISTINCT ?references {\
|
|
|
-<" + thisUrlParams.link + "> owl:sameAs ?references\
|
|
|
-}"
|
|
|
-
|
|
|
-queryToponimi = prefixes + " SELECT DISTINCT ?toponimi {\
|
|
|
-<" + thisUrlParams.link + "> crm:P1_is_identified_by ?uri_toponym .\
|
|
|
-?uri_toponym rdfs:label ?toponimi\
|
|
|
-}"
|
|
|
-
|
|
|
-queryRicezione = prefixes + " SELECT DISTINCT ?object ?label {\
|
|
|
-<" + thisUrlParams.link + "> owl:sameAs ?place .\
|
|
|
-?event_to crm:P26_moved_to ?place ;\
|
|
|
-rdf:type crm:EL3_Receive_Letter ;\
|
|
|
-rdfs:subClassOf ?event .\
|
|
|
-?object crm:P25i_moved_by ?event ; \
|
|
|
-rdfs:label ?label .\
|
|
|
-} "
|
|
|
-
|
|
|
-queryInvio = prefixes + " SELECT DISTINCT ?object ?label {\
|
|
|
-<" + thisUrlParams.link + "> owl:sameAs ?place .\
|
|
|
-?event_to crm:P27_moved_from ?place ;\
|
|
|
-rdf:type crm:EL2_Send_Letter ;\
|
|
|
-rdfs:subClassOf ?event .\
|
|
|
-?object crm:P25i_moved_by ?event ; \
|
|
|
-rdfs:label ?label .\
|
|
|
-}"
|
|
|
-
|
|
|
-queryCitazione = prefixes + " SELECT DISTINCT ?object ?label\
|
|
|
-{<" + thisUrlParams.link + "> crm:P1_is_identified_by ?toponym .\
|
|
|
-?object crm:P67_refers_to ?toponym ;\
|
|
|
-rdfs:label ?label\
|
|
|
-}"
|
|
|
-
|
|
|
-queryPersone = prefixes + " SELECT DISTINCT ?range ?label \
|
|
|
-WHERE{ \
|
|
|
- {?place owl:sameAs <" + thisUrlParams.link + "> .\
|
|
|
- ?event_to crm:P26_moved_to ?place ;\
|
|
|
- rdf:type crm:EL3_Receive_Letter ;\
|
|
|
- crm:P01_has_domain ?domain .\
|
|
|
- ?domain crm:P02_has_range ?range .\
|
|
|
- ?range rdfs:label ?label .\
|
|
|
-} UNION {\
|
|
|
- ?place owl:sameAs <" + thisUrlParams.link + "> .\
|
|
|
- ?event_to crm:P27_moved_from ?place ;\
|
|
|
- rdf:type crm:EL2_Send_Letter ;\
|
|
|
- crm:P01_has_domain ?domain .\
|
|
|
- ?domain crm:P02_has_range ?range .\
|
|
|
- ?range rdfs:label ?label .\
|
|
|
- }\
|
|
|
-}"
|
|
|
-
|
|
|
-queryCount = prefixes + " SELECT ?place ?label COUNT(?label) AS ?Count \
|
|
|
-WHERE{ \
|
|
|
-?place_to owl:sameAs <" + thisUrlParams.link + "> . \
|
|
|
-?event_to crm:P26_moved_to ?place_to ; \
|
|
|
-rdf:type crm:EL3_Receive_Letter ; \
|
|
|
-rdfs:subClassOf ?event . \
|
|
|
-?event_from rdfs:subClassOf ?event ; \
|
|
|
-rdf:type crm:EL2_Send_Letter ; \
|
|
|
-crm:P27_moved_from ?place . \
|
|
|
-?place rdfs:label ?label \
|
|
|
-} \
|
|
|
-ORDER BY DESC (?Count)"
|
|
|
-
|
|
|
-queryCount2 = prefixes + " SELECT ?place ?label COUNT(?label) AS ?Count \
|
|
|
-WHERE{ \
|
|
|
-?place_from owl:sameAs <" + thisUrlParams.link + "> . \
|
|
|
-?event_from crm:P27_moved_from ?place_from ; \
|
|
|
-rdf:type crm:EL2_Send_Letter ; \
|
|
|
-rdfs:subClassOf ?event . \
|
|
|
-?event_to rdfs:subClassOf ?event ; \
|
|
|
-rdf:type crm:EL2_Send_Letter ; \
|
|
|
-crm:P27_moved_from ?place . \
|
|
|
-?place rdfs:label ?label . \
|
|
|
-} \
|
|
|
-ORDER BY DESC (?Count) "
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-queryURL = prepareQueryURL(query);
|
|
|
-
|
|
|
-queryRef = prepareQueryURL(queryRiferimenti);
|
|
|
-
|
|
|
-queryTopo = prepareQueryURL(queryToponimi);
|
|
|
-
|
|
|
-queryRec = prepareQueryURL(queryRicezione);
|
|
|
-
|
|
|
-querySend = prepareQueryURL(queryInvio);
|
|
|
-
|
|
|
-queryCit = prepareQueryURL(queryCitazione);
|
|
|
-
|
|
|
-queryPer = prepareQueryURL(queryPersone);
|
|
|
-
|
|
|
-queryCon1 = prepareQueryURL(queryCount);
|
|
|
-
|
|
|
-queryCon2 = prepareQueryURL(queryCount2);
|
|
|
-
|
|
|
-
|
|
|
-response = $.ajax({//OGGETTO
|
|
|
-
|
|
|
- url: queryURL,
|
|
|
- dataType: "json",
|
|
|
- success: function (data){
|
|
|
- handle_data(data);
|
|
|
- },
|
|
|
- error: function (e) {}
|
|
|
-});
|
|
|
-
|
|
|
-
|
|
|
-response_ref = $.ajax({//OGGETTO
|
|
|
-
|
|
|
- url: queryRef,
|
|
|
- dataType: "json",
|
|
|
- success: function (data){
|
|
|
- handle_ref(data);
|
|
|
- },
|
|
|
- error: function (e) {}
|
|
|
-});
|
|
|
-
|
|
|
-response_top = $.ajax({//OGGETTO
|
|
|
-
|
|
|
- url: queryTopo,
|
|
|
- dataType: "json",
|
|
|
- success: function (data){
|
|
|
- handle_toponym(data);
|
|
|
- },
|
|
|
- error: function (e) {}
|
|
|
-});
|
|
|
-
|
|
|
-response_receive = $.ajax({//OGGETTO
|
|
|
-
|
|
|
- url: queryRec,
|
|
|
- dataType: "json",
|
|
|
- success: function (data){
|
|
|
- handle_receive(data);
|
|
|
- },
|
|
|
- error: function (e) {}
|
|
|
-});
|
|
|
-
|
|
|
-response_send = $.ajax({//OGGETTO
|
|
|
-
|
|
|
- url: querySend,
|
|
|
- dataType: "json",
|
|
|
- success: function (data){
|
|
|
- handle_send(data);
|
|
|
- },
|
|
|
- error: function (e) {}
|
|
|
-});
|
|
|
-
|
|
|
-response_cit = $.ajax({//OGGETTO
|
|
|
-
|
|
|
- url: queryCit,
|
|
|
- dataType: "json",
|
|
|
- success: function (data){
|
|
|
- handle_cit(data);
|
|
|
- },
|
|
|
- error: function (e) {}
|
|
|
-});
|
|
|
-
|
|
|
-response_per = $.ajax({//OGGETTO
|
|
|
-
|
|
|
- url: queryPer,
|
|
|
- dataType: "json",
|
|
|
- success: function (data){
|
|
|
- handle_persons(data);
|
|
|
- },
|
|
|
- error: function (e) {}
|
|
|
-});
|
|
|
-
|
|
|
-responseCountA = $.ajax({//OGGETTO
|
|
|
-
|
|
|
- url: queryCon1,
|
|
|
- dataType: "json",
|
|
|
- success: function (data){
|
|
|
- handle_count(data);
|
|
|
- },
|
|
|
- error: function (e) {}
|
|
|
-});
|
|
|
-
|
|
|
-responseCountP = $.ajax({//OGGETTO
|
|
|
-
|
|
|
- url: queryCon2,
|
|
|
- dataType: "json",
|
|
|
- success: function (data){
|
|
|
- handle_count2(data);
|
|
|
- },
|
|
|
- error: function (e) {}
|
|
|
-});
|
|
|
-
|
|
|
-function handle_data(json) {
|
|
|
- console.log(json);
|
|
|
-
|
|
|
- const locations = [];
|
|
|
-
|
|
|
- $.each(
|
|
|
- json['results']['bindings'],
|
|
|
- function (index, value) {
|
|
|
- const loc = []
|
|
|
- var graph = value['graph']['value'];
|
|
|
- var label = value['name_place']['value'];
|
|
|
- var coord = value['coordinates']['value'];
|
|
|
- const coordinates = coord.split(", ");
|
|
|
- loc.push(label);
|
|
|
- loc.push(coordinates[0]);
|
|
|
- loc.push(coordinates[1]);
|
|
|
- locations.push(loc);
|
|
|
-
|
|
|
- document.getElementById("grafo").innerHTML = graph;
|
|
|
- document.getElementById("nome_luogo").innerHTML = label;
|
|
|
- document.getElementById("nome_lu").innerHTML = label;
|
|
|
- document.getElementById("nome_lp").innerHTML = label;
|
|
|
- document.getElementById("nome_ll").innerHTML = label;
|
|
|
- document.getElementById("nome_lg").innerHTML = label;
|
|
|
- document.getElementById("nome_st1").innerHTML = label;
|
|
|
- document.getElementById("nome_st2").innerHTML = label;
|
|
|
-
|
|
|
- });
|
|
|
-
|
|
|
- var map = L.map('map').setView([locations[0][1], locations[0][2]], 7);
|
|
|
- mapLink = '<a href="https://openstreetmap.org">OpenStreetMap</a>';
|
|
|
-
|
|
|
- L.tileLayer(
|
|
|
- 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
|
|
- attribution: '© ' + mapLink + ' Contributors',
|
|
|
- maxZoom: 18,
|
|
|
- }).addTo(map);
|
|
|
-
|
|
|
- for (var i = 0; i < locations.length; i++) {
|
|
|
- marker = new L.marker([locations[i][1], locations[i][2]])
|
|
|
- .bindPopup(locations[i][0])
|
|
|
- .addTo(map);
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-
|
|
|
-function handle_ref(json) {
|
|
|
-
|
|
|
- console.log(json);
|
|
|
-
|
|
|
- const references = [];
|
|
|
-
|
|
|
- var list_ref = "";
|
|
|
-
|
|
|
- $.each(
|
|
|
- json['results']['bindings'],
|
|
|
- function (index, value) {
|
|
|
- var ref = value['references']['value'];
|
|
|
- references.push(ref);
|
|
|
- });
|
|
|
-
|
|
|
-
|
|
|
- for (i=0; i<references.length; i++) {
|
|
|
- list_ref += "<div class='row'><div class='col'><a href='" + references[i] + "'>" + references[i] + "</a></div></div>";
|
|
|
- }
|
|
|
-
|
|
|
- document.getElementById("riferimenti").innerHTML = list_ref;
|
|
|
-
|
|
|
-}
|
|
|
-
|
|
|
-function handle_toponym(json) {
|
|
|
-
|
|
|
- console.log(json);
|
|
|
-
|
|
|
- const toponym = [];
|
|
|
-
|
|
|
- $.each(
|
|
|
- json['results']['bindings'],
|
|
|
- function (index, value) {
|
|
|
- var topo = value['toponimi']['value'];
|
|
|
- toponym.push(" " + topo);
|
|
|
- });
|
|
|
-
|
|
|
- document.getElementById("toponimi").innerHTML = toponym;
|
|
|
-
|
|
|
-}
|
|
|
-
|
|
|
-function handle_receive(json) {
|
|
|
-
|
|
|
- console.log(json);
|
|
|
-
|
|
|
- const received = {};
|
|
|
-
|
|
|
- var i=0;
|
|
|
-
|
|
|
- $.each(
|
|
|
- json['results']['bindings'],
|
|
|
- function (index, value) {
|
|
|
- key = value['object']['value'];
|
|
|
- data = value['label']['value'];
|
|
|
- received[key] = data;
|
|
|
- i++;
|
|
|
- });
|
|
|
-
|
|
|
- var myArray = "";
|
|
|
-
|
|
|
- for (var key in received) {
|
|
|
- myArray += "<div class='row'><div class='col-10'>" + received[key] + "</div><div class='col'><a href='" + key + "'><i class='fas fa-external-link-alt' aria-hidden='true'></i></a></div></div>";
|
|
|
- }
|
|
|
-
|
|
|
- document.getElementById("n_receive").innerHTML = i;
|
|
|
- document.getElementById("object_receive").innerHTML = myArray;
|
|
|
-
|
|
|
- if (i==0) {
|
|
|
- var messaggio = "<p>Nessun risultato trovato</p>";
|
|
|
- document.getElementById("object_receive").innerHTML = messaggio;
|
|
|
- }
|
|
|
-
|
|
|
-}
|
|
|
-
|
|
|
-
|
|
|
-function handle_send(json) {
|
|
|
-
|
|
|
- console.log(json);
|
|
|
-
|
|
|
- const sent = {};
|
|
|
-
|
|
|
- var i=0;
|
|
|
-
|
|
|
- $.each(
|
|
|
- json['results']['bindings'],
|
|
|
- function (index, value) {
|
|
|
- key = value['object']['value'];
|
|
|
- data = value['label']['value'];
|
|
|
- sent[key] = data;
|
|
|
- i++;
|
|
|
- });
|
|
|
-
|
|
|
- var myArray = "";
|
|
|
-
|
|
|
- for (var key in sent) {
|
|
|
- myArray += "<div class='row'><div class='col-10'>" + sent[key] + "</div><div class='col'><a href='" + key + "'><i class='fas fa-external-link-alt' aria-hidden='true'></i></a></div></div>";
|
|
|
- }
|
|
|
-
|
|
|
- document.getElementById("n_send").innerHTML = i;
|
|
|
- document.getElementById("object_send").innerHTML = myArray;
|
|
|
-
|
|
|
- if (i==0) {
|
|
|
- var messaggio = "<p>Nessun risultato trovato</p>";
|
|
|
- document.getElementById("object_send").innerHTML = messaggio;
|
|
|
- }
|
|
|
-
|
|
|
-}
|
|
|
-
|
|
|
-function handle_cit(json) {
|
|
|
-
|
|
|
- console.log(json);
|
|
|
-
|
|
|
- const citations = {};
|
|
|
-
|
|
|
- var i=0;
|
|
|
-
|
|
|
- $.each(
|
|
|
- json['results']['bindings'],
|
|
|
- function (index, value) {
|
|
|
- key = value['object']['value'];
|
|
|
- data = value['label']['value'];
|
|
|
- citations[key] = data;
|
|
|
- i++;
|
|
|
- });
|
|
|
-
|
|
|
- var myArray = "";
|
|
|
-
|
|
|
- for (var key in citations) {
|
|
|
- myArray += "<div class='row'><div class='col-10'>" + citations[key] + "</div><div class='col'><a href='" + key + "'><i class='fas fa-external-link-alt' aria-hidden='true'></i></a></div></div>";
|
|
|
- }
|
|
|
-
|
|
|
- document.getElementById("n_cit").innerHTML = i;
|
|
|
- document.getElementById("object_cit").innerHTML = myArray;
|
|
|
-
|
|
|
- if (i==0) {
|
|
|
- var messaggio = "<p>Nessun risultato trovato</p>";
|
|
|
- document.getElementById("object_cit").innerHTML = messaggio;
|
|
|
- }
|
|
|
-
|
|
|
-}
|
|
|
-
|
|
|
-function handle_persons(json) {
|
|
|
-
|
|
|
- console.log(json);
|
|
|
-
|
|
|
- const people = {};
|
|
|
-
|
|
|
- var i=0;
|
|
|
-
|
|
|
- $.each(
|
|
|
- json['results']['bindings'],
|
|
|
- function (index, value) {
|
|
|
- key = value['range']['value'];
|
|
|
- data = value['label']['value'];
|
|
|
- people[key] = data;
|
|
|
- i++;
|
|
|
- });
|
|
|
-
|
|
|
- var myArray = "";
|
|
|
-
|
|
|
- for (var key in people) {
|
|
|
- myArray += "<div class='row'><div class='col-9'>" + people[key] + "</div><div class='persona col' id='" +
|
|
|
- key + "'><i class='fa fa-user'></i></div><div class='col'><a href='" +
|
|
|
- key + "'><i class='fas fa-external-link-alt' aria-hidden='true'></i></a></div></div>";
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- document.getElementById("n_per").innerHTML = i;
|
|
|
- document.getElementById("object_per").innerHTML = myArray;
|
|
|
-
|
|
|
- if (i==0) {
|
|
|
- var messaggio = "<p>Nessun risultato trovato</p>";
|
|
|
- document.getElementById("object_per").innerHTML = messaggio;
|
|
|
- }
|
|
|
-
|
|
|
-}
|
|
|
-
|
|
|
-function handle_count(json) {
|
|
|
- console.log(json);
|
|
|
-
|
|
|
- const toponimi = [];
|
|
|
-
|
|
|
- const dataToponimi = [];
|
|
|
-
|
|
|
- var max = 0;
|
|
|
-
|
|
|
- $.each(
|
|
|
- json['results']['bindings'],
|
|
|
- function (index, value) {
|
|
|
- const topo = [];
|
|
|
-
|
|
|
- var toponimo = value['label']['value'];
|
|
|
- var count = value['Count']['value'];
|
|
|
- var temp = parseInt(count);
|
|
|
- toponimi.push(toponimo);
|
|
|
- dataToponimi.push([toponimo, count]);
|
|
|
-
|
|
|
- if (temp>max) {
|
|
|
- max = temp;
|
|
|
- }
|
|
|
-
|
|
|
- });
|
|
|
-
|
|
|
- // set the dimensions and margins of the graph
|
|
|
- var margin = {top: 20, right: 30, bottom: 40, left: 90},
|
|
|
- width = 460 - margin.left - margin.right,
|
|
|
- height = 400 - margin.top - margin.bottom;
|
|
|
-
|
|
|
- // append the svg object to the body of the page
|
|
|
- var svg = d3.select("#my_dataviz")
|
|
|
- .append("svg")
|
|
|
- .attr("width", width + margin.left + margin.right)
|
|
|
- .attr("height", height + margin.top + margin.bottom)
|
|
|
- .append("g")
|
|
|
- .attr("transform",
|
|
|
- "translate(" + margin.left + "," + margin.top + ")");
|
|
|
-
|
|
|
- // Parse the Data
|
|
|
- //d3.csv("https://raw.githubusercontent.com/holtzy/data_to_viz/master/Example_dataset/7_OneCatOneNum_header.csv", function(data) {
|
|
|
- // Add X axis
|
|
|
- var x = d3.scaleLinear()
|
|
|
- .domain([0, max])
|
|
|
- .range([ 0, width]);
|
|
|
- svg.append("g")
|
|
|
- .attr("transform", "translate(0," + height + ")")
|
|
|
- .call(d3.axisBottom(x))
|
|
|
- .selectAll("text")
|
|
|
- .attr("transform", "translate(-10,0)rotate(-45)")
|
|
|
- .style("text-anchor", "end");
|
|
|
-
|
|
|
- // Y axis
|
|
|
- var y = d3.scaleBand()
|
|
|
- .range([ 0, height ])
|
|
|
- .domain(toponimi)
|
|
|
- .padding(.1);
|
|
|
- svg.append("g")
|
|
|
- .call(d3.axisLeft(y))
|
|
|
-
|
|
|
- //Bars
|
|
|
- svg.selectAll("myRect")
|
|
|
- .data(dataToponimi)
|
|
|
- .enter()
|
|
|
- .append("rect")
|
|
|
- .attr("x", x(0) )
|
|
|
- .attr("y", function(d) { return y(d[0]); })
|
|
|
- .attr("width", function(d) { return x(d[1]); })
|
|
|
- .attr("height", y.bandwidth() )
|
|
|
- .attr("fill", "#69b3a2")
|
|
|
-
|
|
|
-
|
|
|
- /*var texts = svg.selectAll("myRect")
|
|
|
- .data(dataToponimi)
|
|
|
- .enter()
|
|
|
- .append("text");
|
|
|
-
|
|
|
- texts.attr("x", function(d){ return d[1] / 4 - 20})
|
|
|
- .attr("y", function(d,i){ return 22.26*i +20})
|
|
|
- .attr("text-anchor", "middle")
|
|
|
- .attr("fill", "#fff")
|
|
|
- .text(function(d){ return d[1]});*/
|
|
|
-
|
|
|
-}
|
|
|
-
|
|
|
-
|
|
|
-function handle_count2(json) {
|
|
|
- console.log(json);
|
|
|
-
|
|
|
- const toponimi = [];
|
|
|
-
|
|
|
- const dataToponimi = [];
|
|
|
-
|
|
|
- const values = [];
|
|
|
-
|
|
|
- var max = 0;
|
|
|
-
|
|
|
- $.each(
|
|
|
- json['results']['bindings'],
|
|
|
- function (index, value) {
|
|
|
- const topo = [];
|
|
|
-
|
|
|
- var toponimo = value['label']['value'];
|
|
|
- var count = value['Count']['value'];
|
|
|
- var temp = parseInt(count);
|
|
|
- toponimi.push(toponimo);
|
|
|
- dataToponimi.push([toponimo, count]);
|
|
|
-
|
|
|
- if (temp>max) {
|
|
|
- max = temp;
|
|
|
- }
|
|
|
-
|
|
|
- });
|
|
|
-
|
|
|
- // set the dimensions and margins of the graph
|
|
|
- var margin = {top: 20, right: 30, bottom: 40, left: 90},
|
|
|
- width = 460 - margin.left - margin.right,
|
|
|
- height = 400 - margin.top - margin.bottom;
|
|
|
-
|
|
|
- // append the svg object to the body of the page
|
|
|
- var svg = d3.select("#my_dataviz2")
|
|
|
- .append("svg")
|
|
|
- .attr("width", width + margin.left + margin.right)
|
|
|
- .attr("height", height + margin.top + margin.bottom)
|
|
|
- .append("g")
|
|
|
- .attr("transform",
|
|
|
- "translate(" + margin.left + "," + margin.top + ")");
|
|
|
-
|
|
|
- // Parse the Data
|
|
|
- //d3.csv("https://raw.githubusercontent.com/holtzy/data_to_viz/master/Example_dataset/7_OneCatOneNum_header.csv", function(data) {
|
|
|
- // Add X axis
|
|
|
- var x = d3.scaleLinear()
|
|
|
- .domain([0, max])
|
|
|
- .range([ 0, width]);
|
|
|
-
|
|
|
- svg.append("g")
|
|
|
- .attr("transform", "translate(0," + height + ")")
|
|
|
- .call(d3.axisBottom(x))
|
|
|
- .selectAll("text")
|
|
|
- .attr("transform", "translate(-10,0)rotate(-45)")
|
|
|
- .style("text-anchor", "end");
|
|
|
-
|
|
|
- // Y axis
|
|
|
- var y = d3.scaleBand()
|
|
|
- .range([ 0, height ])
|
|
|
- .domain(toponimi)
|
|
|
- .padding(.1);
|
|
|
-
|
|
|
- svg.append("g")
|
|
|
- .call(d3.axisLeft(y))
|
|
|
-
|
|
|
- //Bars
|
|
|
- svg.selectAll("myRect")
|
|
|
- .data(dataToponimi)
|
|
|
- .enter()
|
|
|
- .append("rect")
|
|
|
- .attr("x", x(0) )
|
|
|
- .attr("y", function(d) { return y(d[0]); })
|
|
|
- .attr("width", function(d) { return x(d[1]); })
|
|
|
- .attr("height", y.bandwidth() )
|
|
|
- .attr("fill", "#69b3a2")
|
|
|
-
|
|
|
- svg.selectAll("text2")
|
|
|
- .data(dataToponimi)
|
|
|
- .enter().append("text2")
|
|
|
- .text(function(d) {return d[1]})
|
|
|
- .attr("class", "text")
|
|
|
-}
|
|
|
-
|
|
|
-
|
|
|
-function open_info() {
|
|
|
-
|
|
|
- document.getElementById("info_luogo").style.display = "block";
|
|
|
- document.getElementById("place_info").style.display = "block";
|
|
|
- document.getElementById("topo").style.display = "none";
|
|
|
- document.getElementById("rif").style.display = "none";
|
|
|
-}
|
|
|
-
|
|
|
-function open_toponimi() {
|
|
|
-
|
|
|
- document.getElementById("info_luogo").style.display = "block";
|
|
|
- document.getElementById("place_info").style.display = "none";
|
|
|
- document.getElementById("topo").style.display = "block";
|
|
|
- document.getElementById("rif").style.display = "none";
|
|
|
-}
|
|
|
-
|
|
|
-function open_riferimenti() {
|
|
|
-
|
|
|
- document.getElementById("info_luogo").style.display = "block";
|
|
|
- document.getElementById("place_info").style.display = "none";
|
|
|
- document.getElementById("topo").style.display = "none";
|
|
|
- document.getElementById("rif").style.display = "block";
|
|
|
-}
|
|
|
-
|
|
|
-function open_collegamenti() {
|
|
|
-
|
|
|
- document.getElementById("references").style.display = "flex";
|
|
|
- document.getElementById("statistiche").style.display = "none";
|
|
|
-}
|
|
|
-
|
|
|
-function open_statistiche() {
|
|
|
-
|
|
|
- document.getElementById("references").style.display = "none";
|
|
|
- document.getElementById("statistiche").style.display = "flex";
|
|
|
-}
|
|
|
-
|
|
|
-var header = document.getElementById("ref_buttons");
|
|
|
-var btns = header.getElementsByClassName("btn");
|
|
|
-for (var i = 0; i < btns.length; i++) {
|
|
|
- btns[i].addEventListener("click", function() {
|
|
|
- var current = document.getElementsByClassName("active");
|
|
|
- current[0].className = current[0].className.replace(" active", "");
|
|
|
- this.className += " active";
|
|
|
- });
|
|
|
-}
|
|
|
-
|
|
|
-//out = "";
|
|
|
-//for(i = 0; i < resultArray.length; i++){
|
|
|
- // out = out + JSON.stringify(resultArray[i])
|
|
|
-//}
|
|
|
-//queryStringOutput = (queryStringOutput + out).replace("}{",",");
|
|
|
-
|
|
|
-
|
|
|
-/*
|
|
|
-
|
|
|
-var locations = [
|
|
|
- ["LOCATION_1", 11.8166, 122.0942],
|
|
|
- ["LOCATION_2", 11.9804, 121.9189],
|
|
|
- ["LOCATION_3", 10.7202, 122.5621],
|
|
|
- ["LOCATION_4", 11.3889, 122.6277],
|
|
|
- ["LOCATION_5", 10.5929, 122.6325]
|
|
|
-];
|
|
|
-
|
|
|
-var map = L.map('map').setView([11.206051, 122.447886], 8);
|
|
|
-mapLink =
|
|
|
- '<a href="http://openstreetmap.org">OpenStreetMap</a>';
|
|
|
-L.tileLayer(
|
|
|
- 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
|
|
- attribution: '© ' + mapLink + ' Contributors',
|
|
|
- maxZoom: 18,
|
|
|
- }).addTo(map);
|
|
|
-
|
|
|
-for (var i = 0; i < locations.length; i++) {
|
|
|
- marker = new L.marker([locations[i][1], locations[i][2]])
|
|
|
- .bindPopup(locations[i][0])
|
|
|
- .addTo(map);
|
|
|
-}
|
|
|
-*/
|
|
|
-
|
|
|
-$(document).on("click", ".persona", function (ev) {
|
|
|
-
|
|
|
- var link = this.id;
|
|
|
- //alert(nome_autore);
|
|
|
- //$('#myModal').text("");
|
|
|
- window.open("Persona.html?link="+this.id);
|
|
|
-
|
|
|
-
|
|
|
- });
|