I have some routes in my code, and user can choose which one they wanna see on their map. For example, there are route X and route Y. Then user is seeing route Y and tap a button to see route X. Route Y is hidden and route X is shown.
Now here's my code to show route X (same for route Y, except different properties)
FeatureCollection featureCollection = BaseFeatureCollection.FromJson
("{\"type\":\"FeatureCollection\",\"features\":" +
"[{\"type\":\"Feature\",\"geometry\":{\"type\":\"LineString\"" +
",\"coordinates\":[" + stringCoordinates + "]},\"properties\":{}}]}");
GeoJsonSource geoJsonSource = new GeoJsonSource("route", featureCollection);
_mapboxMap.AddSource(geoJsonSource);
_lineLayerX = new LineLayer("linelayerred", "route");
_lineLayerX.SetProperties(
PropertyFactory.LineWidth(new Java.Lang.Float(8.0f)),
PropertyFactory.LinePattern("routex")
);
if (isShowRouteX) {
_mapboxMap.AddLayer(_lineLayerX);
}
Then when I wan't to hide and show another route
_mapboxMap.RemoveLayer(_lineLayerX);
_mapboxMap.AddLayer(_lineLayerY);
Code simplified, but basically that's all I do, and it does shows the route.
Now, the first time I add LineLayer, it would be shown immediately on map, I don't need to zoom in or out. But if new LineLayer added (after removing the old one), changes won't appear unless map is zoomed in or out, as if I have to do that to trigger redraw. Not even panning map to any direction would make new line appear. RemoveLayer executed flawlessly though.
I've even tried _mapView.Invalidate(), still doesn't work. What should I add so that user won't need to zoom in/out to see new LayerLine?
Also, I know that PropertyFactory has Visibility and it should/might work better for my problem, yet it doesn't work, especially Property.None. And not sure if it's still on topic in this questions, so I won't go further into it.
Finally found it, apparently I lacked this line
_mapboxMap.RemoveSource(geoJsonSource);
I put it on
_mapboxMap.RemoveLayer(_lineLayerX);
_mapboxMap.RemoveSource(geoJsonSource);
_mapboxMap.AddLayer(_lineLayerY);
and now the new line appears without the needs to zoom in or out.
Related
I'm trying to create a program that creates three buttons on the right side of the screen.
When I press a button, the entire background will change color (each button will make the background a different color). Whenever the mouse is not pressed, the background will return to white. I'm having trouble understanding how to make the three rectangles into buttons.
THIS MUST BE DONE WITHOUT A SPECIAL BUTTON METHOD/LIBRARY
You need to break your problem down into smaller pieces.
Can you create a program that just shows a single button? Don't even worry about making it interactive yet. Just show a single button at hard-coded coordinates.
Now can you detect when the user clicks in that button? Just print something to the console. Get that working perfectly before moving on.
Now can you get multiple buttons working together? Again, just print somethign to the console, and make sure it works perfectly before moving on.
Finally, can you make it so pressing each button changes the background instead of printing something to the console?
If you get stuck on a specific step, you can post a MCVE along with a specific technical question. Stack Overflow really isn't designed for general "how do I do this" type questions. It's for specific "I tried X, expected Y, but got Z instead" type questions. So please try something and post an MCVE of a specific step you're stuck on. Good luck.
Check processing's documentation for mouseClicked() and mousePressed.
The former being a method called upon a click, and the later is a boolean that is constantly updated. (So you'd check for it in your draw())
You'd then want to check the mouseX and mouseY values to see if they are in your desired button's area. (Which would be displayed on screen using rect())
I need to implement a behavior:
when element clicked - one thing happens
but when it's clicked and held for more than one second, something else happens (e.g element becomes draggable) and then the first event never fires
I think I know how to catch click&hold type of events, but how to distinguish between first and second?
Can you show me how to do that using this jsbin. I already made the "click, hold & drag" part, except that it is still firing the 'click' event after dragging the element and it shouldn't.
again: element clicked - one event, click and hold - element is draggable (even after mouse up) and when clicked again it's back to normal (undraggable) state.
I am not looking for a trivial solution, it has to be built using Rx.Observable or at least Bacon's streamEvent object
Thank you
I think you were pretty close with your solution, but probably it is not possible to elegantly achieve what you want while using the browser's built-in click event.
HERE is my attempt to tackle your problem.
The main idea is to define your own click streams like so:
var clicks = downs.flatMapLatest(function(){
return ups.takeUntil(Rx.Observable.timer(250));
});
var longDownsStart = downs.flatMapLatest(function(){
return Rx.Observable.timer(1000).takeUntil(ups);
});
In case of clicks we wait max 250 ms after a mouse down for a mouse-up; in case of the latter we generate the event only if there was no mouse-up within 1000 ms.
There might be some corner cases in which the code does not work as intended.
Here is my proposed solution (with Bacon.js).
I am currently making a game and need the score to get updated in while loop.
Every time the score gets updated in figure, it overwrites on top of previously written text making it blur.
The code goes something like this:
score=score+100
text(90,105,num2str(score));
h=text(80,105,'SUN');
set(h,'color','r');
You should keep the handle of the original text box, then update its 'String' property. Instead you keep creating a new text box on top of the old one.
Don't have access to matlab right now but I think something like this should work:
% first time you report score! create a text object; call it's handle "scoreBoard"
scoreBoard = text(x,y,num2str(score));
% something happens and we have new score:
set(scoreBoard, 'String', num2txt(score)); % update the string property of scoreBoard
Alternatively you could delete the old object and create a new one. I suspect the method I gave above is slightly more efficient though.
I'm starting to work with NVD3.js and I'm a little lost about the configurations possible with this tool.
I want to configure many items like:
Display x axis label for every bar, currently I have only the even ones displaying:
I want to configure a click function on the bars, which will redirect to a page passing the x axis as parameter, this link can be displayed on the label, but in this case I need to change it, to be able to click on it.
These are my doubts, can someone help me with the documentation link or with the answer to my questions?
-- EDIT --
Found how to display the label for every bar on x axis:
In the nv.d3.js edit the function nv.models.multiBarChart. In this line: reduceXTicks = true, set the value to false.
or
Just add this line to your nv.addGraph function:
chart.reduceXTicks('false');
Development of NVD3 appears to have moved to the nvd3-community fork which has documentation available.
Agreed with shabeer90. There is no documentation for NVD3 (wish there was).
D3.js documentation is of course largely in play...
Thanks for all replies, but I've done it by myself:
For displaying x axis label for every bar:
Add chart.reduceXTicks('false'); to your nv.addGraph() function, like this:
nv.addGraph(function () {
var chart = nv.models.multiBarChart();
chart.reduceXTicks(false);
return chart;
});
For adding an event to click on the bars, use this on your chart function:
d3.selectAll("rect.nv-bar").on("click", function (d) { // You can pass d to function to recover x ou y value of the bar
// Whatever you want to do on click
});
If someone has a better solution, please comment here.
While not the ideal solution, I find it easier to find out the available configuration options by using the link below and tinkering with the parameters on the right until I get the results I want. It's for an angularjs wrapper to nvd3, but the configuration is pretty much the same, only through JSON instead.
https://krispo.github.io/angular-nvd3/#/historicalBarChart
There is documentation for the API here. None of these tools are going to be useful until someone comes along with an abstraction that simply ingests JSON. Nobody wants to code a damn graph.
https://github.com/novus/nvd3/wiki/API-Documentation
I have a flash game where I have a picture designed to be the textbox for a prompt and textbox inside with the relevant text but the textbox is being hidden by the image. Anyone know how to make is so that the textbox is guaranteed to be on top or whatever I need to do to keep this from happening?
The other answer using setChildIndex will definitely work, however, I think a different design approach is really what you should be doing to remove the headache altogether.
For example in a game I might have different layers such as :
backgroundLayer
gameLayer
interfaceLayer
Those 3 Sprite layers would get added to the stage in that order. I would then add display objects to the appropriate layers. So anything I added to the backgroundLayer or gameLayer would ALWAYS be 'behind' my user interface on the interfaceLayer.
That allows you to not have to worry about the layering constantly. The answer with setChildIndex will fix the problem for that moment, but should something else be added to the container it will overlap your textbox, which is something I don't assume you want.
here's an example :
var backgroundLayer:Sprite = new Sprite;
var gameLayer:Sprite = new Sprite;
var interfaceLayer:Sprite = new Sprite;
addChild(backgroundLayer);
addChild(gameLayer);
addChild(interfaceLayer);
now, whatever you add to interfaceLayer, will ALWAYS be on top of objects you add to gameLayer or backgroundLayer.
So in the case of your text box, just add it to your interfaceLayer and any other objects you want behind it, you add to the gameLayer or backgroundLayer.
The order of adding display objects to display object containers effect their z-order, in other words the front to back order. The last added display object becomes the frontmost. So the child index of the children of a display object container is important for drawing of overlapped children.
If you put picture and text on the same DisplayObjectContainer such as a MovieClip:
Lets say your DisplayObjectContainer is mc.
And your textbox is txt
Please try this:
mc.setChildIndex(txt, mc.numChildren-1);