如何在Liferay 7 MVC Portlet中显示D3.js图表

时间:2017-10-05 07:46:52

标签: d3.js liferay

我是Liferay的新手。

我想在portlet中显示由D3.js创建的图形。

我已经创建了默认的MVC portlet。

但是,我不知道如何在MVC portlet中显示我的图形。

能告诉你吗?

<!DOCTYPE html>
<html>
<script src="https://d3js.org/d3.v4.min.js"></script>
<style>
.chart div {
  font: 10px sans-serif;
  background-color: steelblue;
  text-align: right;
  padding: 3px;
  margin: 1px;
  color: white;
}


</style>
<body>

<div class="chart">

</div>

<script>
var data = [30, 86, 168, 281, 303, 365];
d3.select(".chart")
  .selectAll("div")
  .data(data)
    .enter()
    .append("div")
    .style("width", function(d) { return d * 2 + "px"; })
    .text(function(d) { return '$ ' + d; });
</script>

</body>
</html>

0 个答案:

没有答案