How to calculate difference between woocommerce product variations?

Question

WordPress

I have quantity and color attributes.
If an attribute is selected ( 3 positions ), then it is cheaper than choosing 3 products by attribute ( 1 position). And I want to calculate the difference using the formula (3 positions) - 3*(1 position). How can I do this, please tell me.

Answer 1

Take a look at the source code of your product card and you will see that the form contains a data attribute with all the data about your variations in json format.
Accordingly, all your data is available in js. Then it remains only to write a script, the core itself also pulls data when switching variations from there

Answer 2

(3 positions) - 3*(1 position)
3 - 3 * 1 = 0
...
But seriously, in the product you indicate the value + in accordance with the attributes.
For example: 3 color option (white) and attribute (eg granite) then price = your price.
This is how a variable product is configured.

Answer 3

share my solution

<!-- add economy value -->
  <script type="text/javascript">
    <?php
    $variations_array = [];
    if($product->is_type('variable')){

        foreach($product->get_available_variations() as $variation ){
        $single_array = [];

        // add attributes
          foreach( $variation['attributes'] as $key => $value ){
          $taxonomy = str_replace('attribute_', '', $key );
          $term_name = get_term_by( 'slug', $value, $taxonomy )->slug;

          $attr = [$key => $term_name];

          $single_array += $attr;
          }
          
          // add price
          $price = ['price' => $variation['display_price']];
          $single_array += $price;
            
          array_push($variations_array, $single_array);
        }
    }
    // var_dump($variations_array);
    $js_array = json_encode($variations_array);

    echo "var variations = ". $js_array . ";\n";
    ?>

    jQuery(function( $ ) {
      $(document).ready(function() {
        $('.woocommerce-variation').after(function() {
          return '<h3 class="save"></h3>';
        });
        // $('.single_variation_wrap').after('<p class="save"></p>');
        $('.variations select').change(function() {
          let attr = new Object();
          $('.variations select').each(function() {
            let name = $(this).attr('name');
            let value = $(this).val();
            attr[name] = value;
          });
          
          if (attr.attribute_pa_color != '' && attr.attribute_pa_size != '') {

            let onePrice = variations.find(variation => variation.attribute_pa_color == attr.attribute_pa_color && variation.attribute_pa_size == '1-kiste')['price'];
            let currentPrice = variations.find(variation => variation.attribute_pa_color == attr.attribute_pa_color && variation.attribute_pa_size == attr.attribute_pa_size)['price'];
            let currentSize = variations.find(variation => variation.attribute_pa_color == attr.attribute_pa_color && variation.attribute_pa_size == attr.attribute_pa_size).attribute_pa_size;


            if (onePrice != currentPrice) {
              let currentSizeNum = parseInt(currentSize.match(/\d+/));
              
              $('.single_variation_wrap .save').html('Sparen: ' + Math.round((onePrice * currentSizeNum - currentPrice) * 100) / 100 + '€');

              $('.single_variation_wrap .quantity').addClass('hidden');
            } else {
              $('.single_variation_wrap .save').html('');

              $('.single_variation_wrap .quantity').removeClass('hidden');
            }
          }
        });
      });
    });
  </script>