<script lang="javascript" type="text/javascript">

        $(document).ready(function () {
            $('#jqChart').jqChart({
                crosshairs: {
                    enabled: true,
                    snapToDataPoints: true,
                    hLine: { visible: false },
                    vLine: { visible: true, strokeStyle: 'red' }
                },
                tooltips: {
                    type: 'shared'
                },
                series: [
                            {
                                type: 'candlestick',
                                lineWidth: 1,
                                pointWidth: 0.5,
                                priceUpFillStyle: 'blue',
                                priceDownFillStyle: 'red',
                                strokeStyle: 'black',
                                data: mydata
                            },
                ]
            });

            $('#jqChart2').jqChart({
                crosshairs: {
                    enabled: true,
                    snapToDataPoints: true,
                    hLine: { visible: false },
                    vLine: { visible: true, strokeStyle: 'red' }
                },
                tooltips: {
                    type: 'shared'
                },
                series: [{
                    type: 'spline',
                    markers: {
                        size: 2,
                        type: 'circle',
                        strokeStyle: 'black',
                        fillStyle: 'black',
                        lineWidth: 1
                    },
                    lineWidth: 0.5,
                    pointWidth: 0.25,
                    strokeStyle: 'red',
                    data: perD
                }
                ]
            });


            var isHighlighting = false;

            $('#jqChart').bind('dataHighlighting', function (event, data) {

                if (!data) {
                    $('#jqChart2').jqChart('highlightData', null);
                    return;
                }

                if (!isHighlighting) {

                    isHighlighting = true;

                    var index = $.inArray(data.dataItem, mydata);
                    $('#jqChart2').jqChart('highlightData', [perD[index]]);
                }

                isHighlighting = false;
            });

            $('#jqChart2').bind('dataHighlighting', function (event, data) {

                if (!data) {
                    $('#jqChart').jqChart('highlightData', null);
                    return;
                }

                if (!isHighlighting) {

                    isHighlighting = true;

                    var index = $.inArray(data.dataItem, perD);
                    $('#jqChart').jqChart('highlightData', [mydata[index]]);
                }

                isHighlighting = false;
            });
        });
    </script>
<div id="jqChart" style="width: 1800px; height: 800px;"></div>
<div id="jqChart2" style="width: 1800px; height: 800px;"></div>