Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
240
IgrDataChart.SyncChannel doesn’t work
posted

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>

                });

  • 31480
    Offline posted

    Hello MMLab,

    I apologize for the delay in a response on this matter.

    I am also seeing a behavior in that the IgrDataChart is ignoring the synchronization settings if placed within the HTML code in the “render()” method of the tsx file. What I have found is that if you set this programmatically though, everything is working normally. I am unsure why this is, and I will be logging a development issue for this behavior so our development teams can look into it.

    That said, you can use the attached React component as a guide to set up the synchronization channels in the chart, which sets the synchronization-related properties programmatically.

    I hope this helps you. Please let me know if you have any other questions or concerns on this matter.

    SyncCharts.zip