私は KendoUI を使用しており、次のチャートを作成しました。この場合、レジェンド項目「製品 1」をハイパーリンクにする必要があります。それ、どうやったら出来るの?
私のマークアップ:
<div id='chart' ></div>
私のスクリプト:
jQuery('#chart').kendoChart({
seriesDefaults: {
type: "line",
missingValues: "interpolate"
},
legend: {
position: "bottom"
},
valueAxis: [{
title: {
text: "Score"
},
min: 75,
max: 90,
},
{
name: "hidden",
visible: false,
min: 75,
max: 90},
{
name: "ProductSurveys",
min: 15,
max: 55,
title: {
text: "Survey Count"
},
color: "#4c4c4c"}],
series: [{
type: "line",
name: "<a href='http://jsfiddle.net/rodneyhickman/wCB5a/' >Product 1</a>",
color: "#004990",
width: 1,
markers: {
background: "#004990"
},
tooltip: {
visible: true,
template: "<b>Product 1</b><br/>Current Score: #= value #<br/>#= category # "
},
data: [87.11, 87.27, 87.21, 86.84, 85.47, 84.87, 84.52, 85.19, 85.19, 85.2, 84.68, 83.78, 82.14]},
{
type: "line",
name: "Market Segment Average",
color: "#da7633",
width: 1,
markers: {
background: "#da7633"
},
tooltip: {
visible: true,
template: "<b>Market Segment Average</b><br/>Current Score: #= value #<br/>#= category # "
},
data: [77.73, 77.27, 77.22, 76.68, 76.19, 75.7, 75.86, 76.09, 76.33, 76.15, 75.75, 75.4, 75.9]},
{
type: "column",
data: [50, 48, 48, 46, 46, 48, 49, 46, 39, 37, 36, 34, 27],
name: "Survey Count",
color: "#e9eafe",
axis: "ProductSurveys"}],
categoryAxis: {
labels: {
rotation: -45,
step: 1,
skip: 0
},
categories: ["Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec", "Jan - 2012", "Feb", "Mar", "Apr"],
axisCrossingValue: [0, 0, 100, 100]
}
}); </p>
これは私の失敗した試みの jsFiddle プロジェクトです: http://jsfiddle.net/wCB5a/1/
任意のヘルプをいただければ幸いです。