Ver: 18.2

I need to visualize two or more “IgrDataChart”  in sync mode. In order to accomplish it, I’m using the same “SyncChannel” property value with “SynchronizeVertically” and “SynchronizeHorizontally” set to “true”, but it seems that the charts are actually ignore it. Any ideas? Am I  forgetting to register any “module”?

As example:

Import section:

IgrLegendModule.register();

IgrLineSeriesModule.register();

IgrCrosshairLayerModule.register();

IgrCategoryChartModule.register();

IgrDataChartCategoryModule.register();

IgrDataChartInteractivityModule.register();

IgrDataChartAnnotationModule.register();

IgrSizeScaleModule.register();

IgrCategoryXAxisModule.register();

IgrNumericYAxisModule.register();

renderSection:

       return  anyFilledArray.map(p=>{

                    return <IgrDataChart                                          

                            key={anyStringValue}

                            width="100%"

                            height="200px"                       

                            windowRectMinWidth={0.02}

                            windowResponse= "immediate"

                            SyncChannel="channel1"

                            SynchronizeVertically={true}

                            SynchronizeHorizontally={true}

                            dataSource={this.state.dataMatrix }                       

                            defaultInteraction="DragPan"

                            dragModifier="Control"

                            panModifier="None"

                            isHorizontalZoomEnabled={true}

                            isVerticalZoomEnabled={true} >                                                 

                            <IgrCategoryXAxis name={"xAxis"}                           

                            label="anyStringValue" />    //                           

                            <IgrNumericYAxis name={"yAxis"}                                      

                                title={anyStringValue}

                                minimumValue={anyValue}

                                maximumValue={anyValue} />

                            <IgrLineSeries                        

                            name={"LineSeries" }                                                 

                            xAxisName={"xAxis"}       

                            yAxisName={"yAxis"}  

                            valueMemberPath={anyStringValue}

                            />

                            <IgrCrosshairLayer

                            name={"Crosshair"}

                            isAxisAnnotationEnabled={true}

                            transitionDuration={100}

                            useInterpolation={false}

                            thickness={0.5}                             

                            />

                            </IgrDataChart>

                });