Posting OpenLayers VectorTiles on GeoServer - javascript

I am slowly losing my head in this problem.
Context: I'm fairly new to webserver, javascript etc. so my knowledge is very limited.
It seems very simple: I want to draw Features on a Website using OpenLayers and safe them for later use on a GeoServer.
I've tried mainly posting GeoJSON using the official Importer Extension for the GeoServer, but I was stuck because it does not support GeoJSON, however GeoJSON seems to be the go to format according to OpenLayers Doc.
Most importantly I want to avoid using these huge Shapefiles, which are very unhandy and unreadable.
Now I'm getting a huge overhead, because it seems like there is a simple and basic solution everyone uses, but me.
If you need any code examples of what I've done feel free, but I feel like they are not neccesary for my question.
Maybe one last thing: I am developing a prototyp for my company so it would be even better if there is a solution where I can "capsule" the website from the backend using the GeoServer REST-API for example.
Thanks in advance.

Related

What's the best way to create a pdf document with charts and in a decent quality?

First of all, I want to apologize for my English, I know my grammar is not the best, I'm not a native speaker so sometimes I have a hard time finding the right words or trying to explain the things I have in mind. So if you have a problem understanding what I want, please let me know and I'll try to be clearer.
I'm making a web app, the backend is made in PHP.
I need to create some kind of pdf-report for the users with charts, tables, pictures, and I need it to be decent (Quality and Style)
I don't know if the best option is a javascript library, 'cause I've found some libraries, but these make not really good looking pdfs.
So I was looking for a javascript library, but nothing seems to fit my requeriments.
I'll give you some pictures in order for you to have a better idea about what I want:
Sales report: This was the closest I could find to what I want.
Another sales report Something like this
Invoice I need something that allows me to make a really good looking design for the document, similar to this invoice
I'm really getting tired of looking and found nothing... It's been almost 2 months now, maybe more.
So my first idea was to use a javascript library that could convert html to pdf, but I was so naive and I didn't know how hard it was to convert html to pdf and without messing with the structure of the elements (The visual organization)
I first tried jsPDF by MrRio, but it doesn't support css (Something that I really need) or the charts (If the charts are pictures, it works fine, but if they are generated with a library like chartJS or highcharts it won't work).
I tried with some similar plugins but all of them had similar problems
Here is the link for jsPDF and their git
Then I found jsreport, I did a really nice thing in their playground and it worked perfectly. The problem is it needs NodeJS and my Site is made in nodeJS, and I don't know if there is a way to use jsreport with php and if there is I'm not sure if it will work as nice as it did in their playground.
Something that I just tought about if there will be a way that use nodeJS only for this feature, I don't know it is not recommended or something, need to find more about this, idk what you guys think.
Jsreport can use multiple recipes like PhantomJS to generate the PDF
I've found other plugins but they are also for nodeJS only.
Here is jsreport site
Then I tried again jsPDF but this time using it along with html2canvas and it worked almost fine, but the quality decreases a lot and the text cannot be selected or copied. I managed to increase the quality a bit, but nothing further that.
I have other ideas, something related to the print option from the browsers, but haven't found anything good.
The other idea that I don't know if it possible, it's making some kind of document like a template and then somehow add the user data inside that template, to finally have a pdf but with the users data.
Read this, here is some related info.
So, the reason I want this feature it's because most of the clients that use my Web App, require this function. So I can't migrate my app to Node or Rails, because it will take a really long time, and I don't have that time right now, so I don't know what are my options. The solution doesn't need to be free, but if it is, it will be great, because I don't have a big budget for a really expensive plugin.
Thank you for reading my question, I really need help with this, so let me know everything you have in mind, every answer is appreciated even if I've already tried it, because maybe you can came up with a different solution using something that I have used already.
Prepare your Html page with Highcharts or whatever charts you want to get and then use this tool WkHtmltoPDF

Best API/code library to build a timeline/chart

I'm reaching out for some advice on the best API/code library to use to build an interactive timeline/chart. I have included an example image below. The idea would be that you have a key, and clickable elements along a path/line that pop up/out when interacted with.
I have a lot of experience with Google Maps API, but this is quite clearly something a little different. Would you suggest ChartJS? Or something else? Just trying to get some background/research.
Do let me know if posting this on SO was the wrong thing to do.
Take a look at D3J or Dojo. They are both JavaScript libraries for data-driven and data-centric front-end applications.

Calling Google Visualization API Server-Side

