javascript - Kendo UI 图表工具提示和重绘

标签 javascript jquery charts kendo-ui kendo-dataviz

我的问题如下:

我想在 Kendo UI 中有一个散点图,我可以在其中显示工具提示并具有系列悬停效果。

演示:http://jsfiddle.net/9Lvzu9qh/2/

注释掉第 44 行: chart.redraw(); 查看我的问题。如果重新绘制图表,工具提示将被清除。如果图表没有重新绘制,我就不会得到突出显示效果。

如何同时获得突出显示和工具提示?解决任一问题的替代方法也被接受。

最佳答案

仅当我更改系列时,我才可以保存以前的 ID 并更改颜色:

var previousId = 0;
$("#chart").kendoChart({
    title: {
        text: "Line demo (Kendo UI v2014.3.1119)"
    },
    legend: {
        position: "bottom"
    },
    seriesDefaults: {
        type: "scatterLine",
        width: 2,

    },
    series: [{
            name: "A",
            data: [[0,1], [1,2], [2,3]]
        },
        {
            name: "B",
            data: [[0,2], [1,3], [2,5]]
        },
        {
            name: "C",
            data: [[0,3], [1,5], [2,2]]
        }
    ],
    seriesHover : function(e) {

        var chart = e.sender;
        var idx = _.findIndex(chart.options.series, function (s) {
            return s === e.series;
        });
        if(previousId != idx)
            previousId = idx;
        else
            return;
        if (idx >= 0) {
            var thisSeries = chart.options.series[idx];
            // attach event to hovering over a series
            // On hover, set opacity to full and increase width
            // Decrease opacity and width on all other series
            _.each(chart.options.series, function (s) {
                s.width = 2;
                s.opacity = 0.4;
            });

            thisSeries.width = 4;
            thisSeries.opacity = 1;
             $("#chart").data("kendoChart").redraw();




        }
    },
    tooltip: {
        visible: true,
        format: "X: {0} Y: {1}"
    },
    transitions: false
});

希望有帮助。

fiddle :http://jsfiddle.net/9Lvzu9qh/4/

关于javascript - Kendo UI 图表工具提示和重绘,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29624054/

相关文章:

javascript - R 中的 MVC 模式

javascript - jQuery 表单验证问题

javascript - 主干和 $el 元素

jquery - 当 Chrome 框架不存在/禁用时,IE8 中的图像链接失败

javascript - 如何隐藏和显示链接中的另一个 iframe

javascript - 读取嵌入 JSON 的图表也会读取 JSON 文件吗?

ios - 如何使用 Shinobi iOS SDK 为条形图填充垂直渐变?

java - 有人知道如何使用 MPAndroidChart 吗?

javascript - 在 Angular js 中嵌套 ng-views

javascript - 错误 : [Header] is not a <Route> component