Skip to content

Conversation

@maidi29
Copy link
Contributor

@maidi29 maidi29 commented Jan 3, 2026

Description

This PR adds a new setColor method that allows applying color-only highlights while preserving original material properties such as opacity and transparency. The method provides a convenient way to change only the color of items without affecting other material properties.

Key changes:

  1. New setColor method - Added to FragmentsModel, VirtualFragmentsModel, HighlightManager, and HighlightHelper:

    • Applies color changes while preserving original material properties
    • Uses a new preserveOriginalMaterial flag in MaterialDefinition to indicate color-only operations
  2. Enhanced processHighlight in MaterialManager - Fixed to properly handle the preserveOriginalMaterial flag:

    • When enabled, preserves base material properties (opacity, transparency, depthTest) from the original material
    • Only updates the color and optionally renderedFaces while maintaining other properties
  3. Material deduplication fix - Updated VirtualMaterialController to prevent deduplication for materials with preserveOriginalMaterial flag, as they need to preserve original properties that may differ even with the same color

  4. Type definition - Added preserveOriginalMaterial?: boolean to MaterialDefinition type

Usage Example

The setColor method provides a simple API for applying color-only highlights while preserving material properties like opacity:


import * as THREE from "three";
import { FragmentsModel } from "@thatopen/fragments";

// Apply a red color to specific items (preserves their original opacity)
await model.setColor([1, 2, 3], new THREE.Color(1, 0, 0));

// Apply a green color to all items in the model
await model.setColor([5, 6, 7], new THREE.Color("#00ff00"));

Key benefit: Unlike using highlight() with a full material definition, setColor() automatically preserves the original material's opacity and transparency. This is especially useful when working with transparent materials that should maintain their transparency when highlighted.

Additional context

This feature is particularly useful for visualizations where you want to change the color of items (e.g., for highlighting or filtering) without losing transparency or other material properties. The setColor method provides a simpler API compared to using highlight with a full material definition when only the color needs to change. Otherwise it is not possible to add color to an item that has different material opacities (e.g. a window with frame and glass) while those opacities should be obtained.

Files changed:

  • fragments-model.ts - Added setColor method
  • highlight-manager.ts - Added setColor method
  • highlight-helper.ts - Added setColor implementation
  • virtual-fragments-model.ts - Added setColor method
  • material-manager.ts - Enhanced processHighlight to preserve original material properties
  • virtual-material-controller.ts - Prevented deduplication for materials with preserveOriginalMaterial
  • model-types.ts - Added preserveOriginalMaterial flag to MaterialDefinition

What is the purpose of this pull request?

  • Bug fix
  • New Feature
  • Documentation update
  • Other

Before submitting the PR, please make sure you do the following:

  • Check that there isn't already a PR that solves the problem the same way to avoid creating a duplicate.
  • Follow the Conventional Commits v1.0.0 standard for PR naming (e.g. feat(examples): add hello-world example).
  • Provide a description in this PR that addresses what the PR is solving, or reference the issue that it solves (e.g. fixes #123).
  • Ideally, include relevant tests that fail without this PR but pass with it.

@maidi29 maidi29 force-pushed the main branch 2 times, most recently from 4401f1f to ba56388 Compare January 14, 2026 13:31
@agviegas
Copy link
Contributor

agviegas commented Jan 16, 2026

Hey @maidi29 can you exclude the compiled worker from the PR to solve the conflict? Also:

  • Is there a method to reset the colors to the originals?
  • It would be possible to do a similar setOpacity method, right?
    Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants