<commit_before>********************
Configuration images
********************

Any product that is built from the ground up goes through changes in appearence. Having this in mind, the Product Configurator offers a easy way to help the user visualize his product from start to finish.

Looking at the **Configuration Images** we notice 3 columns

1. **Name** column defines the name of our image.

2. **Image** column is where we upload our image.

3. **Configuration** column holds the configuration code that will trigger the display of the related image. This means that in our case when the user selects Color: Red, he gets the first line, when he selects Color: Red, and Rims: Double-spoke 18" he gets the fourth image.

.. note::
    The algorithm applied tries to match the closest configuration. First it gets the line that matches all the values specified with the configuration of the user. If two or more are found it is sorted by sequence.

|

.. image:: images/adding_image1.png
    :align: center
    :alt: alternate text


In our example this is necesary for creating diffrent appearances of the car when the user wants to select a diffrent pair of rims or another color. What the Product configurator does here is that it will switch betwen images in the interface. We use two separate images of the same car but in the second picture the rims are diffrent thus creating a shifting effect.

.. note::
    While this mechanism is fine for simple builds it is highly impractical for complex products with many images. An update is already in the roadmap to provide placement of static images on the canvas with different z-index instead of providing separate images. Also 3D models and animations are planned as well<commit_msg>[FIX] spelling and grammer in doc/functional/config_images<commit_after>********************
Configuration images
********************

Any product that is built from the ground up goes through changes in appearence. Having this in mind, the Product Configurator offers a easy way to help the user visualize his product from start to finish.

Looking at the **Configuration Images** we notice 3 columns

1. **Name** column defines the name of our image.

2. **Image** column is where we upload our image.

3. **Configuration** column holds the configuration code that will trigger the display of the related image. This means that in our case when the user selects Color: Red, he gets the first line, when he selects Color: Red, and Rims: Double-spoke 18" he gets the fourth image.

.. note::
    The algorithm applied tries to match the closest configuration. First it gets the line that matches all the values specified with the configuration of the user. If two or more are found it is sorted by sequence.

|

.. image:: images/adding_image1.png
    :align: center
    :alt: alternate text


In our example this is necessary for creating different appearances of the car when the user wants to select a different pair of rims or another color. What the Product configurator does here is that it will switch between images in the interface. We use two separate images of the same car but in the second picture the rims are different thus creating a shifting effect.

.. note::
    While this mechanism is fine for simple builds it is highly impractical for complex products with many images. An update is already in the roadmap to provide placement of static images on the canvas with different z-index instead of providing separate images. Also 3D models and animations are planned as well
{'fraction_non_alphanumeric': 0.06055461233729485, 'fraction_numerical': 0.004527447651386531, 'mean_word_length': 4.229289940828402, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5373521', 'n_tokens_mistral': 814, 'n_tokens_neox': 786, 'n_words': 556}