Link chart to chart question

Hi,

I’m trying to follow your example (spchart.com/demo/link-chart-to-chart) for linking a chart to another chart, but having some troubles making to work on my site.

The first chart is working well and triggering with the correct URL ID when clicking the series. The first also triggers loading of the second chart just fine.

The problem is that the second chart won’t change user and do not display correct data. No matter what series I click in the first chart the second shows the same ID and the data is the total, not for the series selected.

See attached pictures for more info, note that I have used the persons ID not the name for testing.

Code for the first chart, dashboard -> Adv

[code]var handlers = {};
handlers.preRender = function (config, logger) {
logger.debug('Configuration: ', config);

var filtrationApplied = false;

config.plotAreaClick = function (e) {
    if (!filtrationApplied) {
        window.location.hash = '';
    }

    filtrationApplied = false;
}

config.seriesClick = function (e) {
    window.location.hash = 'userId=' + e.dataItem.ProjectResponsibleId;
    filtrationApplied = true;
}

config.axisLabelClick = function (e) {
    if (e.axis.type === 'category') {
        window.location.hash = 'userId=' + e.dataItem.ProjectResponsibleId;
        filtrationApplied = true;
    }
}

return true;

}[/code]

Code for the second chart:

Data Source -> SharePoint List

<View> <Query> <OrderBy> <FieldRef Name="ID" /> </OrderBy> {Filter} </Query> <ViewFields> <FieldRef Name="LinkTitle" /> <FieldRef Name="ProjectResponsible" /> <FieldRef Name="Created" /> </ViewFields> <RowLimit Paged="TRUE">3000</RowLimit> <Aggregations Value="Off" /> </View>

Data Source -> Advanced

[code]handlers.requestInit = function (query, logger) {
var userId = 0;

var hash = location.hash.substr(1);
var idx = hash.indexOf('userId=');
if (idx !== -1) {
    userId = parseInt(hash.substr(idx)
                          .split('&')[0]
                          .split('=')[1]);

    if (isNaN(userId)) {
        userId = 0;
    }
}

var view = query.get_viewXml();
if (userId !== 0) {
    view = view.replace('{Filter}', '<Where>\



’ + userId + ’

');

    query.set_viewXml(view);
} else {
    query.set_viewXml(view.replace('{Filter}', ''));
}

return true;

}[/code]

Dashboard -> Advanced

[code]var handlers = {};
handlers.preRender = function (config, logger, processor, el) {
logger.debug('Configuration: ', config);

if (processor && !processor.subscribed) {
    $(window).bind('hashchange', function () {
        el.empty().html('<img alt="loading..." src="/_layouts/15/images/gears_anv4.gif" />');
        processor.process(el);
    });
    processor.subscribed = true;
}

if (location.hash.indexOf('userId=') !== -1) {
    config.title = 'Projects to ' + config.series[0].data[0].ProjectResponsible;
}

return true;

}[/code]

Hello Auxak!

The code looks correct, make sure that you’re using the correct internal names.