首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >同一页上的多个图表的Shield UI图表工具提示是否可以不同?

同一页上的多个图表的Shield UI图表工具提示是否可以不同?
EN

Stack Overflow用户
提问于 2015-05-26 02:06:56
回答 1查看 194关注 0票数 0

我已经阅读了Shield UI网站上的所有文档,但只能找到与图表工具提示相关的一条语句:

代码语言:javascript
代码运行次数:0
运行
复制
tooltipSettings: {
customHeaderText: "Local point Value: ",
customPointText: function (point, chart) {
                return shield.format(
                    '<span><b>{value}</b></span>',
                    {
                        value: point.y
                    }
                );
            }
},

如果对任何图表更改此设置,则页面上所有图表的工具提示都会更改。

我有一个在数字和百分比之间切换的单选按钮,因此需要工具提示包括一个'%‘,只是为该图表。

有没有人可以在不影响其他图表的情况下更改单个图表的工具提示?

EN

回答 1

Stack Overflow用户

发布于 2015-05-26 02:30:36

我认为这是图表组件中的一个错误,他们已经修复了它。我使用来自shieldui chart demos’ web site的最新版本的脚本进行了测试,一切工作正常。

您能否尝试使用以下脚本引用,并让我知道问题是否仍然存在:

代码语言:javascript
代码运行次数:0
运行
复制
<script type="text/javascript" src="http://www.shieldui.com/shared/components/latest/js/shieldui-all.min.js"></script>

我使用下面的例子:

代码语言:javascript
代码运行次数:0
运行
复制
<div id="chart1" ></div>
<br /><br /><br /><br /><br /><br />
<div id="chart2"></div>
$(document).ready(function () {
$("#chart2").shieldChart({
    theme: "light",
    exportOptions: {
        image: false,
        print: false
    },

    seriesSettings: {
        bar: {
            stackMode: "normal"
        }
    },
    axisX: {
        categoricalValues: [
            "1952", "1956", "1960", "1964", "1968", "1972", "1976",
            "1984", "1988", "1992", "1996", "2000", "2004", "2008", "2012"
        ]
    },
    primaryHeader: {
        text: "Olympic Medals won by USA"
    },
    dataSeries: [{
        seriesType: "bar",
        collectionAlias: "Gold Medals",
        data: [40, 32, 34, 36, 45, 33, 34, 83, 36, 37, 44, 37, 35, 36, 46],
        stackIndex: 1
    }, {
        seriesType: "bar",
        collectionAlias: "Silver Medals",
        data: [19, 25, 21, 26, 28, 31, 35, 60, 31, 34, 32, 24, 40, 38, 29],
        stackIndex: 1
    }, {
        seriesType: "bar",
        collectionAlias: "Silver Medals1",
        data: [19, 25, 21, 26, 28, 31, 35, 60, 31, 34, 32, 24, 40, 38, 29],
        stackIndex: 2
    },
    {
        seriesType: "bar",
        collectionAlias: "Bronze Medals",
        data: [17, 17, 16, 28, 34, 30, 25, 30, 27, 37, 25, 33, 26, 36, 29],
        stackIndex: 2
    }]
});

$("#chart1").shieldChart({
    theme: "light",
    tooltipSettings: {
        customHeaderText: "Local point Value: ",
        customPointText: function (point, chart) {
            return shield.format(
                '<span><b>{value}</b></span>',
                {
                    value: point.y
                }
            );
        }
    },
    axisX: {
        categoricalValues: [
            "1952", "1956", "1960", "1964", "1968", "1972", "1976",
            "1984", "1988", "1992", "1996", "2000", "2004", "2008", "2012"
        ]
    },
    primaryHeader: {
        text: "Olympic Medals won by USA"
    },
    dataSeries: [{
        seriesType: "bar",
        collectionAlias: "Gold Medals",
        data: [40, 32, 34, 36, 45, 33, 34, 83, 36, 37, 44, 37, 35, 36, 46],
    }]
});});
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/30443809

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档