{"id":25205184,"url":"https://github.com/sparna-git/sparnatural-yasgui-plugins","last_synced_at":"2025-05-13T01:24:17.537Z","repository":{"id":121194235,"uuid":"452372390","full_name":"sparna-git/Sparnatural-yasgui-plugins","owner":"sparna-git","description":"Set of Plugins for Yasgui / YASR useful in conjunction with Sparnatural","archived":false,"fork":false,"pushed_at":"2025-04-25T10:18:54.000Z","size":5054,"stargazers_count":4,"open_issues_count":21,"forks_count":1,"subscribers_count":5,"default_branch":"main","last_synced_at":"2025-05-08T00:14:36.807Z","etag":null,"topics":["rdf","sparnatural","sparql","yasgui"],"latest_commit_sha":null,"homepage":"http://sparnatural.eu","language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"lgpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/sparna-git.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-01-26T17:26:51.000Z","updated_at":"2025-04-25T10:18:58.000Z","dependencies_parsed_at":"2024-03-09T09:27:08.244Z","dependency_job_id":"c679c204-277b-4093-a241-ef8dd25a2b9d","html_url":"https://github.com/sparna-git/Sparnatural-yasgui-plugins","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sparna-git%2FSparnatural-yasgui-plugins","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sparna-git%2FSparnatural-yasgui-plugins/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sparna-git%2FSparnatural-yasgui-plugins/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/sparna-git%2FSparnatural-yasgui-plugins/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/sparna-git","download_url":"https://codeload.github.com/sparna-git/Sparnatural-yasgui-plugins/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253852027,"owners_count":21973840,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["rdf","sparnatural","sparql","yasgui"],"created_at":"2025-02-10T09:19:20.004Z","updated_at":"2025-05-13T01:24:17.526Z","avatar_url":"https://github.com/sparna-git.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Sparnatural-yasgui-plugins\nSet of Plugins for Yasgui / YASR useful in conjunction with [Sparnatural](https://github.com/sparna-git/Sparnatural)\n\nFor integration with Sparnatural, there is a [dedicated documentation page](https://docs.sparnatural.eu/YasGUI-plugins.html)\n\n## The Plugins\n\n### TableX plugin\n\nThis is an adaptation of the original YaSR Table plugin. Its main enhancement is that it can hide URI columns \"behind\" a correspondig label column, thus hiding technical URIs for end-users. The link URLs can also be customzed to navigate to another URL than the original URI.\n\nFor every column `?xxx_label`, the plugin will look for a column `?xxx` having a literal property (for example `?Person_1` and `?Person_1_label`), and merge these columns. The merge is done on the SPARQL result set itself, by creating a new kind of result `x-labelled-uri` containing both the URI and its label. Only the `?xxx` column will be shown.\n\nThe table also displays dates as localized date for end-users.\n\nInstead of this:\n\n![](docs/images/tablex-without-plugin.png)\n\nYou would get this:\n\n\n![](docs/images/tablex-with-plugin.png)\n\n\n### Grid plugin\n\nThe Grid plugin works only in conjunction with Sparnatural, not for any SPARQL query. It needs to be notified of the Sparnatural original query, and the Sparnatural original configuration.\n\nThe Grid plugin:\n- looks for a main title column for each entity\n- merges the lines in the result set with the same title\n- displays the other columns in each card by replicating the original query structure from Sparnatural\n- can look for an image column (containing URIs ending in `.png` or `.jpg`)\n\nHere is how it looks like with an image column selected:\n\n![](docs/images/grid-1.png)\n\nThe original query was the following: (_All chairmans of EU political groups, with dates of chair and image_, based on the [European Parliament Open Data Portal](https://data.europarl.europa.eu/) datasets)\n\n![](docs/images/grid-3.png)\n\nThe original result set was the following - note how each person is duplicated as many times as it was a chairman of a group, with different dates:\n\n![](docs/images/grid-4.png)\n\n\nHere is a focus on one card, note how the lines corresponding to the same entity have been merged, and how the original query structure is replicated inside the card:\n\n![](docs/images/grid-2.png)\n\n\n### Stats plugin\n\nThe Stats plugin can:\n- display a simple COUNT query, with only an integer result :\n\n![](docs/images/stats-1.png)\n\n- generate simple pie or bar charts from a `COUNT` + `GROUP BY` query\n\n![](docs/images/stats-2.png)\n\n\n![](docs/images/stats-3.png)\n\n\n### Map plugin\n\nThe map plugin:\n\n- Reads columns with a datatype of `geo:wktLiteral`\n- Can display Points and Polygons. MultiPolygons are currently not supported\n- Displays the original query area coming from the query, if present\n- Displays information bubbles by reading all columns from the result set\n- Splits polygons into different layers according to their size, so that the user can reduce the number of polygons displayed on the map for clarity\n- Can warn users if some lines in the result set do not have their coordinates filled int\n\nHere is an exampe:\n\n![](docs/images/map-1.png)\n\n### Timeline plugin\n\nTODO\n\n### Integration in the page\n\n#### Declaration with YasGUI / YasR\n\n```html\n\u003cscript type=\"text/javascript\" src=\"./sparnatural-yasgui-plugins.js\"\u003e\u003c/script\u003e\n```\n\n```javascript\n      Yasr.registerPlugin(\"TableX\",SparnaturalYasguiPlugins.TableX);\n      Yasr.registerPlugin(\"Grid\",SparnaturalYasguiPlugins.GridPlugin);\n      Yasr.registerPlugin(\"Stats\",SparnaturalYasguiPlugins.StatsPlugin);\n      Yasr.registerPlugin(\"Map\",SparnaturalYasguiPlugins.MapPlugin);\n\n      delete Yasr.plugins['table'];\n      delete Yasr.plugins['response'];\n      const yasr = new Yasr(document.getElementById(\"yasr\"), {\n        pluginOrder: [\"TableX\", \"Grid\", \"Stats\", \"Map\"],\n        defaultPlugin: \"TableX\",\n        // disable persistency\n        persistencyExpire: 0,\n        maxPersistentResponseSize: 0\n      });\n\n      if(lang == \"fr\") { \n        yasr.plugins[\"Grid\"].config.lang = \"fr\";\n        yasr.plugins[\"TableX\"].config.lang = \"fr\";\n        yasr.plugins[\"Stats\"].config.lang = \"fr\";\n      } else {\n        yasr.plugins[\"Grid\"].config.lang = \"en\";\n        yasr.plugins[\"TableX\"].config.lang = \"en\";\n        yasr.plugins[\"Stats\"].config.lang = \"en\";\n      }\n\n      yasr.plugins[\"TableX\"].config.uriHrefAdapter = function(uri) {\n        if(uri.startsWith(\"http://fr.dbpedia.org/resource/\")) {\n          return \"http://fr.wikipedia.org/wiki/\" + uri.substring(\"http://fr.dbpedia.org/resource/\".length);\n        } else {\n          return uri;\n        }\n      };\n\n      // binds Sparnatural with the YasR plugins\n      bindSparnaturalWithYasrPlugins(sparnatural, yasr);\n```\n\n#### Integration with Sparnatural\n\nThese plugins require a specific integration with Sparnatural to work. See the [Sparnatural documentation page](https://docs.sparnatural.eu/YasGUI-plugins.html). See the file `sparnatural-bindings.js` in Sparnatural releases.\n\n#### API\n\nThese plugins have the following methods:\n\n- `notifyQuery(query)` : expects the Sparnatural query structure, to be notified of the original query structure that was executed.\n- `notifyConfig(specProvider)` : expects the Sparnatural configuration, to be aware of the labels and icons of the properties and classes in the config.\n\n#### Configuration\n\n##### TableX plugin\n\n```typescript\nexport interface PluginConfig {\n  openIriInNewWindow: boolean;\n  tableConfig: DataTables.Settings;\n  includeControls: boolean;\n  excludeColumnsFromCompactView: string[];\n  uriHrefAdapter?: (uri: string) =\u003e string;\n  bindingSetAdapter?: (binding: Parser.Binding) =\u003e Parser.Binding;\n  lang?: string;\n}\n```\n\n- `excludeColumnsFromCompactView` takes an array of column names. These column names will be hidden when the table is set to \"compact view\".\n- `includeControls` controls whether the search, compact view switch and ellipse checkbox are displayed\n\nHere is an example configuration code\n\n```javascript\n      # this is setting the compact view on\n      yasr.plugins[\"TableX\"].persistentConfig.compact = true;\n      yasr.plugins[\"TableX\"].config.includeControls = true;\n      yasr.plugins[\"TableX\"].config.excludeColumnsFromCompactView = [ \n        \"File\",\n        \"RepresentationType\"\n      ]; \n```\n\n##### Grid plugin\n\n```typescript\ninterface PluginConfig {\n  lang: \"en\" | \"fr\";\n}\n```\n\n##### Stats plugin\n\n```typescript\ninterface PluginConfig {\n  lang: \"en\" | \"fr\";\n}\n```\n\n##### Map plugin\n\n```typescript\ninterface PluginConfig {\n    baseLayers: Array\u003c{\n        urlTemplate: string, \n        options?: L.TileLayerOptions\n    }\u003e\n    polylineOptions: L.PolylineOptions | null,\n    markerOptions: L.MarkerOptions | null,\n    geoDataType: Array\u003cstring\u003e,\n    polygonDefaultColor: string,\n    polygonColors: Array\u003cstring\u003e,\n    searchedPolygon: {\n        fillColor: string,\n        weight: number,\n        opacity: number,\n        color: string,\n        dashArray: string,\n        fillOpacity: number\n    },\n    mapSize: {\n        width:string,\n        height:string\n    }\n    setView: {\n        center: L.LatLngExpression,\n        zoom?: number,\n        options?: L.ZoomPanOptions\n    }\n    parsingFunction: (literalValue:string)=\u003e Geometry,\n    L18n: {\n        warnFindNoCoordinate: string, // use \"\u003ccount\u003e\" pattern to replace with count of results with no geo coordinates\n        warnFindNoCoordinateBtn: string // Link label for plugin table display on warnig message\n    }   \n}\n```\n\n## Developers\n\n1. Clone the code\n2. Install dependencies : `npm install`\n3. Run dev server : `npm run start`\n4. Adjust the code in the test page (index.html) to test and include the plugin\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsparna-git%2Fsparnatural-yasgui-plugins","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsparna-git%2Fsparnatural-yasgui-plugins","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsparna-git%2Fsparnatural-yasgui-plugins/lists"}