Question

例如，我需要定义一个这样的选项：

option = {
    series: [{
        name:'Others',
        type: 'line',
        data: [23.9627, 26.4315, 29.917, 27.5934, 26.8672],
        symbol: 'none',
        itemStyle: {
            normal: {
                color: 'rgb(165,165,165)'
            }
        },
        lineStyle: {
            normal: {
                width: 5,
            }
        }
    }, {
        name:'Apple',
        type: 'line',
        data: [18.1535, 18.5892, 13.9419, 22.9461, 23.9627],
        symbol: 'none',
        itemStyle: {
            normal: {
                color: 'rgb(165,165,165)'
            }
        },
        lineStyle: {
            normal: {
                width: 5,
            }
        }
    },{
        name:'HTC',
        type: 'line',
        data: [8.7137, 10.4564, 10.166, 6.2448, 4.6473],
        symbol: 'none',
        itemStyle: {
            normal: {
                color: 'rgb(165,165,165)'
            }
        },
        lineStyle: {
            normal: {
                width: 5,
            }
        }
    }]
};

问题在于

symbol: 'none',
        itemStyle: {
            normal: {
                color: 'rgb(165,165,165)'
            }
        },
        lineStyle: {
            normal: {
                width: 5,
            }
        }

对于所有系列都是相同的并且重复3次。

我想知道是否可以将其解压缩出来，并制作类似的东西？

defaullt_line_option ={
    symbol: 'none',
    itemStyle: {
        normal: {
            color: 'rgb(165,165,165)'
        }
    },
    lineStyle: {
        normal: {
            width: 5,
        }
    }
};

option = {
    series: [{
        name:'Others',
        type: 'line',
        data: [23.9627, 26.4315, 29.917, 27.5934, 26.8672],
        default_line_style,
    }, {
        name:'Apple',
        type: 'line',
        data: [18.1535, 18.5892, 13.9419, 22.9461, 23.9627],
        default_line_style,
    },{
        name:'HTC',
        type: 'line',
        data: [8.7137, 10.4564, 10.166, 6.2448, 4.6473],
        default_line_style
    }]
};

更新

如果我只想与2个系列分享，而不是所有系列分享怎么办？我该怎么办？

Answer 1

是的，你可以这样做：

var default_line_option = {
    symbol: 'none',
    itemStyle: {
        normal: {
            color: 'rgb(165,165,165)'
        }
    },
    lineStyle: {
        normal: {
            width: 5,
        }
    }
};

var option = {
    series: [{
        name:'Others',
        type: 'line',
        data: [23.9627, 26.4315, 29.917, 27.5934, 26.8672],
        use_default_line_option: true
    }, {
        name:'Apple',
        type: 'line',
        data: [18.1535, 18.5892, 13.9419, 22.9461, 23.9627],
        use_default_line_option: true
    },{
        name:'HTC',
        type: 'line',
        data: [8.7137, 10.4564, 10.166, 6.2448, 4.6473],
        use_default_line_option: false
    }]
};

option.series = option.series.map(function(el) {
  // Add default options if needed
  if (el.use_default_line_option) {
    for (var attr in default_line_option) { el[attr] = default_line_option[attr]; }
  }
  // Remove use_default_line_option attributes
  delete el.use_default_line_option;
  return el;
});

JSFIDDLE

编辑：

使用map函数获取“一行”解决方案
use_default_line_option布尔值使用默认选项

Answer 2

您创建非冗余JSON，然后在其上应用一点逻辑来实现您想要的效果。

＆＃13;

defaullt_line_option ={
    symbol: 'none',
    itemStyle: {
        normal: {
            color: 'rgb(165,165,165)'
        }
    },
    lineStyle: {
        normal: {
            width: 5,
        }
    }
};

option = {
    series: [{
        name:'Others',
        type: 'line',
        data: [23.9627, 26.4315, 29.917, 27.5934, 26.8672],
        apply:true
    }, {
        name:'Apple',
        type: 'line',
        data: [18.1535, 18.5892, 13.9419, 22.9461, 23.9627],
        apply:true
    },{
        name:'HTC',
        type: 'line',
        data: [8.7137, 10.4564, 10.166, 6.2448, 4.6473]
    }]
};



option.series = option.series.map(function(el){
    var apply = el.hasOwnProperty("apply") && el.apply;
    delete el.apply;
    if(!apply)
       return el;

    for (var attrname in defaullt_line_option) { el[attrname] = defaullt_line_option[attrname]; }
    
   return el;
});

console.log(option);

＆＃13;

<强>更新

我现在有一个apply键，如果它存在且为真，则只会应用默认值，否则它们不会。不要忘记之后正确删除它。

Answer 3

是的，您可以添加标准选项：

var standardOptions = {
    symbol: 'none',
    itemStyle: {
        normal: {
            color: 'rgb(165,165,165)'
        }
    },
    lineStyle: {
        normal: {
            width: 5,
            }
    }
};

然后只需用简单的循环添加它们：

option.series.forEach(function(entry) {
    for (var name in standardOptions) {
        entry[name] = standardOptions[name];
    }
});

请注意，这意味着lineStyle和itemStyle个对象将由各种series条目共享。

如何重用部分数据结构？

3 个答案: