Help to choose a chart or data chart

Question

Help to choose a chart or data chart

Navigation

#1 by (1 votes)
#2 by (0 votes)

1

I would like you to advise me based on your experience to represent data through graphs or charts, what happens is that I have a database in sql server, it contains more than 30,000 records, when making certain queries, this can give me as a result, 10,000 or more records. The problem arises when I have to represent this data in a graph, I have used chart js, but at the moment of showing the graphics it gets very slow due to the amount of data, I have also used highcharts and it goes great, the problem is that it is not open source and my client does not have to pay the license, finally also try to use dygraphs, but it turns out that when the dates are the same, it only shows me one and not all the dates as it should be.

At this point, I do not know which option to use, that is open source and has the ability to represent a considerable amount of data, would help me a lot if they could advise me another library to carry out this process.

javascript php

asked by Sebastian Rodriguez 13.10.2018 в 01:22

source

2 answers

how do I get these if statement to work? WPF and C # pop-up windows

score 1 · Answer 1

You can try amCharts . It gives you many options to adjust the graphics to your needs. It is not open source, and it is a bit expensive, but they have a free version that includes a small link that says "JS chart by amCharts".

Here you can download it and here you can read more about your free license and determine if it applies to you.

Another option can be D3.js and its license .

score 0 · Answer 2

I recommend CHARTJS is an excellent library to get started in the graphics I leave an example here

var ctx = document.getElementById("myChart").getContext('2d');
var myChart = new Chart(ctx, {
    type: 'bar',
    data: {
        labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
        datasets: [{
            label: '# of Votes',
            data: [12, 19, 3, 5, 2, 3],
            backgroundColor: [
                'rgba(255, 99, 132, 0.2)',
                'rgba(54, 162, 235, 0.2)',
                'rgba(255, 206, 86, 0.2)',
                'rgba(75, 192, 192, 0.2)',
                'rgba(153, 102, 255, 0.2)',
                'rgba(255, 159, 64, 0.2)'
            ],
            borderColor: [
                'rgba(255,99,132,1)',
                'rgba(54, 162, 235, 1)',
                'rgba(255, 206, 86, 1)',
                'rgba(75, 192, 192, 1)',
                'rgba(153, 102, 255, 1)',
                'rgba(255, 159, 64, 1)'
            ],
            borderWidth: 1
        }]
    },
    options: {
        scales: {
            yAxes: [{
                ticks: {
                    beginAtZero:true
                }
            }]
        }
    }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.bundle.js"></script>
<canvas id="myChart" width="400" height="400"></canvas>

The link in the library is link