TreeMap for JAVA Apache Wicket Setup

Home >Shield UI Documentation >TreeMap >JAVA Apache Wicket >TreeMap for JAVA Apache Wicket Setup

The ShieldUI TreeMap Apache Wicket widget offers streamlined setup and deployment of our libraries.

Since it is a wrapper of our JavaScript ShieldUI TreeMap component, you need to include the references to the CSS and JavaScript resources in the HEAD section of your webpage:

<!DOCTYPE html>
<html>
<head>
<title>Shield Chart</title>
<meta charset="utf-8" />

<link rel="stylesheet" type="text/css" href="css/shieldui-all.min.css" />
<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="js/shieldui-all.min.js"></script>

</head>
<body>
    <div wicket:id="treemap"></div>
</body>
</html>

Then init the treemap widget and add it to your wicket page like in the following example:

final TreeMap treemap = new TreeMap("treemap");
add(treemap);

treemap.getOptions()
	.setTitle("A sample treemap")
	.setType(TreeMapOptions.Type.SQUARIFIED)
	.setValueTemplate("{frequency}")
	.setTextTemplate(new JsonFunction("function(item) { return item.text; }"))
	.setDataSource(
		new DataSourceOptions()
			.setData(
				new HashMap<String, Object>() {{
				    put("text", "Item1");
				    put("frequency", 45);
				}},
				new HashMap<String, Object>() {{
				    put("text", "Item2");
				    put("frequency", 45);
				}},
				new HashMap<String, Object>() {{
				    put("text", "Item3");
				    put("frequency", 60);
				}},
				new HashMap<String, Object>() {{
				    put("text", "Item4");
				    put("frequency", 90);
				}},
				new HashMap<String, Object>() {{
				    put("text", "Item5");
				    put("frequency", 45);
				}},
				new HashMap<String, Object>() {{
				    put("text", "Item6");
				    put("frequency", 30);
				}},
				new HashMap<String, Object>() {{
				    put("text", "Item12");
				    put("frequency", 33);
				    put("href", "shieldui.com");
				    put("target", "_blank");
				}}
			)
	);

To see more information on this wrapper, please refer to the following startup guide.