Question

数据可视化将数据变为现实。

这里一个简单的线图转换成美丽的东西：
http://www.pewresearch.org/data-trend/media-and-technology/device-ownership/

Pew Research如何制作此图表？是否有可以学习某种API或插件的技术？有哪些选择或地方可以开始？

Answer 1

该图表是使用highcharts构建的。它是一个易于使用的API，用于基于jQuery的图表。但是，如果你真的想制作出色的图表，我建议你学习d3 api。

查看源代码行413

jQuery(document).ready(function($) {
var markerOptions = {
    enabled: true,
    states: {
        hover: {
            enabled: true
        }
    }
}

var options = {
    chart: {
        inverted: false,
        type: 'line',
        zoomType: 'x'
    },
    subtitle: {
        text: 'Percent of American adults 18+ who own each device'
    },
    xAxis: {
        title: {
            text: ''
        },
        type: 'datetime'
    },
    yAxis: {
        title: { 
            text: ''
        }
    },
    plotOptions: {
        line: {
            marker: markerOptions
        },
        area: {
            marker: markerOptions
        }
    }
}

Highcharts.visualize($('table').eq(0), options);
});

Answer 2

决定使用哪种解决方案通常取决于图表中所需的灵活性。我建议使用FLOT，因为在提供大量图形选项的同时，它易于学习。这应该可以帮助您开始使用http://www.flotcharts.org/

祝你好运！

创建类似于Pew Research网站的图表

2 个答案: