2

I am able to visualize my D3 chart within a Salesforce LWC component, but now what I want to do is when I click on a selected node within the D3 code, I want to pass the selected node data to a Salesforce variable that I can then pass to my child component which is a modal. The code below shows where I am currently writing the name to another div within the same page, but this doesn't help me when I'm trying to reference the data from a Salesforce variable.

                if (d.data.isProduct) {
                    thisNode.append("rect")
                        .attr("y", -barHeight / 2)
                        .attr("height", barHeight)
                        .attr("width", barWidth)
                        .style("fill", color)
                        .attr("class", "product " + d.data.modalName) // Add the select products modalName as a class to be used as a router to say what type of product fields to display
                        .on("click", function (d) {

                            // Only Run Logic when a Product is selected
                            if (d3.select(this).classed("product")) {

                                //var thisProductNode = d3.select(this);

                                // Only add product to the 'Selected Product' list if it was not already selected
                                if (!selectedProducts.includes(d.data.name)) {
                                    selectedProducts.push(d.data.name); // Add selected product to list of selected products to be added to the product catalog
                                    console.log('selected Products in Update: ' + JSON.stringify(selectedProducts, null, 2));
                                    selectedProductsDisplay.append('ul').append('li').text(d.data.name);
                                }


                                // Toggle the slds-hide class of the modal depending on current value
                                // - shoppingCartModal is defined at the top of the initializeD3 function
                                shoppingCartModal.classed('slds-hide', shoppingCartModal.classed('slds-hide') ? false : true);


                            }
                      });
                }

Stephen
  • 175
  • 5

0 Answers0