Issues modifying HSL properties for materials with textures

Customization
1

Hi Shapespark community,

I’m working on a project where I need to dynamically modify the HSL properties of materials using a JavaScript script. I’m leveraging the Shapespark API to access baseColor and its getHSL and setHSL methods.

The issue I’m encountering is that HSL changes are reflected correctly on materials with solid colors, but they do not appear to work for materials with textures assigned to baseColorTexture. My goal is to modify the HSL values for both solid color materials and textured materials.

Here’s what I’ve done so far:

  1. I retrieve the material via the onNodeTypeClicked event and access its baseColor.
  2. I modify the HSL values using the setHSL method.
  3. I call viewer.requestFrame() to force a render update.

The HSL values seem to update correctly based on the logs, but the changes are not visually reflected in materials with textures. However, in the Shapespark editor, it is possible to adjust HSL values for textures, which suggests this functionality should be achievable.

I noticed that there doesn’t seem to be any equivalent getHSL or setHSL for baseColorTexture. This leads me to wonder:

  1. Is there an additional step required to apply HSL changes to materials with textures?
  2. Is it possible to dynamically overwrite texture properties using only HSL adjustments, or is there a different approach I should consider?

I would greatly appreciate any guidance or examples on how to address this issue.

Thank you in advance for your help!

Best regards.
Angel Castro

2

Unfortunately, adjusting the texture correction is not part of the viewer API.

If you are OK with using our internal interface, which may be changed and stop working in the future, try the following:

material.setTextureMapHslAdjustment('baseColorTexture', 'h', <YOUR-H>);
material.setTextureMapHslAdjustment('baseColorTexture', 's', <YOUR-S>);
material.setTextureMapHslAdjustment('baseColorTexture', 'l', <YOUR-L>);
material.setTextureMapCorrectionTurnedOn('baseColorTexture', true);  // needed only once
1 Like
3

Hi Wojtek:

Thank you so much for the explanation and the workaround! It worked perfectly, and I was able to dynamically adjust the HSL properties of textured materials as needed. This functionality is a great addition to my project.

I understand that these methods belong to an internal interface and may not be stable in the long term. However, it would be amazing if similar capabilities could be incorporated into the official Shapespark API in the future. Being able to manage HSL adjustments for both solid and textured materials directly through the API would greatly enhance its flexibility.

Thanks again for your support and for providing such a powerful platform for customization!

Best regards.