AMcharts XY chart custom zoom-in button - zooming

I've been searching for a way to zoom my XY chart to desired coordinates without having user to select chart area. I know XY chart has zoomOut() function but is there a way to zoom in too? Would like to add a zoom-in button with my chart.

You can use valueAxis zoomToValues to zoom based on the values.
chart.addListener("rendered", function (e) {
var valueAxes = e.chart.valueAxes;
valueAxes[0].zoomToValues(-8, 15);
valueAxes[1].zoomToValues(-8, 8);
});
Please see this example

Related

Is It possible to move the avatar programmatically or specify position in Autodesk.AEC.Minimap3DExtension

Autodesk.AEC.Minimap3DExtension provides a 3d and 2d sync forge viewer where a user can use 2d viewer and move the avatar to navigate. In order to navigate user has to move the avatar or a dot icon in 2d viewer to navigate in 3d model.
My question is where is there any possibility where I can send the set of coordinates which are with me and can I move the avatar programmatically so that user don't have to do so.
here is any example why I am asking so,
I have a geometry on my forge viewer which is on 2D and I am looking to make a first person view over that geometry.
So If I have all the points of geometry I want to make it use with Autodesk.AEC.Minimap3DExtension so that I can move first person to different views
here is the sample I am rereferring to link
I had been following this wonderful blog link
with the help of this I am aware little bit aware how to work with 2dto3d
here in above link
const worldPos = sheetToWorld(intersection.intersectPoint, viewer2D.model,
viewer3D.model);
the above line of code gives me worldPos with which a geometric point is
created in the 3d viewer in spite of creating a geometry how can I use to
show view of that particular place
basically in this below line of code which transits camera from one position to another
viewer.navigation.setRequestTransition(true, newPos, newTarget,
viewer.navigation.getHorizontalFov());
I'm glad you like the blog post :)
After reading the question I have the impression that you have already answered it yourself. If you have some kind of a geometry, let's say a polyline, overlaid on top of the 2D drawing, you can use the same logic explained in the blog post, but when calling viewer.hitTest, instead of passing in some mouse coordinates, you would just supply one of the points of your polyline.
Instead of:
viewer2D.container.addEventListener('click', function (ev) {
const intersection = viewer2D.hitTest(ev.clientX, ev.clientY);
viewer3D.isolate([]);
if (intersection) {
viewer3D.isolate(intersection.dbId);
const worldPos = sheetToWorld(intersection.intersectPoint, viewer2D.model, viewer3D.model);
if (worldPos) {
let mesh = new THREE.Mesh(geometry, material);
mesh.position.set(worldPos.x, worldPos.y, worldPos.z);
viewer3D.overlays.addMesh(mesh, 'indicator-scene');
}
}
});
It could look something like this:
function moveCameraToPointOnSheet(x, y) {
const intersection = viewer2D.hitTest(x, y);
if (intersection) {
const worldPos = sheetToWorld(intersection.intersectPoint, viewer2D.model, viewer3D.model);
if (worldPos) {
const eyeVec = viewer3D.navigation.getEyeVector();
const newPos = worldPos;
const newTarget = newPos.clone().add(eyeVec);
const fov = viewer3D.navigation.getHorizontalFov();
viewer3D.navigation.setRequestTransition(true, newPos, newTarget, fov);
}
}
});

Highcharts not zooming series using option Highcharts.Series.prototype.drawPoints = function() { }

I am creating a graph where I want to show the markers of the series only when hovering. I already tried the solution as shown on this question (Highcharts markers on legend and hover ONLY), and it works perfectly to show the markers when I want to.
However, I have another graph in the same html page that needs to show the markers and when I applied the solution presented on that question on the graph that I want (first graph) and I zoom at the other graph (second graph) the series that are represented by dots does not zoom, they keep all the markers on the graph.
The option
Highcharts.Series.prototype.drawPoints = function() { };
is on line 37 of the jsfiddle https://jsfiddle.net/erifel/sx3dcmny/
You should be able to use marker.enabled: false and series.states.hover.lineWidthPlus: 0 for achieving your chart without reseting drawPoints function. This will give you a possibility to redraw your markers when zooming on you chart.
If you want to show hidden markers in your legend, you can wrap renderItem function in your Legend prototype:
H.wrap(H.Legend.prototype,'renderItem',function(proceed,item){
var enabled = item.options.marker.enabled;
item.options.marker.enabled = true;
proceed.apply(this, Array.prototype.slice.call(arguments, 1));
item.options.marker.enabled = enabled;
});
Here you can see an example how it can work: https://jsfiddle.net/sx3dcmny/12/

