How can I create a similar map without using Flash?
map example here
I have a map of the U.S. with each state colored based on annual data (heat map). For instance, obesity rates from 2000 to 2010 (each year would have different values for each state). I would like the user to scrub with the slider to update the map for each year similar to the example above.
I'm very new to Javascript so I'm wondering if there's a library that could help. I'm aware of raphael.js but haven't seen any examples of this particular behavior. Thanks for any pointers.
Yes you can use the OpenLayers API to create similar heat map without using Flash. OpenLayers API is based on javascript and pretty simple to use. First, you need to look into the basics:
http://openlayers.org/
OpenLayers HeatMap Examples:
http://maps.seai.ie/wind/
http://dev.openlayers.org/sandbox/camptocamp/canvas/openlayers/examples/heatMap.html
http://sloweb.org.uk/ollie/heatmap/
Related
So, basic gist is, I have my own tiles of not the real world I'd like to display with the Google Maps viewer. I've found examples of how to split an existing single image into tiles for use with it, but nothing that deals with setting up your own tiler.
I have map data such as this:
https://dl.dropboxusercontent.com/u/44766482/superimage/index.html
Which right now is just a bunch of 1600x1600 images in an html table. This naive method works, but I'd like to switch to the more robust google api for better zooming and smarter streaming of the image data.
I've been unable to find a good example of how to generate your own tiles for the zoom levels and bring it together with some html/js.
If you want some more information for the goal process;
I have a python script that can output any size tiles of the map, at any zoom level. I'd like to bundle those together into a google maps api website. But in my own efforts I have not found a good example or documentation of how to do that. For one, I can only find examples of how the zoom levels work for the real world map, but not for a custom one.
Edit:
Got most things working as I want them, but I'm still confused regarding the "center" that can be set, as it's in lat and lng, which don't apply. I'd also like to set boundaries as currently it tries to load .png files outside of the maps range.
My current progress:
https://dl.dropboxusercontent.com/u/44766482/googlemapspreview/index.html
I think what you are looking for is the google maps imageMapTypes:
https://developers.google.com/maps/documentation/javascript/maptypes#ImageMapTypes
Basically, each zoom level is the 4 lower zoom tiles combined. A Projection function can be skipped to get orthogonal mapping.
The following link provided is something that I am after for a web mapping project.
http://developers.arcgis.com/javascript/samples/fl_dgrid/
The following link contains the utilisation of ESRI base layer map, and what seems to be a layer polygon possibly created in Arcmap, which allows users to select individual states, which when selected displays in a table.
I am trying to achieve the similar user interaction but just for Australia; for example, users will be able to select Western Australia, Northern territory est, which would then show which state the user selected in a table and generate data/information.
So far from my understanding, it seems as though ArcGIS for server could have been used in order to save the feature polygon layer, which is then called as a service from the coding and generated onto the base layer map of ESRI.
I am wondering if anyone can help me in terms of how to get this user interaction working just for a map of Australia. Would I create the polygon layer in arcmap, make that as a service using ArcGIS for server and then call it from coding?
Also, for the actual selection of each state and showing in a table, my understanding is javascript is used?
I guess I am just trying to get a more thorough understanding so I can go on from there, in order to create something similar just for Australia. Any help will be much appreciated.
Thanks in advanced.
There are probably a few different ways to go about getting this to work depending on what data you have available to you. My answer is based off what I see in the example you posted.
Assuming you had the polygons for Australia available to you, you should be able to modify the example and have a working version pretty easily.
Grid
For the grid, it looks like they are using the dgrid plugin which unfortunately I have no experience with so you would need to look up info on that.
Map
If you are wanting to have a polygon shown for each state/territory then you would need to have a service with all the polygon objects available to you. Not sure if this is already available or if you would need to create each polygon somehow.
When the map loads you would want to load all the polygons. When a user clicks on a state you would want to create a query to select the given polygon so that it is highlighted (they are using the OBJECTID field in the example which would be unique to each polygon). When selecting the polygon in the map you would also select the row in the grid(This is also done by the ID aka OBJECTID field from the polygon).
I'm using ChartJS to include some maps in my website but the ChartJS library doesn't have the map I want.
I want to know if this type of vector maps is something easy to find free online or do you have to build from scratch?
ChartJS website isn't clear about that.
Thanks for your time!
From what I've noticed in vectormap-data/world.js file map data is an array of objects and each object has a coordinates field. It looks like each object corresponds to some country.
You may try to change those coordinates and see how this affects the map. Maybe, that will allow you to create you own map data.
Good luck!
I wanted to ask you about the way to make spatial interpolation in google maps API. This means- I have values for some points inside an area and want to recalculate values for every point in this area (and create an raster overlay).
In "offline" GIS softwares, there are more methods to do this. For example Kriging (http://en.wikipedia.org/wiki/Kriging).
Thanks for answer
There is no real practical way to do such a thing. Spatial Interpolation is something you really need a full-blown GIS to accomplish. It requires storing, analyzing, and presenting data in way that ArcGis or QGis is best suited for. There is some new feature in ArcGis Online that works with Google Maps API but I don't know much about it and am unsure if it would be any help for you but a link is here.
I know, its not something geostatiscically correct, but I have made this:
- I have created a net of rectangle polygons.
- I have connected all my points to polygon they lie and have made mean value for polygons with at least one point
- I have checked every polygon without points and at least 2 neighbourly polygons with points, and have made mean from this neighbourly values
- I have checked again all my polygons with values and at least 2 neighbourly polygons with values and smoothed origin values according to the neighbours´ values.
Is there a way to incrementally draw a line in the Google Earth Plug-in using the JavaScript API?
If that's not possible, is there a round about method to achieve the same effect?
What I want to achieve is similar to this: http://www.wolfpil.de/v3/animated-poly_v3.html
Yes this is entirely possible, and to be fair it would be trivial to convert the code in the example to use the earth, rather than maps, api. All you would need to do is to find any references to maps objects and simply use the equivalent earth api objects. The math and timing is all done for you...
If you wanted to convert it take a look at the following links, they should give you everything you need to know.
Information on Geometries and Overlays
https://developers.google.com/earth/documentation/geometries
Example of Drawing line strings
http://earth-api-samples.googlecode.com/svn/trunk/examples/linestring.html
Example of Smooth Animation with frameend
http://earth-api-samples.googlecode.com/svn/trunk/examples/event-frameend.html
Finally, you could also just add the earth plugin to the maps implementation, take a look at the following example of Maps/Earth Integration. This would just mean adding the a few lines of code to the example you posted allowing the 'earth' mode to be activated from the maps api. If set up correctly things like polylines are available across the map/earth displays.
Earth Maps integration
http://earth-api-samples.googlecode.com/svn/trunk/examples/maps-integration.html
Beefy integration example
http://earth-api-samples.googlecode.com/svn/trunk/demos/mapsapi/beefy.html