[Phpmyadmin-devel] GIS visualization

[Tyron Madlener]

On Thu, Jun 2, 2011 at 6:23 PM, Tyron Madlener <tyronx at gmail.com> wrote:
> On Thu, Jun 2, 2011 at 6:05 PM, Tyron Madlener <tyronx at gmail.com> wrote:
>> On Thu, Jun 2, 2011 at 4:21 PM, Madhura Jayaratne <madhura.cj at gmail.com> wrote:
>>>
>>>
>>> On Thu, Jun 2, 2011 at 7:28 PM, Tyron Madlener <tyronx at gmail.com> wrote:
>>>>
>>>> On Thu, Jun 2, 2011 at 3:29 PM, Madhura Jayaratne <madhura.cj at gmail.com>
>>>> wrote:
>>>> >
>>>> >
>>>> > On Thu, Jun 2, 2011 at 6:16 PM, Tyron Madlener <tyronx at gmail.com> wrote:
>>>> >>
>>>> >> On Thu, Jun 2, 2011 at 2:35 PM, Madhura Jayaratne
>>>> >> <madhura.cj at gmail.com>
>>>> >> wrote:
>>>> >> >
>>>> >> >
>>>> >> > On Thu, Jun 2, 2011 at 1:32 PM, Tyron Madlener <tyronx at gmail.com>
>>>> >> > wrote:
>>>> >> >>
>>>> >> >> On Thu, Jun 2, 2011 at 4:27 AM, Madhura Jayaratne
>>>> >> >> <madhura.cj at gmail.com>
>>>> >> >> wrote:
>>>> >> >> >
>>>> >> >> >
>>>> >> >> > On Thu, Jun 2, 2011 at 1:42 AM, Marc Delisle <marc at infomarc.info>
>>>> >> >> > wrote:
>>>> >> >> >>
>>>> >> >> >> Madhura Jayaratne a écrit :
>>>> >> >> >> (...)
>>>> >> >> >> >      >     Hi Ammar,
>>>> >> >> >> >      >
>>>> >> >> >> >      >     I'm not sure what exactly your requirement is. But
>>>> >> >> >> > pls
>>>> >> >> >> > have a
>>>> >> >> >> >     look
>>>> >> >> >> >      >     at the visualization of data at [1] by clicking on
>>>> >> >> >> > the
>>>> >> >> >> > 'Visualize
>>>> >> >> >> >      >     GIS data' link in the 'Query results operations'
>>>> >> >> >> > section
>>>> >> >> >> >     towards the
>>>> >> >> >> >      >     bottom of the page. Try out zooming by double
>>>> >> >> >> > clicking
>>>> >> >> >> > and
>>>> >> >> >> >     panning
>>>> >> >> >> >      >     by dragging. I believe you are looking for something
>>>> >> >> >> > like
>>>> >> >> >> >     this for
>>>> >> >> >> >      >     your zoom search feature.
>>>> >> >> >> >
>>>> >> >> >> >     Madhura,
>>>> >> >> >> >
>>>> >> >> >> >     I have issues operating panning and zooming. Here is the
>>>> >> >> >> > scenario:
>>>> >> >> >> >
>>>> >> >> >> >     1. Browse world_cities and click Visualize GIS data
>>>> >> >> >> >     2. Click-drag: pans OK
>>>> >> >> >> >     3. Double-click: this is a zoom out, I guess
>>>> >> >> >> >     4. Click-drag: no panning
>>>> >> >> >> >     5. Click "zoom out": data points are enlarging, isn't this
>>>> >> >> >> > a
>>>> >> >> >> > zoom-in?
>>>> >> >> >> >
>>>> >> >> >> > Marc,
>>>> >> >> >> >
>>>> >> >> >> > This is a Firefox compatibility problem. Resolved and pushed to
>>>> >> >> >> > the
>>>> >> >> >> > repo. Demo will take some time to upgrade to the new version.
>>>> >> >> >> > Meanwhile
>>>> >> >> >> > if you have Chrome, you can still experience what it's suppose
>>>> >> >> >> > to
>>>> >> >> >> > do.
>>>> >> >> >>
>>>> >> >> >> Madhura,
>>>> >> >> >> ok, panning and zooming are fine now.
>>>> >> >> >>
>>>> >> >> >> Is the saving feature ready? I tried to save in PNG and got a
>>>> >> >> >> bunch
>>>> >> >> >> of
>>>> >> >> >> binary data on-screen.
>>>> >> >> >>
>>>> >> >> >> Saving in PDF generates
>>>> >> >> >> Fatal error: Call to undefined method
>>>> >> >> >> PMA_GIS_Visualization::toFileAsPdf() in
>>>> >> >> >>
>>>> >> >> >>
>>>> >> >> >>
>>>> >> >> >> /srv/http/pma.cihar.com/gsoc-madhura/libraries/gis_visualization.lib.php
>>>> >> >> >> on line 161
>>>> >> >> >>
>>>> >> >> >> --
>>>> >> >> >> Marc Delisle
>>>> >> >> >> http://infomarc.info
>>>> >> >> >>
>>>> >> >> > Hi Marc,
>>>> >> >> > In my previous mail to the group, I mentioned that this feature is
>>>> >> >> > not
>>>> >> >> > yet
>>>> >> >> > ready. BTW, this is a feature which is to be delivered in the
>>>> >> >> > second
>>>> >> >> > half of
>>>> >> >> > GSoC (after mid-term eval), according to the schedule. However I
>>>> >> >> > started
>>>> >> >> > working on it, since it is very much related to what I've done so
>>>> >> >> > far. I
>>>> >> >> > should be able to get it ready (for all 3 formats, SVG, PNG and
>>>> >> >> > PDF)
>>>> >> >> > by
>>>> >> >> > the
>>>> >> >> > end of this week.
>>>> >> >>
>>>> >> >> Just in case I'm allowed to use Highcharts, could you make your
>>>> >> >> conversion code generic enough so I could use it too? :)
>>>> >> >> And just for your information, the current SVG converter of
>>>> >> >> highcharts
>>>> >> >> uses following post variables to a php file that calls a java tool
>>>> >> >> (source is available btw):
>>>> >> >>
>>>> >> >>  * $tempName string The desired filename without extension
>>>> >> >>  * $type string The MIME type for export.
>>>> >> >>  * $width int The pixel width of the exported raster image. The
>>>> >> >> height
>>>> >> >> is calculated.
>>>> >> >>  * $svg string The SVG source code to convert.
>>>> >> >>
>>>> >> > Hi Tyron,
>>>> >> > For my work I am not doing any conversions as such. I am generating
>>>> >> > SVGs
>>>> >> > and
>>>> >> > PNG separately in their basic forms. It's not that I generate it in
>>>> >> > one
>>>> >> > form
>>>> >> > and converting it to the other.
>>>> >> > --
>>>> >>
>>>> >> Does that mean you use jQuery SVG to generate the SVG and build/use
>>>> >> another rendering library that generates the PNG/PDF? Why not just
>>>> >> build a converter? That seems like a more reusable solution.
>>>> >>
>>>> > I use GD extension to generate PNGs and will be using TCPDF (which is
>>>> > already included in PMA) to generate PDFs. Since both GD and TCPDF
>>>> > support
>>>> > rendering basic shapes, I find this approach needs only
>>>> > few additional lines
>>>> > of code, which would not have been the case if I am to build
>>>> > a converter.
>>>>
>>> In total I did not have to add more that 100 LOC to get all 7 geometric
>>> types to PNG.
>>>
>>>>
>>>> A disadvantage is that you will have duplicate code. Also if we would
>>>> have a converter we could include some cool features such as exporting
>>>> the SVG with its currently selected zoom level and pan - which might
>>>> turn out really useful for big amounts of data.
>>>
>>> Well, I agree that this will be useful.
>>> About code duplication, I tried my best with a good class hierarchy to
>>> ensure that code duplication is minimized as much as possible.
>>>>
>>>> And it will turn out really useful when I'm allowed use Highcharts for
>>>> the status page. There the conversion code will be ~100% reusable.
>>>>
>>>> So how about we build one together? :)
>>>
>>> Great idea!!! But I doubt whether I will have enough time for this, since my
>>> GSoC project is 'OpenGIS support for PMA' and not 'OpenGIS visualization
>>> support for PMA' :) There is lot more I promised to deliver that is related
>>> to OpenGIS.
>>>>
>>
>> After some serious digging I found canvg
>> (http://code.google.com/p/canvg/) which would let us convert svg into
>> a canvas (in javascript). And canvas elements are basically already
>> bitmaps so we can export them directly as png.
>> The procedure sounds a bit odd but therefore even saves us any
>> server-side conversion.
>>
>> Here's some examples what it can convert:
>> http://canvg.googlecode.com/svn/trunk/examples/index.htm
>> It's supposed to work for IE7-8 aswell but in my tests it couldn't
>> convert my highcharts generated svg code. In Chrome it worked though.
>>
>> I'll keep researching on this ;-)
>
> Hehe and here is the solution for jQuery SVG when using canvg:
> http://stackoverflow.com/questions/4827764/convert-jquery-svg-to-image/4836882#4836882
>
> Though at some point I would use Downloadify
> (https://github.com/dcneiner/Downloadify) to eliminate any server
> interaction and use the supplied php snippet only as fallback when
> flash is not available.
>

Awesome! Took me less than an hour to build a proof-of-concept for
svg->canvas->image export for highcharts. Changes are pushed to my
repos and should show up soon.

To see it live, navigate to Status page -> Query statistics ->
Realtime chart -> click the arrow in the corner -> export as png

Previously mentioned bug prevents the export from working in IE8 but I
have filed a bug report which has already been confirmed by the
original author of canvg and might be fixed soon :D

Adding support for jQuery SVG aswell will be a piece of cake.

>>
>>>> There should be some lib for it anyway. Might even turn out to be
>>>> easier than the code to generate a PNG.
>>>>
>>>
>>> --
>>> Thanks and Regards,
>>> Madhura Jayaratne
>>>
>>>
>>>
>>
>