Questions about charts, labels and JS

Topic: Questions about charts, labels and JS

diworm asked 8 years ago

Hello there! Have some questions about charts: 1. How can I add labels to my chart from data variable? I see it like this:

2. How can I add clickable legend to my chart to show/hide graphs? Like here: http://www.highcharts.com/demo/line-basic Maybee devs have some plans to add native features about this? I will be very grateful for any information.

Add comment

Marta Szymanska staff pro premium answered 8 years ago

0 0 Best answer

Hi, 1. For the first issue, please send me files with your code to m.szymanska@mdbootstrap.com and I will check how to add these labels. If you want to check it by yourself you can always look at the documentation of chart.js http://www.chartjs.org/docs/, because on MDB we use chart.js for creating charts. 2. If you don't find this feature clickable legend in chart.js documentation http://www.chartjs.org/docs/, we will try to create such a feature. Best, Marta

Add comment

diworm answered 8 years ago

0 0 Best answer

Hello there! I stop tests with chartsjs and switched to highcharts (it's more simplest and responsive for me). But I test with charts, example code:

    //Statistics chart
    $(function () {
        var data = {
            labels: [<?=$data['timeline'];?>],
            datasets: [
                <?=$data['dataset'];?>
            ]
        };
        var option = {
            responsive: true,
            title: {
                display: true,
                text: 'Custom Chart Title'
            },
            legend: {
                display: true,
                position: 'top',
                labels: {
                    fontColor: 'rgb(255, 99, 132)'
                }
            }
        };
        // Get the context of the canvas element we want to select
        var ctx = document.getElementById("statistics").getContext('2d');
        var myLineChart = new Chart(ctx).Line(data, option); //'Line' defines type of the chart.

    });

But no legend and no chart title for me with this code. Docs for legend: http://www.chartjs.org/docs/#chart-configuration-legend-configuration thinking out loud: Maybee I need to add labels in option.legend, but my logic down here, coz I add labels in 'dataset' and if I do this with another chart type all hints work normaly....

Add comment

Marta Szymanska staff pro premium answered 8 years ago

0 0 Best answer

Hi, yes, highcharts are awesome but we can't use them as a part of MDB, so I didn't delve into highcharts code. And I will repeat myself: if you want I check something in your code and help you with these labels, please send me files with your code to m.szymanska@mdbootstrap.com and I will check how to add these labels. Best, Marta

Add comment

Write

Create snippet

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Specification of the issue

User: Free
Premium support: No
Technology: General Bootstrap questions
MDB Version: -
Device: -
Browser: -
OS: -
Provided sample code: No
Provided link: No

diworm

2Support score
6Questions 6Answers

0Snippets likes 0Snippets