[Geomoose-users] Geomoose 3 onclick action
Jim Klassen
klassen.js at gmail.com
Fri Dec 14 07:14:50 PST 2018
Short of Little saying otherwise, I'm pretty sure GeoMoose 3 is using GeoJSON as it's internal representation of features, so my guess is GeoJSON is the simplest point format.
On 12/13/2018 11:41 AM, Reynolds, Michael J. (MNIT) wrote:
>
> 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/20181214/91c4ac3c/attachment.html>
More information about the Geomoose-users
mailing list