Create a search box for my KMLlayer(s) - javascript

I'm using Google Maps API v3 and am displaying a basic map with about 250 place markers from a KMZ file. I'd like to add a search box to the page that allows users to search for a specific item in the KML. I'm pretty sure this is possible, but am not sure about the best way to get started... any help pointing me in the right direction would be much appreciated.
Thanks.

As I understand, a KMZ file is a zipped file containing the .KML file and other related files. Reading the KML and extracting values from it is trivial using jquery and you can get information about how to do it here.
http://think2loud.com/224-reading-xml-with-jquery/
I've not done unzipping a file in javascript, but you can check out this StackOverflow question if you want to do everything on the client side.
Unzipping files
Alternately, you can unzip the KMZ file on the server, and let the client code get the KML file using an AJAX get (as shown in the first link).
Hope this helps.

Related

Working with PSD on psd.js library

I have a requirement from a client to show images from a PSD(photoshop) file which have multiple layers, on each layer there will be an image, I did some research about it but haven't got any leads, so far I come up with a JS library named psd.js, but I think that is only for parsing and converting to image format(not sure haven't found much documentation on internet). please suggest me if there is any open source library for reading and editing PSD files. (javascript or asp.net preferred)
here is my snippet I have tried so far but haven't got any success, please let me know if there is any way to work with PSDs
thanks.
PSD.fromURL("images/example.psd")
.then(function(psd) {
psd.tree()._children[3]._children[0].visble = false;
document.getElementById('ImageContainer')
.appendChild(psd.image.toPng());
console.log(psd.tree().export());
});
I did something similar for a project of mine, for that you can use imagemagick they even have a command line tool that can make the process very easy. It will let you extract the images from each layer. You can also use psd.js to get information about the each layer positioning and other information.
Hope this helps.

read text file and save the content in an array using JavaScript

I've searched a lot about this topic, but couldn't find solution. I have a *.txt file containing coordinates (each line has one coordinate) in one column. So, I want to read this file from my file system and use those coordinates to visualize the tracking route on Google Maps API v3. I've already visualized the track for three coordinates and it works fine.
Can anybody just share a sample code of reading a *.txt file and fill an array with the file content? Maybe this is quite easy thing, but I am really stuck on this and would appreciate your help!
Thanks in advance!
You can't read a file using javascript. It's a client-side programming language. But some developpers have developped a solution.
Check this link and tell me if it was helpful for you: http://www.htmlgoodies.com/beyond/javascript/read-text-files-using-the-javascript-filereader.html#fbid=iTAoMveIKhq
I'm not going to share a sample code but you could read the answers to that similar question :
Javascript - read local text file
Basically loading the txt file with Ajax, and read the responseTextattribute of the response.
Although it would be easier to read a xml file or a json file, which would be easier to parse than a simple txt file.

Generating redistributable map images without a server

I want to make an app that allows users to download static images of maps and redistribute them in Anki flashcard decks. However, I'm having a tough time figuring out how to generate the map images without facing any licencing restrictions or running my own server. I want my app to be all client side JavaScript which rules out one of the solutions I've found so far. I've seen a way to use openlayers to export images from the canvas, however a proxy sever is required to convert the canvas to a dataURL so it can be saved.
The most promising option I've found so far is the MapQuest Open Static Maps API. However, I can't find much information about how open it really is. The OSM data is open, but I'm not sure about the images themselves, as they say copyright mapquest on them. Mapbox also has a static map API with licensing restrictions that are unclear to me.
I ended up using leaflet-image. leaflet-image can generate image dataURLs from leafletjs L.map objects using OSM tiles. It uses CORS to request the tiles and avoid tainting the canvas.
Thanks to #tyr for mentioning leaflet-image in his comment. The issues I mentioned in the comments have been resolved.
We developed a solution using TileMill to generate MBTiles files. We then developed a very simple PHP script, which opened the MBTiles (essentially a sqlite db) then saved the blobs for each image out to a file.

How to consume GTFS feed in Google Map v3 using Javascript?

I'm first time trying to use GTFS(General Transit Feed Specification) with Google Maps as per the Google developers page i have understood the concept of .txt files which are used as feed and for making a demo i downloaded a transit zip files from Google developers page. but I'm not getting how to use those transit files to show information on map. I tried to search tutorial for the same but could not find anything useful. Do i need to parse all those files to show in map or there is something different implementation.
I'm confused.
Please bear me with my lack of knowledge regarding GTFS.
If you want to display stops and routes on a map, you can use gtfs-to-geojson to convert GTFS to GeoJSON that can be loaded onto a Google Map or Mapbox.
Install gtfs-to-geojson:
npm install gtfs-to-geojson -g
Setup a config.json file, then run:
gtfs-to-geojson --configPath /path/to/your/config.json
The tool will output a folder of GeoJSON files.
As far as I know, GTFS is not yet "plug and play" ready - there's no simple way to just load up a GTFS dataset and work with it or query it on Google Maps, using either Google's web interface or their Javascript libraries.
Getting this working requires:
Setting up a (SQL) database and importing the GTFS dataset into that database.
Setting up a query system to get the information you want out of the SQL database (e.g., a web front-end that queries the database backend).
Feel free to look at some examples from around the web:
Broader GTFS discussion, and a link to a PostgreSQL + R solution from James Wong
MongoDB + node.js from Brendan Nee

Uploading html file generated from R-animation package to wordpress

I created a HTML file using the animation package in R. Now I'm trying to upload the resulting HTML file to a wordpress blog but don't really know how to make it work. It seems like I might need to upload some js or css files too but am not sure. Also, it seems like I might need to upload the original data files as the HTML file is 2.5kb and the original CSV file is 2500kb. Any suggestions would be appreciated.
I think I have addressed this issue in ?saveHTML if you are using the latest version of the animation package (the second paragraph in the Note section). Perhaps it is still not clear (I'll improve it in the next version), so let me explain it here:
What you need to upload are: the HTML file, the image folder, js and css. The CSV data is not required, since the animation is independent with the data now.

Categories