Change Drupal Gmap marker z-index

I have a Drupal ExtendedGmap View. View results show as markers on the map. Marker type is determined by a custom field (NOT a field on the content type, but rather a PHP field calculated from the View) so the first view result marker is set to 'orange' and all other row markers are set to 'green'. The problem I have is that I want my first (orange) marker to show above the others. I have found a way to change the first marker z-index value in THEME_preprocess_gmap_views_view_gmapextended function:
$vars['markers'][0]['opts']['zindex'] = '9999';
But this is not reflected on the map and the first marker is still buried (in fact the first marker ends up somewhere in the middle of the stack).
How do I get my first View row marker on top?
I tried the Javascript mentioned on this page but don't really understand it and it doesn't work for me.
Drupal.gmap.addHandler('gmap',
function (elem)
{
var obj = this;
obj.bind('preparemarker',
function (marker)
{
marker.opts.zIndexProcess =
function (marker,b)
{
return this.zindex ? this.zindex : -99999;
};
}
);
});
I am using Drupal 7 and Gmap 7.x-2.9
Found the problem. Googlemaps API V3 uses zIndex (capital 'I') instead of zindex. Changed that and works as expected - markers stack correctly.
Example code:
$vars['markers'][0]['opts']['zIndex'] = '9999';

highcharts panning

I'm trying to implement highcharts panning based on this example:
http://jsfiddle.net/HXUmK/5/
But I want to be able to zoom with the left mouse button and pan with the right mouse button. So I modified the code above and managed to make it work a little, but when I pan holding the right mouse button, the charts also zoomes.
Is there a way I can disable right mouse button zooming in highcharts?
Edit: Sorry for not being very clear about it. The code in the jsfiddle is not my code. Forget that code, it's just an example form witch I started. I am trying to modify that code in order to get left button zoom and right button pan. So I disabled the mousewheel zoom and activated the standars highcharts zoom
Edit2: Here is my code: http://jsfiddle.net/TKPQN/
You can try with selection event:
chart: {
...
events:{
selection: function(event) {
if (lastButton == 1)
event.preventDefault();
}
}
}
See http://jsfiddle.net/TKPQN/48/
I've wanted to use the Shift key for zooming, so this is my solution
$('#container').highcharts('StockChart', {
chart: {
//zoomType: 'x', // we declare it without zoom, so the pan is enabled
// ...
}});
var chart = $('#container').highcharts();
chart.pointer.cmd = chart.pointer.onContainerMouseDown;
chart.pointer.onContainerMouseDown = function (a){
//in my case, I need only X zooming, so I enable it if shift is pressed
this.zoomX=this.zoomHor=this.hasZoom=a.shiftKey;
this.cmd(a);
};
seems to work ok, so hope it help you
here is a JSFiddle working example: http://jsfiddle.net/73bc23zq/

Google Maps: How can I change the z-index of a Marker?

There are about 100 markers on a google map plus there is one special marker that needs to be visible. Currently, the markers around it hide it totally or partially when the map is zoomed out. I need that marker to be fully visible and I think keeping it on top of all other markers should do the trick. But I cannot find a way to modify its stacking order (z-index).
This is for Google Maps API 2.
For Google Maps API 3 use the setZIndex(zIndex:number) of the marker.
See:
http://code.google.com/apis/maps/documentation/javascript/reference.html#Marker
Use the zIndexProcess option in GMarkerOptions when you create the marker that you want on top. For example:
var pt = new GLatLng(42.2659, -83.74861);
var marker = new GMarker(pt, {zIndexProcess: function() { return 9999; }});
map.addOverlay(marker);
I believe the default is to have a z-index that is the latitude of the point of the marker, so this should be fairly safe at bringing a single marker to the front. Further, this was just a simple example; you can set the z-index of all your markers in whatever simple or complex way you want. Another example is to have two functions: one for special markers and one for the rest.
var pt1 = new GLatLng(42.2659, -83.74861);
var pt2 = new GLatLng(42.3000, -83.74000);
var marker1 = new GMarker(pt1, {zIndexProcess: specialMarker});
var marker2 = new GMarker(pt2, {zIndexProcess: normalMarker});
map.addOverlay(marker1);
map.addOverlay(marker2);
function specialMarker() {
return 9999;
}
function normalMarker() {
return Math.floor(Math.random()*1000);
}
Adding on to jhanifen's answer, if you want to get your one special marker to be on top of all the rest, set it's zIndex to google.maps.Marker.MAX_ZINDEX + 1. This will make sure that it is on top of any marker on the map.