Question

对于我们的项目，我们使用Highchart插件。我已经创建了一个创建不同图表的功能。不同图表的设置几乎相同。设置中存在一些小差异：

function createBarDiagram(div,title,xtitle,ytitle,first,second,type){

    // Internationalization
    Highcharts.setOptions({lang: {drillUpText: '◁ Terug naar {series.name}'}});

    if(type == 'pie'){
        var options1 = {                        
            tooltip: {pointFormat: 'Percentage: <b>{point.percentage:.1f}%</b><br>'},       
            xAxis: {categories: true}
        };
    }

    if(type == 'column'){
        var options1 = {
            xAxis: {
                categories: true,
                labels : { rotation: -90}
            }
        };  
    }

    // algemene instellingen
    var options = {
        yAxis: {title: {text: 'Aantal'}},
        chart: {height: 300},
        title: {text: ''},
        drilldown: {series: second},
        legend: {enabled: false},
        credits: {enabled: false},
        plotOptions: {
            series: {
                dataLabels: {enabled: true},
                shadow: false,
                cursor: 'pointer',
                point: {
                    events: {
                        click: function() {getDetailData(this);}
                    }
                }               
            },
            pie: {size: '100%'}
        },
        series: [{
            name: 'overzicht',
            colorByPoint: true,
            data: first
        }]  
    };  


    // Column charts
    options.chart.renderTo = div;
    options.chart.type = type;
    var chart = new Highcharts.Chart(options);
    return chart;
}

正如您所看到的，图表是根据选项var加载的。但是我想将options1 var添加到图表中，以获得每个图表的微小差异。所以我需要：

var options = options + options1;

有没有办法合并这两个？谢谢！

Answer 1

从我得到的，你需要合并到对象，选项和选项1; +运算符将简单地合并它们的字符串表示。检查此answer有关如何合并两个javascript对象的信息。我更喜欢jQuery扩展方法，因为我一直使用jQuery。

--- ----溶液

options = jQuery.extend(options, options1);

Answer 2

我建议你传递一个包含参数的对象，而不是将位置参数传递给你的函数。

示例：

function createBarDiagram(params){
...
if (params.type == "...") {...}
...
}

并使用

调用您的函数

params1 = {
  div: "...",
  title: "...",
  xtitle: "...", ...
}
createBarDiagram(params1)

要解决选项问题，您应该启动一个空对象

var options1 = {}

然后您可以使用

逐步初始化它

options1.xAxis = {...}

最后，在选项

中使用它

options = {...
   xAxis = options1.xAxis
}

希望这会有所帮助。最好的问候。

将设置添加到javascript plug-gin

2 个答案: