if (option.id === 'UpperRed') {
attrsUpdate[selector + ' .option-port .port-body'] = { port: option.id, dynamic: true, fill: '#FFFFFF', stroke: '#000000' };
attrsUpdate[selector + ' .option-port .port-label'] = { port: option.id, dynamic: true, fill: '#000000' };
}
else if (option.id === 'UpperYellow') {
attrsUpdate[selector + ' .option-port .port-body'] = { port: option.id, dynamic: true, fill: '#F0C600' };
attrsUpdate[selector + ' .option-port .port-label'] = { port: option.id, dynamic: true, fill: '#000000' };
}
else if (option.id === 'UpperBlue' || option.id === 'Lower Low') {
attrsUpdate[selector + ' .option-port .port-body'] = { port: option.id, dynamic: true, fill: '#C7E9FF' };
attrsUpdate[selector + ' .option-port .port-label'] = { port: option.id, dynamic: true, fill: '#000000' };
}
else if (option.id === 'Normal') {
attrsUpdate[selector + ' .option-port .port-body'] = { port: option.id, dynamic: true, fill: '#FFFFFF', stroke: '#000000' };
attrsUpdate[selector + ' .option-port .port-label'] = { port: option.id, dynamic: true, fill: '#000000' };
}
else if (option.id === 'LowerBlue') {
attrsUpdate[selector + ' .option-port .port-body'] = { port: option.id, dynamic: true, fill: '#C7E9FF' };
attrsUpdate[selector + ' .option-port .port-label'] = { port: option.id, dynamic: true, fill: '#000000' };
}
else if (option.id === 'LowerYellow') {
attrsUpdate[selector + ' .option-port .port-body'] = { port: option.id, dynamic: true, fill: '#F0C600' };
attrsUpdate[selector + ' .option-port .port-label'] = { port: option.id, dynamic: true, fill: '#000000' };
}
else if (option.id === 'LowerRed') {
attrsUpdate[selector + ' .option-port .port-body'] = { port: option.id, dynamic: true, fill: '#D30821' };
}
{ id: "UpperRed", text: "Upper red zone" },
{ id: "UpperYellow", text: "Upper yellow zone" },
{ id: "UpperBlue", text: "Upper blue zone" },
{ id: "Normal", text: "Normal" },
{ id: "LowerBlue", text: "Lower blue zone" },
{ id: "LowerYellow", text: "Lower yellow zone" },
{ id: "LowerRed", text: "Lower red zone" },