【问题标题】:show popup on click单击时显示弹出窗口
【发布时间】:2015-06-27 10:37:44
【问题描述】:

我正在使用融合图表想要在点击融合条形图栏时显示弹出窗口请帮助我我正在使用 json 方法生成图表 这是html:

<div id="chartContainerscoreConfidence" class="testseries-report-charts">
</div>

这里是json代码 :

FusionCharts.ready(function () {
    var revenueChart = new FusionCharts({
        "type": "StackedColumn2DLine",
        "renderAt": "chartContainerscoreConfidence",
        "width": "100%",
        "height": "300",
        "dataFormat": "json",
        "dataSource": {
            "chart": {
                "caption": "Time Taken",
                "bgcolor": "FFFFFF",
                "plotgradientcolor": "",
                "showalternatehgridcolor": "0",
                "showplotborder": "0",
                "divlinecolor": "CCCCCC",
                "showvalues": "0",
                "showcanvasborder": "0",
                "pyaxisname": "Question No",
                "syaxisname": "Time Taken (in minutes)",
                "numberprefix": "",
                "labeldisplay": "STAGGER",
                "slantlabels": "1",
                "canvasborderalpha": "0",
                "legendshadow": "0",
                "legendborderalpha": "0",
                "showborder": "0"
            },
            "categories": [
        {
            "category": [
                {
                    "label": "1"

                },
                {
                    "label": "2"

                },
                {
                    "label": "3"
                },
                {
                    "label": "4"
                },
                {
                    "label": "5"
                },
                {
                    "label": "6"
                },
                {
                    "label": "7"
                },
                {
                    "label": "8"
                }
            ]
        }
    ],
            "dataset": [
        {
            "seriesname": "Time taken by you",
            "color": "008ee4",
            "data": [
                {
                    "value": "3",
                    "link": " "
                },
                {
                    "value": "4"
                },
                {
                    "value": "1"
                },
                {
                    "value": "2"
                },
                {
                    "value": "1"
                },
                {
                    "value": "3"
                },
                {
                    "value": "4"
                },
                {
                    "value": "3"
                }
            ]
        },
        {
            "seriesname": "time taken by average student",
            "parentyaxis": "S",
            "renderas": "Line",
            "color": "f8bd19",
            "data": [
                {
                    "value": "1"
                },
                {
                    "value": "2"
                },
                {
                    "value": "4"
                },
                {
                    "value": "3"
                },
                {
                    "value": "2"
                },
                {
                    "value": "3"
                },
                {
                    "value": "3"
                },
                {
                    "value": "4"
                }
            ]
        }
    ]
        }
    });
    revenueChart.render();
})

我可以在任何 url 上重定向,但无法使用 jquery 打开弹出窗口

js 小提琴: http://jsfiddle.net/y3H2G/226/

【问题讨论】:

  • 请帮我解决这个问题

标签: html json fusion


【解决方案1】:

有很多插件。如果你使用 bootstrap,你可以使用 boostrap 的模态对话框,或者你可以使用 bpopup jquery plugin,这里是一个演示(我已经更新了你的 js fiddle):http://jsfiddle.net/y3H2G/227/

代码:

<!-- Simple implementation of the Bar 2D chart -->
<div id="chartContainerscoreConfidence" class="testseries-report-charts">
</div>
<input type="button" id="btn" value="Show popup" name="btn" onclick="$('#chartContainerscoreConfidence').bPopup();" />

【讨论】:

  • 谢谢,但我希望弹出点击任何栏而不是任何按钮:(
【解决方案2】:

呜呜 经过大量努力得到了解决方案 我在所有栏中添加了一个类,并在单击任何栏时调用单击事件

$(window).load(function () {


           //$('#raphael-paper-149').addClass('hhhhhhhhhhhhhhhhhhhhhhhhhhhh');
           $("#raphael-paper-149 g").attr("class", "clickbleClass");
           $('.clickbleClass').click(function(){
            alert('hi');
           });
        });

【讨论】:

    猜你喜欢
    • 2021-04-26
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2023-04-09
    • 2014-08-09
    • 1970-01-01
    相关资源
    最近更新 更多