線の色を指定する

書式

strokeColor : color

color : 線の色

説明

線の色を指定するにはオプションのstrokeColorにカラーコードまたはカラー名を指定します。

サンプルコード [実行]

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>Sample</title>
<link rel="stylesheet" href="main.css" type="text/css" media="all">
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript" src="plotr/Plotr.js"></script>
<script type="text/javascript" src="plotr/excanvas.js"></script>
<script type="text/javascript"><!--
function displayGraph(){
var dataset = {
"y2006Q3": [[0, 1], [1, 1], [2, 1.2], [3, 1.5]],
"y2007Q1": [[0, 0.5], [1, 0.89], [2, 2.15], [3, 4]],
"y2007Q2": [[0, 0.2], [1, 0.79], [2, 3.95], [3, 3.2]]
};
var options = {
padding: {left: 80, right: 0, top: 10, bottom: 10},
backgroundColor: "#dbdbdb",
colorScheme: "#550000",
strokeWidth : 3,
strokeColor:"blue",
xTicks: [
{v:0, label:"ブラウン管"},
{v:1, label:"リアプロ"},
{v:2, label:"プラズマ"},
{v:3, label:"液晶"}
]
};
var bar = new Plotr.BarChart("graph", options);
bar.addDataset(dataset);
bar.render();
}
// --></script>
</head>
<body>
<h1>グラフを描く</h1>
<form>
<input type="button" value="グラフ表示" onClick="displayGraph()">
</form>
<div><canvas id="graph" height="300" width="600"></canvas></div>
</body>
</html>