angular2-google-chart
angular2-google-chart copied to clipboard
How to add click event in geochart?
Using Angular 4.3.1 I can show province map of Netherlands using:
public map_ChartData = [
['Provinces', 'Popularity'],
[{ v: 'NL-DR', f: 'Drenthe' }, 5],
[{ v: 'NL-NH', f: 'Noord-Holland' }, 1000],
[{ v: 'NL-UT', f: 'Utrecht' }, 800],
[{ v: 'NL-FL', f: 'Flevoland' }, 200],
[{ v: 'NL-FR', f: 'Friesland' }, 350],
[{ v: 'NL-GE', f: 'Gelderland' }, 450],
[{ v: 'NL-GR', f: 'Groningen' }, 788],
[{ v: 'NL-LI', f: 'Limburg' }, 244],
[{ v: 'NL-NB', f: 'Noord-Brabant' }, 750],
[{ v: 'NL-OV', f: 'Overijssel' }, 620],
[{ v: 'NL-ZE', f: 'Zeeland' }, 50],
[{ v: 'NL-ZH', f: 'Zuid-Holland' }, 890]
];
public map_ChartOptions = {
region: 'NL', resolution: 'provinces',
enableRegionInteractivity: true,
colorAxis: {
minValue: 0,
maxValue: 1000,
colors: ['grey', 'yellow', 'orange', 'blue', 'green']
}};
itemSelected(evt) {
console.log(evt);
}
<div id="map_chart"
(itemSelect)="itemSelected($event)"
(itemDeselect)="itemDeselected($event)"
[chartData]="map_ChartData"
[chartOptions]="map_ChartOptions"
chartType="GeoChart"
GoogleChart></div>
When I click on a province I get an error in Chrome console:
core.es5.js:1020 ERROR Error: Invalid column index null. Should be an integer in the range [0-1].
at gvjs_en (jsapi_compiled_default_module.js:75)
at gvjs_P.gvjs_.getValue (jsapi_compiled_default_module.js:89)
at angular2-google-chart.directive.ts:52
at gvjs_Zn.<anonymous> (jsapi_compiled_default_module.js:179)
at gvjs__n (jsapi_compiled_default_module.js:129)
at gvjs_Zn.gvjs_.dispatchEvent (jsapi_compiled_default_module.js:127)
at gvjs_U (jsapi_compiled_default_module.js:178)
at jsapi_compiled_default_module.js:252
at gvjs_Zn.<anonymous> (jsapi_compiled_default_module.js:179)
at gvjs__n (jsapi_compiled_default_module.js:129)
I guess this is a bug. I had the same issue.
Need to understand how does the selected item chooses column. Seems like it has to be supplied, but where. The author of the library has not included it in the examples.
@vimalavinisha any thoughts on this?