diff --git a/c3.js b/c3.js index ea6dd2f..a5cb65a 100644 --- a/c3.js +++ b/c3.js @@ -1205,6 +1205,7 @@ // point - point of each data point_show: true, point_r: 2.5, + point_sensitivity: 10, point_focus_expand_enabled: true, point_focus_expand_r: undefined, point_select_r: undefined, @@ -1935,7 +1936,7 @@ return $$.findClosest(candidates, pos); }; c3_chart_internal_fn.findClosest = function (values, pos) { - var $$ = this, minDist = 100, closest; + var $$ = this, minDist = $$.config.point_sensitivity, closest; // find mouseovering bar values.filter(function (v) { return v && $$.isBarType(v.id); }).forEach(function (v) { @@ -1962,7 +1963,7 @@ yIndex = config.axis_rotated ? 0 : 1, y = $$.circleY(data, data.index), x = $$.x(data.x); - return Math.pow(x - pos[xIndex], 2) + Math.pow(y - pos[yIndex], 2); + return Math.sqrt(Math.pow(x - pos[xIndex], 2) + Math.pow(y - pos[yIndex], 2)); }; c3_chart_internal_fn.convertValuesToStep = function (values) { var converted = [].concat(values), i; @@ -2579,7 +2580,7 @@ $$.showXGridFocus(selectedData); // Show cursor as pointer if point is close to mouse position - if ($$.isBarType(closest.id) || $$.dist(closest, mouse) < 100) { + if ($$.isBarType(closest.id) || $$.dist(closest, mouse) < config.point_sensitivity) { $$.svg.select('.' + CLASS.eventRect).style('cursor', 'pointer'); if (!$$.mouseover) { config.data_onmouseover.call($$.api, closest); @@ -2590,16 +2591,13 @@ .on('click', function () { var targetsToShow = $$.filterTargetsToShow($$.data.targets); var mouse, closest; - if ($$.hasArcType(targetsToShow)) { return; } mouse = d3.mouse(this); closest = $$.findClosestFromTargets(targetsToShow, mouse); - if (! closest) { return; } - // select if selection enabled - if ($$.isBarType(closest.id) || $$.dist(closest, mouse) < 100) { + if ($$.isBarType(closest.id) || $$.dist(closest, mouse) < config.point_sensitivity) { $$.main.selectAll('.' + CLASS.shapes + $$.getTargetSelectorSuffix(closest.id)).selectAll('.' + CLASS.shape + '-' + closest.index).each(function () { if (config.data_selection_grouped || $$.isWithinShape(this, closest)) { $$.toggleShape(this, closest, closest.index); diff --git a/src/config.js b/src/config.js index 781134c..efa0dbb 100644 --- a/src/config.js +++ b/src/config.js @@ -151,6 +151,7 @@ c3_chart_internal_fn.getDefaultConfig = function () { // point - point of each data point_show: true, point_r: 2.5, + point_sensitivity: 10, point_focus_expand_enabled: true, point_focus_expand_r: undefined, point_select_r: undefined, diff --git a/src/data.js b/src/data.js index b29bd63..b0c3cbc 100644 --- a/src/data.js +++ b/src/data.js @@ -305,7 +305,7 @@ c3_chart_internal_fn.findClosestFromTargets = function (targets, pos) { return $$.findClosest(candidates, pos); }; c3_chart_internal_fn.findClosest = function (values, pos) { - var $$ = this, minDist = 100, closest; + var $$ = this, minDist = $$.config.point_sensitivity, closest; // find mouseovering bar values.filter(function (v) { return v && $$.isBarType(v.id); }).forEach(function (v) { @@ -332,7 +332,7 @@ c3_chart_internal_fn.dist = function (data, pos) { yIndex = config.axis_rotated ? 0 : 1, y = $$.circleY(data, data.index), x = $$.x(data.x); - return Math.pow(x - pos[xIndex], 2) + Math.pow(y - pos[yIndex], 2); + return Math.sqrt(Math.pow(x - pos[xIndex], 2) + Math.pow(y - pos[yIndex], 2)); }; c3_chart_internal_fn.convertValuesToStep = function (values) { var converted = [].concat(values), i; diff --git a/src/interaction.js b/src/interaction.js index d7d4c41..c6203d9 100644 --- a/src/interaction.js +++ b/src/interaction.js @@ -288,7 +288,7 @@ c3_chart_internal_fn.generateEventRectsForMultipleXs = function (eventRectEnter) $$.showXGridFocus(selectedData); // Show cursor as pointer if point is close to mouse position - if ($$.isBarType(closest.id) || $$.dist(closest, mouse) < 100) { + if ($$.isBarType(closest.id) || $$.dist(closest, mouse) < config.point_sensitivity) { $$.svg.select('.' + CLASS.eventRect).style('cursor', 'pointer'); if (!$$.mouseover) { config.data_onmouseover.call($$.api, closest); @@ -299,16 +299,13 @@ c3_chart_internal_fn.generateEventRectsForMultipleXs = function (eventRectEnter) .on('click', function () { var targetsToShow = $$.filterTargetsToShow($$.data.targets); var mouse, closest; - if ($$.hasArcType(targetsToShow)) { return; } mouse = d3.mouse(this); closest = $$.findClosestFromTargets(targetsToShow, mouse); - if (! closest) { return; } - // select if selection enabled - if ($$.isBarType(closest.id) || $$.dist(closest, mouse) < 100) { + if ($$.isBarType(closest.id) || $$.dist(closest, mouse) < config.point_sensitivity) { $$.main.selectAll('.' + CLASS.shapes + $$.getTargetSelectorSuffix(closest.id)).selectAll('.' + CLASS.shape + '-' + closest.index).each(function () { if (config.data_selection_grouped || $$.isWithinShape(this, closest)) { $$.toggleShape(this, closest, closest.index);