使用 KendoUI Charts,如何使 Legend 项成为超链接?

Posted

技术标签:

【中文标题】使用 KendoUI Charts,如何使 Legend 项成为超链接?【英文标题】:Using KendoUI Charts, How do you make the Legend item a hyperlink? 【发布时间】:2012-05-12 01:43:48 【问题描述】:

我正在使用 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]

);​

这是我尝试失败的 jsFiddle 项目:http://jsfiddle.net/wCB5a/1/

任何帮助将不胜感激。

【问题讨论】:

【参考方案1】:

Telerik 告诉我,此功能目前在 KendoUI(版本 2012.1.233)中不存在,并且已注意到该功能,并且可能会在未来的版本中。

我解决这个问题的方法是隐藏图例。使用超链接创建我自己的图例。

【讨论】:

罗德尼,你能试着回答我的问题吗?我想你将能够回答。链接:***.com/questions/33889722/…

以上是关于使用 KendoUI Charts,如何使 Legend 项成为超链接?的主要内容,如果未能解决你的问题,请参考以下文章

Kendo UI - 如何在编辑时使特定字段只读,同时在剑道网格中创建可编辑?

如何在 KendoUI Tabstrip 中访问 KendoUI Grid 选定行哈希模板(KendoUI)值

使用 KendoUI 折线图,如何保持条形点连接? (见图片)

如何在 Swift 语言下使用 iOS Charts API 制作漂亮图表

用于自定义图例的 Angular ngx-charts 选项?

如何修改 KendoUI 滑块刻度上的标签?