bug with mouse release event for brush in d3 graph - javascript

I am trying to use
d3.js Multiple Area Chart for representing a collection of data. The graph building part was completed successfully. I've created a brush for timeline dragging and the bug is that, I guess, the mousedown event is not recognised by the brush. When I click on the context area (brush), I don't have to drag and release the mouse to select an area. After clicking the selection of area goes to left and right automatically depending on the direction my mouse moves. Is that some kind of bug or due to some changes that I made in the code?

Related

In Cesium, how can I auto trigger click event without mouse click?

I want to make a query function for 3d tile. When i search a tile, the tile's contour will highlight (like 3D Tiles Feature Picking Demo). In Cesium demo, they pick a tile feature by mouse click event, but i don't want to pick a tile feature by mouse click. I want to give pick function a value (for example: viewer.scene.pick(Cesium.Cartesian2(309,306));), then i can get that tile.
In Cesium, how can I auto trigger click event without mouse click when I want to pick a 3d tile feature ? If no, how should I do?

Openlayers middle mouse button panning

I'm pretty new to Openlayers and I have a problem with map panning using middle mouse button. Basically, I want to use the middle mouse button only for map panning, so that when other tools are selected/used (as identify feature tool) the middle mouse won't be used for selecting (only left mouse button).
Any suggestion?

How to use drag behavior from d3js with leapjs

I am trying to control a parallel-coordinates-chart (parcoords.js from D3js framework) with my leap motion controller.
So at the parcoords.js file is a drag function which uses the standard d3js drag behavior, which supports touch and mouse, described here: https://github.com/mbostock/d3/wiki/Drag-Behavior#wiki-drag
But I try to realize a grad-gesture by the leap motion to drag the axis around individually. Solving this I need to map the leap-coordinates to control the mouse via javascript. Another solution might be to call the reorder-able function, when a grab is detected by my javascript. But I do not know how to use the leap-finger coordinates to work with d3js drag behavior.
I hope anyone have an idea to solve this Problem.
A demo of the d3js parallel coordinates can be found here: http://3developers.de/parcoords/
There is also a red square to show you leap finger position.
Yours Lucas
The main problem is that you would need to define what a "drag gesture" is. Here are some options:
Any finger ("pointable") movement. So as soon as the controller detects a finger, the dragging starts and is defined by the movement of the finger. The drag stops when the finger leaves the area where it can be detected by the controller.
A gesture starts the drag. This could be for example a "tapping screen" gesture. The drag then follows the movement of the respective finger and stops when the gesture is repeated.
You can further restrict when dragging starts by requiring the finger to be immediately above the respective element.
In any case, D3 doesn't offer direct support for leap motions, so you would have to manually trigger the events for dragstart, drag and dragend.

Detecting mouse events on drag in EaselJS across shapes

I have a chessboard like UI, wherein when I drag across check squares I need to EaselJS to detect my shapes(different squares) .I have hooked up those shapes with onMouseMove event handler. However I see that which ever shape gets clicked on mouse down that same shapes keeps emitting the onmousemove event even though I have moved outside the surface area of that shape and onto another shape. How can I have events that listen when I move out of the shape and into another shape using drag/touch or mouse drag?
The mousemove events come from the shape you clicked on, so the target will always be that initial clicked shape.
To determine what is currently under the mouse, use the getObjectUnderPoint or getObjectsUnderPoint APIs.
http://www.createjs.com/Docs/EaselJS/classes/Container.html#method_getObjectsUnderPoint

Is Slider possible in sencha charts?

As my requirements is to show the slider in the line charts using sencha touch. Is it possible to show the slider in line charts?
In ExtJs examples, slider is there for Area charts and they used the slider in track mouse within interactions.But am developing application for mobiles, so for mobile we cannot have track mouse option.
I am referring to the example Area - Browser Stats, bundled with touch charts 1.0.0. In our mobile application, the requirement in line chart is that, when user tap and drags on line, it should display/update respective marker values on a slider kind of control, which moves on top of line chart along with user's finger.
How can i keep track of line chart marker values, when user moves/drags his finger on a line (in line chart)?
Is it possible to display a vertical line on x-axis (parallel to y-axis), which moves along with user's finger and displays respective marker value on top of that vertical line?
Latest sencha touch 2.1 comes with chart support. In that within your chart object specify this config
{
type: 'iteminfo',
listeners: [
{
fn: function(me, item, panel) { //item.record.get('X') will get you the axes value
panel.setHtml('Text you want to display');
},
event: 'show'
}
]}
Hope it helps... Although it wont drag as you require you can display the value when user taps on a marker...

Categories

Resources