0

我需要能够向 Zoomcharts 中的 pie.info.contentsFunction 添加一些自定义信息。我在页面上有多个图表，每个图表都是这样创建的......

       var pc = new PieChart({
            pie: {
                innerRadius: 0.5,
            },
            container: chartContainer1,
            area: { height: 500 },
            data:chartData,
            toolbar: {
                "fullscreen": true,
                "enabled": true
            },
            info: {
                contentsFunction: boomChartTT
            }
        });

在“boomChartTT”功能中，我需要知道悬停在哪个图表上。我希望能够做这样的事情......

info: {
 contentsFunction: boomChartTT(i)
}

...其中“i”是图表的索引。

我需要知道图表索引的原因是因为我在每个图表的索引数组中保存了一些其他数据。图表的索引与数据的索引相匹配。

示例：如果用户将鼠标悬停在chart2 中的某个切片上，我想将'2' 传递给boomChartTT 函数，这样我就可以访问该图表的总计数据（例如totalsData[2]）。

过去，我通过简单地向图表容器添加一个数据属性来为我提供这样的索引，在过去与其他图表库一起完成了这一点......

<div id="chartContainer1" data-index="1"></div>

...然后我可以从悬停函数（contentsFunction）访问chartContainer，然后获取该索引。

我不想将总计数据添加到实际图表数据中，因为我必须将其添加到每个多余的切片中。

有没有办法做到这一点？

如果我的帖子不清楚，请告诉我。

编辑添加：我认为这并不重要，但这里是 boomChartTT 函数：

function boomChartTT(data,slice){
    var tt="<div class=\"charttooltip\">";
    if(data.name==="Others" || data.name==="Previous"){return tt+=data.name+"</div>";}
    //var thisData=dataSearch(totalsData[i],"REFERRINGSITE",data.id);
    tt+="<h5 class=\"strong\">"+data.id+"</h5>"+oHoverTable.render(thisData)+"</div>";
    return tt;
}

注释行是我需要索引 (i) 以获取正确的 totalsData 的位置。

4

1 回答 1

0

解决了。我只是像这样将“chartIndex”添加到数据中......

        for(var i=0;i<r.length;i++){
            var thisDataObj ={
                id:r[i].REFERRINGSITE,
                value:r[i].PCTOFSALES,
                name:r[i].REFERRINGSITE,
                chartIndex: arguments[1],//<----- arguments[1] is the chart index
                style: { expandable: false, fillColor: dataSearch(dataRSList,"REFERRINGSITE",r[i].REFERRINGSITE)[0].COLOR }
            };
            chartData.preloaded.subvalues.push(thisDataObj);
        }

然后在boomChartTT函数中......

function boomChartTT(data,slice){
    var tt="<div class=\"charttooltip\">";
    if(data.name==="Others" || data.name==="Previous"){return tt+=data.name+"</div>";}
    var thisData=dataSearch(totalsData[data.chartIndex-1],"REFERRINGSITE",data.id);
    tt+="<h5 class=\"strong\">"+data.id+"</h5>"+oHoverTable.render(thisData)+"</div>";
    return tt;
}

我担心向图表数据添加自定义字段会破坏图表（我相信我在其他库中经历过）。所以，你去吧。

于 2017-11-22T15:01:26.910 回答