[Geomoose-users] Geomoose 3 onclick action
Reynolds, Michael J. (MNIT)
mike.reynolds at state.mn.us
Thu Dec 13 09:41:58 PST 2018
This seemed to work… though I'm wondering why I couldn't get it to work until I passed in_point to geojson_point. Is there a simpler point format allowed?
/** projects incoming point coordinates and projection to target
* projection and passes to zoomTo function.
* @param in_point - point coordinate array [x, y]
* @param projection - string 'EPSG:####'
* @param zoom - integer zoom level
* @returns zooms to coordinate location and zoom level
*
* Search Template usage example
* <a onClick="projectZoomTo([{{ geometry.coordinates.0 }},{{ geometry.coordinates.1 }}], 'EPSG:3857',16)" class="zoomto-link">
* <i class="fa fa-search"></i>
* {{ properties.equipmentname|blank> }}
* </a>
*/
function projectZoomTo(in_point, projection, zoom) {
geojson_point = [{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": in_point
}
}]
var new_point = gm3.util.projectFeatures(geojson_point, projection, 'EPSG:4326')[0];
return app.zoomTo(new_point.geometry.coordinates[0],new_point.geometry.coordinates[1], zoom);
};
From: Jim Klassen [mailto:klassen.js at gmail.com]
Sent: Wednesday, November 28, 2018 11:55 AM
To: Reynolds, Michael J. (MNIT) <mike.reynolds at state.mn.us>
Cc: GeoMOOSE Users List <geomoose-users at lists.osgeo.org>
Subject: Re: [Geomoose-users] Geomoose 3 onclick action
It looks like app.zoomToExtent() takes an extent and projection and app.zoomTo() takes a point (in lat/lon), and zoom level, but no projection. This seems like it might be a bit on an oversight, but in the meantime gm3.util.projectFeatures() is available from services. Paring that with app.zoomTo(point, zoom_level) looks like it would work.
You could do this in the template directly or add a helper function in your app.js.
Say something like (untested):
function myZoomTo(in_point, projection, zoom) {
var point = gm3.util.projectFeatures([point], projection, 'EPSG:4326')[0];
return app.zoomTo(point, zoom);
}
then call it from the template as:
myZoomTo({geometry.coordinates: [x, y]}, 'EPSG:26915', 16);
I'm not sure that using the global space for myZoomTo is best practice, but just an idea to get started.
I am also remembering something now about the search templates being able to reproject points, but it looks like that is using properties.boundedBy and app.zoomToExtent, so that might not apply.
On 11/28/2018 11:18 AM, Reynolds, Michael J. (MNIT) wrote:
The onClick would be in a search template used for rendering search results. Once rendered and displayed to the user, the user could click the <a> and the onClick would execute the function to zoom to the location.
<div class="search-result">
<div class="search-label">
{{ properties.name }} </div>
<div class="search-action">
<div style="padding: 2px">
<a onclick='app.zoomToCoordinates([{{ geometry.coordinates.0 }},{{ geometry.coordinates.1 }}], 26915, 16)' class="zoomto-link">
<i class="fa fa-search"></i>
Zoom!
</a>
</div>
</div>
</div>
From: James Klassen [mailto:klassen.js at gmail.com]
Sent: Wednesday, November 28, 2018 10:44 AM
To: Reynolds, Michael J. (MNIT) <mike.reynolds at state.mn.us><mailto:mike.reynolds at state.mn.us>
Cc: GeoMOOSE Users List <geomoose-users at lists.osgeo.org><mailto:geomoose-users at lists.osgeo.org>
Subject: Re: [Geomoose-users] Geomoose 3 onclick action
I'm lost. Where is the onClick coming from (DOM element, general description, ...)?
I know you can create a service that asks the user to click a point on the map and returns the coordinate, etc. You can call the app.* from the HTML returned by the service rendering template (and maybe even earlier) without worrying about react/dispatch/etc.
I am working on a jump to USNG coordinate service in a branch on my fork (klassenjs/gm3) that does both of the above.
On Tue, Nov 27, 2018, 06:39 Reynolds, Michael J. (MNIT) <mike.reynolds at state.mn.us<mailto:mike.reynolds at state.mn.us> wrote:
We're trying to create an onClick() event that passes coordinates, srid, and zoom level in and moves the map to that location.
It seems like the onClick event would need to create an action loaded with the parameters, register and then dispatch or run it, so would that be a function we create in our app's app.js?
Plus we would then need to create the zoom action which we would like to transform the coordinates from in-srid to web Mercator and then move the map. Are Proj and mapActions available to actions at runtime?
onClick => app.zoomToCoordinates() => dispatch ZoomToCoordinates action to transform coordinates and move map.
There's a gm3 zoomTo() function now but it expects lat,lon. We're not currently modifying any of the core geomoose 3 code and hoping to be able to add this modification to our app's part of the code.
Open to any ideas, even scrapping this procedure with a shorter one if there's a way to control the map without dispatching an action but that would mean the js function somehow needs access to the app Proj library and map object. Right?
Michael Reynolds
_______________________________________________
Geomoose-users mailing list
Geomoose-users at lists.osgeo.org<mailto:Geomoose-users at lists.osgeo.org>
https://lists.osgeo.org/mailman/listinfo/geomoose-users
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.osgeo.org/pipermail/geomoose-users/attachments/20181213/426a499f/attachment-0001.html>
More information about the Geomoose-users
mailing list