D3 Plots with DataPlotly plugin
This is a modal window.
The media could not be loaded, either because the server or network failed or because the format is not supported.
Formal Metadata
Title |
| |
Title of Series | ||
Number of Parts | 37 | |
Author | ||
License | CC Attribution - ShareAlike 3.0 Germany: You are free to use, adapt and copy, distribute and transmit the work or content in adapted or unchanged form for any legal purpose as long as the work is attributed to the author in the manner specified by the author or licensor and the work or content is shared also in adapted form only under the conditions of this | |
Identifiers | 10.5446/40773 (DOI) | |
Publisher | ||
Release Date | ||
Language |
Content Metadata
Subject Area | ||
Genre | ||
Keywords |
QGIS ACoruña Konferenz 201926 / 37
3
5
8
13
17
19
26
00:00
Plot (narrative)Software developerPlug-in (computing)PlotterDistanceJava appletLibrary (computing)Scripting languageInteractive televisionCodeCross-site scriptingQuery languageOpen sourceKeyboard shortcutFormal languageType theorySoftware frameworkProcess (computing)Revision controlSingle-precision floating-point formatLine (geometry)Inheritance (object-oriented programming)Scale (map)Orientation (vector space)Computer configurationPlotterWeb 2.0NeuroinformatikDifferent (Kate Ryan album)WindowPlug-in (computing)Library (computing)Software frameworkEvent horizonCodeFunctional (mathematics)Multiplication signBlogNetwork topologyDemosceneLimit (category theory)BitLine (geometry)Software developerWritingInteractive televisionLevel (video gaming)Software development kitRevision controlGraph coloringProcess (computing)Installation artCartesian coordinate systemSoftware bugType theoryVariety (linguistics)Binary codeStandard deviationSource codeVideo gameLattice (order)WordTerm (mathematics)Data structureDisk read-and-write headSeries (mathematics)Execution unitPower (physics)Physical lawFood energyCondition numberPolar coordinate systemView (database)Office suiteSingle-precision floating-point formatAreaInsertion lossUtility softwareChainTheoryQuicksortMachine visionComputer animation
06:56
PlotterProcess (computing)Endliche ModelltheorieStapeldateiThree-valued logicLetterpress printingExecution unitFluid staticsPlot (narrative)Online helpCodeSlide ruleLink (knot theory)Insertion lossMultiplication signUniverse (mathematics)Self-organizationSimilarity (geometry)Direction (geometry)Power (physics)Table (information)DialectMathematicsAreaTheoryLengthRoundness (object)Arithmetic meanCondition numberProjective planeSystem callSocial classVolume (thermodynamics)Variable (mathematics)ForestPole (complex analysis)Endliche ModelltheorieVideo gameCASE <Informatik>Theory of relativityRule of inferenceStructural loadMereologySoftwareScatteringPresentation of a groupOrientation (vector space)Raw image formatRevision controlHeegaard splittingGUI widgetPoint (geometry)Wrapper (data mining)PlotterDifferent (Kate Ryan album)Limit (category theory)Letterpress printingGraph coloringString (computer science)Interactive televisionWeb 2.0Row (database)CuboidUsabilityRaster graphicsStatisticsPlanningInterface (computing)Web browserVector spaceCodeOcean currentAttribute grammarBridging (networking)Configuration spaceBitSoftware maintenanceType theoryFrame problemSoftware frameworkFluid staticsProcess (computing)Link (knot theory)Computer animation
13:48
Information technology consultingServer (computing)Computer animationJSONXMLUML
Transcript: English(auto-generated)
00:07
So I will introduce this plugin that is called Poply and Mateo Getta, I work with Analia working with the Q2DS team since a long time now, at least for me. And the idea of having a plugin in Q2DS showing plots started when I was looking into DE3 plots,
00:32
because in my opinion DE3 is kind of magic, you have different plot types, you can interact with the trees or JavaScript library, you can build this interactive plot,
00:44
you have HTML and CSS customization available, but in my opinion the major functionality and feature is that plots are interactive, so you can query items on the plot, so you can zoom out of course, re-select and paint the plot canvas, and catching and grabbing JavaScript events.
01:12
Okay, what about DE3 plots in Python? Some years ago I started to look into the web and I discovered that there are not so many available libraries,
01:25
and it's not so easy to write Python code and ship it to the DE3 code, the installation could be a problem. Okay, so how to solve the problem? Some years ago I was looking into Plotly, Plotly is open source, I mean 5 years ago it was not open source,
01:53
then fortunately they decided to switch in open source, they made this banner and they described why they changed open source, so why they changed their mind.
02:03
Basically it's a JavaScript library that offers binding for R, ggplot and all other R libraries for Python, matplotlib, pandas also, matlab, node.js and lots more. Okay, basically you write code in Plotly syntax and the work of Plotly is to ship this kind of syntax to the JavaScript library.
02:32
So why Plotly? Because it's really reliable, it really has many many features, it's a daily activity of bug fixing, of new features,
02:44
the syntax is very clean, at least in Python, for every language, it's really maybe too many, too many customizations, and as I said the community is very very active.
03:02
So the Plotly workflow is, you can download it on your computer or you can also use the Plotly kind of framework, web framework, so you upload the data, it's kind of GitHub, you have a free account where your data, your blog became public, or you pay something and you have a private repository, or you can download it and use it on your computer.
03:25
The installation for Python is via IP, so it's very simple, there are API also for offline usage, and it's really just a few lines to write, to create a plot, and these few lines, these few lines, okay,
03:42
there are 15 lines, 2 lines of import, 3 empty lines, and I just wanted a little bit of code. With these lines you have, okay, in HTML we need some customizations. Kritislav Plotly actually from scenes version 2, we have some lot available in Processing.
04:03
The major feature of having Plotly in KIT.js is that for Windows users you don't have to install it via IP, because for Linux and OS X users it's not a problem to install external libraries for Windows could be really a pain.
04:22
It was easy to add other plot types in the Processing framework, so why that Plotly actually? I found some limitations within the Processing framework, especially in there were just a few plots available. You don't have any layout customization, layout means plot title, legend, moving axis, and so on.
04:47
You will just have an HTML expert, you have actually a lot of code application, because to make another plot you have to copy and paste the plot and just change a few lines, so you have a lot of classification, and most important, at least for me,
05:04
it was not possible to link the plot with the map items, with the map features. This is basically the Data Plotly framework. Basically I rely on three main libraries, Qt5, QGIS of course, and Plotly,
05:20
and making all these together you have Plotly. That's our tutorial on GitHub, it's currently translated in few in five languages, also in Sweden, Swedish. Data Plotly is simple, it's very simple, I designed it because I thought about the user side,
05:40
and you want to make a plot, so you just want to make a few clicks and have a plot. Then if you want you can customize the plot, but you have to do this as simple as possible. Installation of course is a plugin, so you just have to download and install the plugin. For a user you have actually three months clicks without customizations,
06:01
and for developers you don't have code application, or at least not so much code application. I said simple, not poor. So with Qt, Plotly and QGIS, with Data Plotly you can make a lot of different things,
06:20
I put all these things together, I didn't make any external libraries. For now you have 10 plots available, you have really maybe too much customizations, just a few of them, a few customizations, color skills, markers, legend titles, labels,
06:42
all what I thought it was not possible to do in processing. You have some data defined options, so thanks QGIS of course. You can export the plot in HTML, but also as a PNG plot. You have interaction between the plot items and the features on the map,
07:01
and it is also within the processing framework standalone as a simplified version of Plotly. So it's usable or same model for example. The interface is simple, it's not just a top panel with, I mean simple as I said, it was designed to be as simple as possible.
07:20
It's just a film, and if you choose the type of plot, you choose the layer, the X, Y axis, colors and whatever, and you create a plot, that's it. Then if you click on items, you can resize the plot, all these widgets in the upper part are Plotly things,
07:40
and if you click on the plot, as you see, you can see the features related on the map, you have also that, so selecting features, a lot of different things. Okay, this is the last tool. That's another small GIF with box plot, okay,
08:01
the interaction is also activity, and some customizations, lots of title and so on. And for this plot, I changed the orientation of the box, I will show some additional statistics and all the outliers possible of the box plot. Then updating the plot means like that, having it quickly.
08:24
Okay, this is an example of the binding plot that I showed yesterday in the good workshop, maybe they make sense now. And this is the data defined that I tried to show yesterday during the workshop. You choose two variables, X and Y, and a third variable for a color scale,
08:46
something like this, okay? And you can also choose a fourth variable, or the same third variable, to resize the plot items, like that. The interaction is of course always maintained.
09:02
You can overlap different kinds of plots, or like that, you have here a bar plot and a scatter plot, actually. Or when it doesn't make any sense, you can split plots in different rows or columns. And this terry plot, okay, this is the interface of processing,
09:26
the simplified version. And this, you can also grab all, because that's actually HTML code and a little bit of JavaScript, so you can copy and paste that code, adding an HTML frame in the print composer,
09:46
copy and paste the code, updating the HTML frame, and you have the plot. It's not the best way, but I will come to that. Okay, limitations are the static plot exploitation, it's mostly doesn't offer a simply way to export plots.
10:01
They have a kind of, it's called Orca, it's a kind of web engine, so you shoot the plot to this web engine, and then your browser opens, and then you save the plot, so it's not the best way. Currently it's made all by QT. And I have a crash, never understood why, because on Linux it works perfectly,
10:24
but with QT 3D plus and QT WebView, so anyone knows something. Okay, I'm really happy that we have this chance to run this crowdfunding campaign between Tom Dahlia and Nontrol. So we agreed that Datapod 3 has to become bigger or maybe more reliable in some way.
10:49
And this crowdfunding, of course, the link there. So me and I, we work together on that, and we will refactor the code, have better performances and better code.
11:01
We will have a kind of saving and restoring the plot configuration, because for the moment, you cannot save the plot. I mean, it could be not so, I mean, for the user case, you want to save all the configuration of the plot. So if you load a project, then you will also want to load the plot, okay?
11:23
And we will add some more data-defined properties, but the main point is that we will want, what we want to do, is to add a kind of Datapod 3 button in the print composer and having a Datapod 3 version in print composer. Meaning that you will not be forced anymore to copy and paste raw code, raw HTML code,
11:46
where you have a button with all the widgets of Datapod, which is also a screenshot over the screenshots. And to reuse all the widgets, click a button, edit plot, and also atlasd. So when you change, when you have a layout with atlas,
12:01
also the plot will update accordingly. And so, that's all. Only for vector data?
12:20
Are there any plans to put raster data on the axis? Actually, not for now, but for now. It's only back because it's kind of based on the attribute table, so it's on raw, yeah. Technically, it's not so much complex, because again, you have to change all the stuff to JSON
12:44
and yet inside JavaScript. So again, to create a wrapper to extract the string of raster data and then put JSON inside.
13:00
The kind of press that before. So that would be very useful. Yeah, yeah, yeah. I mean, I designed it because I was working with a lot of different vector data, so I was forced to take the data, put it outside QGIS over other software, I don't know, LibreOffice or R,
13:21
and then put the plot again in QGIS, and I was tired to do this kind of bridge again and again. And that could be a nice idea, yes. I got a little bit of presentation.