英文:
Jquery Pie Chart add Background Image on each slice
问题
我想在饼图的每个切片上放一张背景图片。
在这段代码中,我应该在哪里放置背景图片?
我已经尝试在数据点上使用 indexLabelBackgroundColor: "url(https://example.com/image1.jpg)" 来将颜色更改为图片。参考链接:https://canvasjs.com/jquery-charts/pie-chart-index-data-label-inside/
英文:
I want to put a background image on each slice on Piechart.
where should I put the background image on this code?
window.onload = function() {
var mychart = {
animationEnabled: true,
legend:{
horizontalAlign: "top",
verticalAlign: "top",
fontColor: "#fff"
},
data: [{
type: "pie",
showInLegend: true,
explodeOnClick: false,
toolTipContent: "<b>{name}</b>",
indexLabel: "{name}",
legendText: "{name}",
indexLabelPlacement: "inside",
indexLabelFontColor: "#fff",
indexLabelFontSize: 12,
indexLabelMaxWidth:100 ,
dataPoints: [
{ y: 10, name: "BUSINESS BRANDING", link: "https://yourcompanygo.com/business-admin/", color: "#36A2EB" },
{ y: 10, name: "BUSINESS ASSETS", link: "https://yourcompanygo.com", color: "#FFCE56"},
{ y: 10, name: "BUSINESS FORMATION", link: "https://yourcompanygo.com", color: "#c0504e"},
{ y: 10, name: "BUSINESS ADMINISTRATIVE", link: "https://yourcompanygo.com/get-started/", color: "#FF6384" }
],
click: function(e) {
if (e.dataPoint.link) {
window.open(e.dataPoint.link, "_blank");
}
}
}],
backgroundColor: "transparent"
};
var chart = new CanvasJS.Chart("chartContainer", mychart);
chart.options.data[0].toolTipContent = "<b>{name}</b>";
chart.options.data[0].dataPoints.forEach(function (d) {
d.mouseover = function () {
chart.options.data[0].dataPoints.forEach(function (p) {
p.color = (p.name === d.name) ? "red" : p.color;
});
chart.render();
};
d.mouseout = function () {
chart.options.data[0].dataPoints.forEach(function (p) {
p.color = p.color.replace("red", "").trim();
});
chart.render();
};
});
chart.render();
};
I already tried indexLabelBackgroundColor: "url(https://example.com/image1.jpg)" on datapoint to change the color to image.see reference url here https://canvasjs.com/jquery-charts/pie-chart-index-data-label-inside/
答案1
得分: 0
经过调查(阅读插件文档)后,我发现不可能将图像作为饼图的每个切片的背景。
您应该提出一个产品建议来添加它,自行添加,或者找到另一个能够实现这一功能的插件。
他们有论坛和快速聊天,您可以向他们咨询此事。
英文:
After investigation (reading plugin documentation) I see that it's not possible to put image as a background of each slice of the piechart.
You should raise a product suggestion to add it, add it yourself or find another plugin that is able to do that.
They have forum and quick chat where you can ask them about this.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论