Untitled

      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" },