Is there a way to include a link in the legend text within a fusion chart?
I have attempted the following code, but it seems to only add the link to the chart itself rather than within the legend's text:
"data": [{
"label": "Workplace Services",
"value": "24",
"color": "#81cee3",
"link": "http://google.com" // added this
}]
To incorporate a link in the legend, make use of the FusionCharts legendItemClicked API event. To learn more about this event, visit the following link -
Take a look at this sample code snippet:
"events": {
"legendItemClicked": function(eventObj, dataObj) {
if( eventObj.data.datasetName==="Food"){
window.location.href= "https://www.fusioncharts.com/dev/";
}
}
}
To discover how to utilize the legendItemClicked API event, visit this link -
FusionCharts.ready(function() {
var revenueChart = new FusionCharts({
type: 'pie2d',
renderAt: 'chart-container',
width: '550',
height: '350',
dataFormat: 'json',
dataSource: {
"chart": {
"caption": "Split of revenue by product categories",
"subCaption": "Last year",
"numberPrefix": "$",
"showPercentInTooltip": "0",
"decimals": "1",
"legendPosition": "right",
//Theme
"theme": "fusion",
"tooltipBorderRadius": "20"
},
"data": [{
"label": "Food",
"value": "285040"
},
{
"label": "Apparels",
"value": "146330"
},
{
"label": "Electronics",
"value": "105070"
},
{
"label": "Household",
"value": "49100"
}
]
},
"events": {
"legendItemClicked": function(eventObj, dataObj) {
if (eventObj.data.datasetName === "Food") {
window.location.href = "https://www.fusioncharts.com/dev/";
}
}
}
}).render();
});
View the demonstration fiddle here - https://jsfiddle.net/7urtdL65/
I'm currently developing a web application using Flask and Tailwind CSS, but I am facing an issue with importing custom fonts. Despite successfully building the CSS file, the HTML template fails to display the font as intended. How can I ensure that m ...
I'm encountering an issue with a button labeled Sign Up that is supposed to load content in the form of a Modal from another file. Initially, when I click the button for the first time, everything works smoothly without any errors or warnings. However ...
Python code containing selenium syntax is correctly written, however, when attempting to execute it in visual studio code, the entire script gets underlined in red. The exact cause of this issue remains a mystery. Presented below is the specific portion ...
Displayed below is a visual representation of the bootstrap step navigation component. Presently, there is an unseen 'next' button located at the bottom of the page. When this 'next' button is pressed, it transitions from 'step-1 ...
Hello everyone! I am a newbie in the community and relatively new to the world of web programming. I am encountering an issue that is really frustrating me. I attempted to use this code to add a class when hovering over the ul list element so that I can d ...
I currently have the following CSS styling for my links: DIV#tt { background: #fff; color: #333; margin: 0 0 15px; position: relative; padding: 1px; } DIV#tt A, DIV#tt SPAN.link { color: #990000; } These styles work well and chang ...
Hi there, I'm struggling with the CSS code below: .parent { position : 'absolute'; top : '50px'; left : '50px'; width : '400px'; height : '160px'; padding : '10px'; ...
I am facing an issue with the dynamic css file in my WordPress theme that is loaded using Ajax. The problem is that it also loads this dynamic css file for the backend. Can someone help me modify my code so that it only loads the dynamic css file for the f ...
I'm creating a platform for video content and I want to enhance the VideoJS player by incorporating icons from the Ionic set. However, as I typically use the <ion-icon/> tag to insert icons on my pages, I had to individually specify each icon&ap ...
Having recently started using Django, I encountered an issue with loading CSS files. This is the directory structure in my Windows system: Scenario 1: . |__myproject |__+myproject |__+myapp |__-static | |__-css | ...
Is it possible to implement a drop-down input field like the one shown below on my website using JavaScript? I want it to display when a specific link, image, or button is clicked without disrupting the overall flow of the page. ...
I'm encountering an issue with selecting a specific element from multiple forms in my JavaScript code: The current JavaScript function I am working with is as follows: function makeActive(target) { $("div.interactive").removeClass("interactive") ...
Hey there, I’m looking to dynamically pass a value from "codeDrink" to my controller using "asp-route-id" and Ajax in my ASP.NET MVC project. This is how I am handling it in my view: <p> <a id="deleteLink" asp-action="Delete& ...
Is there a way for my search form to display %20 in the URL when I fill the input field with spaces? For example: Basketball coach Current output: basketball%20coach Desired output: basketball-coach <form action="/tag/" id="form-hockey_v1" name=" ...
Imagine a situation where there is a string variable in the code behind that holds HTML content like this: Dim htmlString As String = "<h3>hello</h3><p>some paragraph</p><table><tr><td>some table content</td> ...
I created a compact plugin to show a cookie message. While testing it on my local machine, everything functioned smoothly without affecting any web pages. However, once I transferred the files to the server, I encountered issues such as: A background ima ...
Imagine there are two different snippets of HTML code as examples: <p>This is some text: <b>ABCD12345</b></p> <p><b>Name:</b> John Doe</p> I have the ability to separate the <b> and non-<b> sec ...
I'm currently working on developing a basic single page application to monitor people's movements. While I've made good progress, I've encountered an issue with the click function in the child elements of each person div. When I try to ...
Is there a method to confirm if the grid has finished loading using a separate function? My goal is to automatically click on the first row and move that row to the second grid once this action occurs. jQuery("#search_grid").jqGrid('setGridParam&apo ...
My current project involves the following tasks: - When the window's width is less than 700px and a user clicks on the gray bar at the bottom, a red menu should slide up and remain visible. - If the window's width exceeds 700px, clicking on the ...