I'm working on a project that involves exporting some HTML reports on a website into PDF format. I'd like to use the excellent flying-saucer Java library to do this but my major stumbling block is that several of these reports use the Google Visualization API to generate charts with JavaScript. Flying-saucer doesn't currently support parsing/executing JS, so those charts don't show up in the generated PDF file.
I was hoping to work around this by seeing if there was some kind of web service I could call instead via server-side code that would return the chart image in Base64 as a variable that I could reference in my view instead of getting it via JS.
The old Google Image Charts API is exactly what I'm looking for, but it has unfortunately been deprecated and it looks like it's slated to be removed completely by next year, so it's not an option.
I'm hoping Google has a newer alternative. If not, is there some other method that's recommended? Thanks!
You can call the getImageURI method of the chart to generate an image/octet stream URI. You can send that data to your server, and you should be able to reconstruct the chart as a .png image file. I've never tried to do this server-side, so I'm not sure precisely how you would go about it, but this java tutorial might be of some assistance to you: http://www.programcreek.com/2009/02/java-convert-image-to-byte-array-convert-byte-array-to-image/
Years ago I wrote Eastwood Charts which implemented the Google Image Charts API as a servlet, backed by JFreeChart, so that you could generate charts without having to rely upon Google, or send your data to their servers. :-)
I don't maintain Eastwood Charts anymore (like Google, I can't be relied upon either) but it is open source and the code works so you might find it helpful. You could also modify it to meet your own requirements, which is something that wasn't possible with the Google service.

Clickable continent/country maps: which way to go?

There are many Web sites that include clickable maps that highlight regions on mouseover and allow the user to narrow down a selection from a world map view to a continent level. Here is an interesting example: davidlynch.org.
Many of these clickable maps are implemented with HTML image maps, while another option is to use for example Google's GeoChart API. Concerning the HTML image maps option, I'm wondering where people get all the 'raw data', all the country and regional border polygons. Is there a free resource for that? Concerning the Google GeoChart option, I'm wondering if that is scalable or if the number of API calls are somehow limited?
Does anyone have some advice on the availability of a free library that allows a straightforward implementation of clickable maps with customizable regions?
Well it is not really a problem which could be tagged 'geocoding'.
Since I have been playing with Raphael.js these days, I thought of this lib while reading your question title. I also remember Wikipedia commons hosted a SVG map of the world. Raphael helps you manipulate svg files, so that could be a nice way to go.
Anyway, after searching whith the criteria 'raphael' I found a conversation matching your request, exactly. So there it is : http://groups.google.com/group/raphaeljs/browse_thread/thread/46b5402c677ce274/7ff6a6a8d8f5f9fa?pli=1
There are some utility scripts, as well as the link to the svg world file mentioned above and a live examples (and links to Stack Exchange topics).
Sure there is work to do, and it may be easier to call directly the google api.
In my experience of the gmaps API, you have to make many requests per second to be blacklisted by google. Like when you launch a heavy batch geocoding tool. So it depends of your project but I would consider quite safe to use it even if your page is popular.
[EDIT] : There is now a live demo on RaphaelJs website.
[EDIT again]: And now a complete production workflow based on Python and Raphael exists : Kartograph. It's really young but looks promising.
Check this out. Seems to serve your requirements and offers a bit more:
Google Maps with Clickable Regions
http://codecanyon.net/item/google-maps-with-clickable-countries/3186942
I second the raphael.js, it is a nice library to draw the shapes with all kinds of user interaction. As an example, you may look at this project, which is a vector map of Russia, implemented on top of the Raphael.js. It allows highlighting the regions programmatically.
There are two libraries I can recommend without doubt: 1. d3JS and 2. Raphael JS
The latter is what I was using for writing my
clickable map generator web application - Make a Clickable Map
d3JS has a steeper learning curve, but you can do way more things with it than Raphael. On the other hand, Raphael is easier to pick up and is fun to work with.

Create a web based GPS Skyplot

I am looking to create a web based GPS skyplot.
Currently just in the planning stages. Was wondering if anyone knew any javascript libraries or such in which this would be best to start with or have a look at, of if you have done something similar before. I know Flot is decent for plotting but unsure if it would be easy in this scenario.
TLDR: Looking for javascript libraries or other alternatives to create a web based GPS Skyplot.
Further info.
I would like to be able to maintain it all generally in javascript / HTML but am open to other alternatives. I will have a server passing me the GPS details.
Skyplot Examples: For those who don't know.
http://www.gpsoftnav.com/skyplot.html
http://www.novariant.com/resources/technologies/skyplot.cfm#
I came accross:Geographic Information Systems (Stack Exchange) yesterday, would make a good site for these kind of questions.
So if anyone is interested in this please also go make a commit :). Otherwise I am still looking for any feedback on the question.
Is it the graphical issues you are concerned with, or are you intending to also calculate which satellites are visible, and their azimuths and elevations at the given location and time?
If it's just the graphical part you are concerned with, I would use jQuery and Keith Wood's SVG plugin - see http://keith-wood.name/svg.html . This gives you a Javascript handle to Scalable Vector Graphics, for drawing circles, lines and dots on a canvas in the web page. It's simple to use, and the page I've linked to has examples that should help.

Categories

Resources