Question

我尝试创建高图表application.i写了一些代码，我收到了hightchart like this

这是我的源代码

http://jsfiddle.net/gkatsarava/Zp3au/1/

这是我的代码

的一部分

$(function () {
 Highcharts.setOptions({
            colors: ['#05D3F8', '#D1E751', '#25E4BC', '#F3D915', '#FF7E00', '#FF0C96', '#F100F3']});

    $('#container').highcharts({

        chart: {
          backgroundColor: 'transparent'  
        },
        title: {
            text: ''
        },
        exporting: {
        enabled: false
        },

        xAxis: {
            categories: ['XXXX', 'XXXX', 'XXXX'],
            labels: {
            style: {
                fontSize:'10px'
            }
            }
        },
        yAxis: {
            title: {text: 'TEXT - TEXT'},
            plotLines:[{
            value : 80,
            color: 'red',
                  dashStyle: 'shortdash',
                  width: 2,
        }],
        },
        tooltip: {
            headerFormat: '<span style="font-size:13px;color:{series.color}">{series.name}</span><br>',
            pointFormat: "valuess: {point.y:.2f}%"

        },
        legend: {
                enabled: false,
         },
        labels: {

        },
        plotOptions: {
        column: {
            dataLabels: {
                enabled: true,
                useHTML: true,
                formatter: function() {

                }
            }
        },
        series: {
        }
    },
        series: [{
            type: 'column',
            name: 'XXXX',
            data: [10],
            id:'1'
        }, {
            type: 'column',
            name: 'XXXX',
            data: [40],
            id:'2'
        }, {
            type: 'column',
            name: 'XXXX',
            data: [80],
            id:'3'
        }]
    }, function (chart) {

  // bind events to your own custom legend
  $('#my-legend').on('click', 'div', function (e) {
    var el = e.target,
        id = el.getAttribute('data-id'),
        series = chart.get(id);

    series.setVisible(!series.visible);
  });
});
});

我有三个图表，我希望将所有图表单元化。如果有人有经验hightchart请帮助我。我不知道我是如何解决这个问题感谢

Answer 1

我不确定你的意思＆＃34; unit＆＃34;图表，但Highcharts文档充满了很好的例子。你想要this之类的东西吗？这很简单，你只需要在示例中构建你的系列。

编辑： Here是您数据的缩影。

$(function () {
    $('#container').highcharts({
        chart: {
            type: 'column'
        },
        title: {
            text: 'Example'
        },
        colors: ['#05D3F8', '#D1E751', '#25E4BC'],
        xAxis: {
            categories: ['X', 'Y', 'Z']
        },
        series: [{
            name: 'Blue',
            data: [10, 10, 10]

        }, {
            name: 'Yellow',
            data: [40, 40, 40]

        }, {
            name: 'Green',
            data: [80, 80, 80]

        }]
    });
});

Highchart更改设计和功能

1 个答案: