Navigate *All* the Knowledge
Getting started with ConceptMap.io
James L. Weaver
Developer Advocate
Twitter: @JavaFXpert
Email: jweaver@pivotal.io
http://JavaFXpert.com
http://CulturedEar.com
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2301897/106lp3.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2511632/conceptmap-icon-360x360.png)
@JavaFXpert
About the Presenter
Java Champion, JavaOne Rockstar, plays well with others, etc :-)
Author of several Java/JavaFX/RaspPi books
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2305520/Screen_Shot_2016-03-03_at_3.30.04_PM.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
@JavaFXpert
Mission: "Transform how the world builds software"
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/4121716/spring-by-pivotal.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/4121759/pcf.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/4121817/pivotallabs.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/4121891/pks.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/3925817/Screen_Shot_2017-06-20_at_3.27.46_PM.png)
Mission: "Transform how the world builds software"
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
App is live at ConceptMap.io
ConceptMap.io source code for services and UI: https://github.com/JavaFXpert/wikibrowser-service
Open source, licensed under the Apache License, Version 2.0
Note: These Technical Presentation slides are available at
http://slides.com/javafxpert/conceptmap-technical
as well as by clicking the Help button in ConceptMap.io
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2525971/question-mark.png)
@JavaFXpert
Wikimedia has many projects
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2302012/Screen_Shot_2016-03-03_at_12.18.06_AM.png)
Graphic from presentation by Lynda Pintscher
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
@JavaFXpert
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2302036/Screen_Shot_2016-03-03_at_12.26.45_AM.png)
... the most famous is Wikipedia
Graphic from 2013 presentation by Lynda Pintscher
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
@JavaFXpert
Graphic from 2013 presentation by Lynda Pintscher
Wikimedia Commons
Media files leveraged by Wikimedia projects
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2302060/Screen_Shot_2016-03-03_at_12.38.45_AM.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
@JavaFXpert
Graphic from 2013 presentation by Lynda Pintscher
Wikidata
Central storage for the structured data of Wikimedia projects
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2302062/Screen_Shot_2016-03-03_at_12.40.20_AM.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
@JavaFXpert
Graphic from 2013 presentation by Lynda Pintscher
Wikidata
Provides semantic structure for Wikipedia articles in any language
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2302074/Screen_Shot_2016-03-03_at_12.45.43_AM.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
@JavaFXpert
Wikipedia + Wikidata
Wikipedia articles and their relationships to each other
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2521609/Screen_Shot_2016-04-24_at_10.34.45_AM.png)
@JavaFXpert
The Big Idea: ConceptMap.io
Navigate/pin Wikipedia articles via links and Wikidata relationships
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2511662/Screen_Shot_2016-04-21_at_9.50.43_AM.png)
@JavaFXpert
Designed to facilitate:
-
Learning
-
Teaching
-
Research
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2525315/Screen_Shot_2016-04-25_at_7.53.53_AM.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2525343/Screen_Shot_2016-04-25_at_9.18.32_AM.png)
Learning/Teaching Scenario
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2513853/Screen_Shot_2016-04-21_at_6.55.43_PM.png)
Search for an item and pin it to the concept map
Learning/Teaching Scenario
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2513884/Screen_Shot_2016-04-21_at_6.55.43_PM.png)
Select a link in the Wikipedia article
Learning/Teaching Scenario
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2513860/Screen_Shot_2016-04-21_at_6.57.54_PM.png)
Pin the item to the concept map
Learning/Teaching Scenario
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2513914/Screen_Shot_2016-04-21_at_7.13.45_PM.png)
Select an item in the map, expand a relationship, and select an item
Learning/Teaching Scenario
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2513928/Screen_Shot_2016-04-21_at_7.20.36_PM.png)
Pin the item to the concept map
Learning/Teaching Scenario
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2513953/Screen_Shot_2016-04-21_at_7.20.36_PM.png)
Select an item in the map, and click the [x1] button for a relationship
Learning/Teaching Scenario
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2513959/Screen_Shot_2016-04-21_at_7.27.24_PM.png)
The [x1] button pinned the items found at the first level of the relationship
Learning/Teaching Scenario
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2513990/Screen_Shot_2016-04-21_at_7.32.33_PM.png)
Select an item in the concept map, and select an item From Related Items
Learning/Teaching Scenario
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2513999/Screen_Shot_2016-04-21_at_7.38.08_PM.png)
Pin the item to the concept map
Learning/Teaching Scenario
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2514013/Screen_Shot_2016-04-21_at_7.42.49_PM.png)
Continue selecting items from Wikipedia articles and Wikidata Relationships
Learning/Teaching Scenario
... and pin them to the concept map
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2521543/Screen_Shot_2016-04-24_at_9.50.54_AM.png)
Learning/Teaching Scenario
Edit relationships for an item by selecting Wikidata icon
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2521584/Screen_Shot_2016-04-24_at_10.15.55_AM.png)
Learning/Teaching Scenario
Wikidata page appears with which anyone may edit the item's info
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2521591/Screen_Shot_2016-04-24_at_10.24.46_AM.png)
Learning/Teaching Scenario
Select the Link icon to create a link to the concept map
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2521553/Screen_Shot_2016-04-24_at_10.04.22_AM.png)
Learning/Teaching Scenario
Share the link to your concept map with a colleague or student
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2521552/Screen_Shot_2016-04-24_at_10.05.53_AM.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2299173/conceptmap-architecture.png)
High-level view of distributed architecture
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2511662/Screen_Shot_2016-04-21_at_9.50.43_AM.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2525370/cloudfoundry-logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2525376/spring-logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
Use case: Search for Earth
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2300318/conceptmap-architecture-uc-search.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2511688/Screen_Shot_2016-04-21_at_9.56.51_AM.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
Use case: Pin Earth to graph
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2300482/conceptmap-architecture-uc-pin.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2511732/Screen_Shot_2016-04-21_at_10.08.08_AM.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
http://example/graph?items=Q2,Q405,Q525
MATCH (a:Item), (b:Item)
WHERE a.itemId IN ['Q2', 'Q405', 'Q525']
AND b.itemId IN ['Q2', 'Q405', 'Q525']
WITH a, b
OPTIONAL MATCH (a)-[rel]-(b)
RETURN a, b, collect(rel)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
Neo4j Cypher query
(find all relationships between pinned items)
Resource controller
http://example/visgraph?items=Q2,Q405,Q525
Note: Because Jackson 2 is on the classpath, Spring’s MappingJackson2HttpMessageConverter is automatically chosen to convert the GraphResponseNear instance to JSON
@RestController
public class WikiGraphController {
@RequestMapping(value = "/graph", method = RequestMethod.GET,
produces = MediaType.APPLICATION_JSON_VALUE
public ResponseEntity<Object> search(@RequestParam(value = "items", defaultValue="")
String items) {
GraphResponseNear graphResponseNear = null;
...
return Optional.ofNullable(graphResponseNear)
.map(cr -> new ResponseEntity<>((Object)cr, HttpStatus.OK))
.orElse(new ResponseEntity<>("Graph query unsuccessful",
HttpStatus.INTERNAL_SERVER_ERROR));
}
}
To learn more, see Building a RESTful Web Service Spring Guide
Resource representation
public class Item {
private String type;
private String id;
public Item() {
}
public String getType() {
return type;
}
public void setType(String type) {
this.type = type;
}
public String getId() {
return id;
}
public void setId(String id) {
this.id = id;
}
}
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
Use case: Change language
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2300760/conceptmap-architecture-uc-language.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2512208/Screen_Shot_2016-04-21_at_11.45.08_AM.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
Use case: Share link
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2300805/conceptmap-architecture-uc-share.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
Use case: Breadth-first search
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2301066/conceptmap-architecture-uc-traverse.png)
(expand items related by a given property to a given depth)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2513192/Screen_Shot_2016-04-21_at_3.50.48_PM.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
Use case: Items in common
Text
(all shortest paths, two hops or less)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2301933/conceptmap-architecture-uc-incommon.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2513342/Screen_Shot_2016-04-21_at_4.34.35_PM.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
Neo4j Cypher query
http://example/visshortpaths?id=Q111&target=Q313
MATCH p=allShortestPaths(
(a:Item {itemId:'Q111'})-[*..2]-(b:Item {itemId:'Q313'})
)
RETURN p
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
(all shortest paths, two hops or less)
Use case: Navigate to root
(shortest path to Entity using subclass of, instance of, part of)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2301970/conceptmap-architecture-uc-rootpaths.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2525588/Screen_Shot_2016-04-25_at_10.24.15_AM.png)
Neo4j Cypher query
http://example/visrootpaths?id=Q332
MATCH p=allShortestPaths(
(a:Item {itemId:'Q332'})-[*]->(b:Item {itemId:'Q35120'})
)
WHERE NONE(x IN RELATIONSHIPS(p)
WHERE (x.propId <> 'P279') AND
(x.propId <> 'P31') AND
(x.propId <> 'P361')
)
RETURN p
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
(shortest path to Entity using subclass of, instance of, part of)
Make the app executable
package com.javafxpert.wikibrowser;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.boot.context.properties.EnableConfigurationProperties;
@EnableConfigurationProperties
@SpringBootApplication
public class WikiBrowserServiceApplication {
public static void main(String[] args) {
SpringApplication.run(WikiBrowserServiceApplication.class, args);
}
}
To learn more, see Building a RESTful Web Service Spring Guide
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
App build/deploy cycle
- $ mvn clean install
- $ cf push
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/1893708/cf-push-button.png)
Note: One method of deployment for Spring Boot apps is a JAR file, which contains an embedded Tomcat servlet container.
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
Pivotal Web Services Console
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/1893518/pivotal-web-services-console.png)
start.spring.io
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/1893726/start-spring-io.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
Use case: Degrees of separation
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2301029/conceptmap-architecture-uc-degrees.png)
Text
(shortest path, like Kevin Bacon game)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2513293/Screen_Shot_2016-04-21_at_3.54.42_PM.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
Use case: Amazon Alexa
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2301066/conceptmap-architecture-uc-traverse.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/3154125/amazon-alexa.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/3154133/alexa-skills-kit.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/3154141/amazon-lambda.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/3154214/plain-white-background.jpeg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/3154214/plain-white-background.jpeg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/3154214/plain-white-background.jpeg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/3154214/plain-white-background.jpeg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/3154214/plain-white-background.jpeg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/3154214/plain-white-background.jpeg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/3154214/plain-white-background.jpeg)
"ask concept map"
"get teams for Lionel Messi"
AWS Lambda developed in Java
Navigate *All* the Knowledge
ConceptMap.io from a technical perspective
James L. Weaver
Developer Advocate
Twitter: @JavaFXpert
Email: jweaver@pivotal.io
http://JavaFXpert.com
http://CulturedEar.com
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2301897/106lp3.jpg)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2362760/4080a2492514766cbfaddd717b4b0ab5e761b277_pivotal_logo.png)
![](https://s3.amazonaws.com/media-p.slid.es/uploads/396450/images/2511632/conceptmap-icon-360x360.png)
Hope you enjoyed
Getting Started with ConceptMap.io
By javafxpert
Getting Started with ConceptMap.io
Exploring the technologies employed in ConceptMap.io
- 38,895