ShieldUI Opaque Bubbles
by cristiscu
HTML
<link href="http://www.shieldui.com/shared/components/latest/chart/css/shield-chart.min.css" rel="stylesheet" type="text/css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js" type="text/javascript"></script>
<script src="http://www.shieldui.com/shared/components/latest/js/shieldui-core.min.js" type="text/javascript"></script>
<script src="http://www.shieldui.com/shared/components/latest/js/shieldui-chart.min.js" type="text/javascript"></script>
<div id="chart_div"></div>
JavaScript
$(function () {
$("#chart_div").shieldChart({
axisX: { categoricalValues: [ 2000,2001,2002,2003,2004,2005] },
seriesSettings: {
bubble: {
color: "#ff0000", // this (red) color is not opaque!
//color: "red", // named color looks opaque!
//color: "rgba(128, 0, 0, 1)", // this is not working, rgba not accepted
}
},
dataSeries: [{
seriesType: "bubble",
data: [
{ x: 2000, y: 60, size: 3 },
{ x: 2001, y: 33, size: 1 },
{ x: 2002, y: 12, size: 2 },
{ x: 2003, y: 40, size: 3 },
{ x: 2004, y: 34, size: 3 },
{ x: 2005, y: 78, size: 1 },
]
}]
});
});