How to create an empty chart in charts_flutter? - class

My question is about the charts_flutter charting library for Flutter (https://pub.dev/packages/charts_flutter) and how to draw an empty chart without any data with it? The library has an example gallery: https://google.github.io/charts/flutter/gallery.html showing different charts one can create using the library, but there is no example how to create an empty chart.
The reason for this need is that my app starts with no data and all the data is created during the run. I have successfully updated my chart an modified how it looks, when starting the app with fake debug data.
If a chart with no data is not possible, I would accept a solution where the whole widget is being build only after the first data are created. Is this possible in Flutter? To my understanding all the classes are initialized when the app is started. Is this correct?
One workaround would be starting with some artificial data, update the data and only after that show the chart widget, but this sounds more like a hack: I do not like this one.
Am I dealing with a crappy charting library and should I find a better library, or is it just my Flutter skills and understanding that are (still a bit) crappy? :)

It is absolutely possible to create a chart with the charts_flutter package that doesn't contain any data to start with.
The data field in the Series-class cannot be null, but you can provide an empty list.

Related

How to find the input form in the Flutter mobile program structure?

I have a task to solve a bug for an application form update on an application that uses Flutter when it is built. However, this is my first time using Flutter, and the program structure is a bit confusing. Can you tell me the easiest way to find the form structure in a Flutter program?
Start with exploring the screens available in your project to know which screen is being displayed that you need to debug. Then have a look at the widgets which this screen is composed of to point to the one that is causing the bug.

Google Visualization Chart Stopped Working

I have created a dashboard which uses JSON data to create several different kinds of google visualization charts. This dashboard has been working perfectly for two years. Just in the past day or so, the column chart and the line chart give a "Cannot read property 'Do' of undefined" error while my tables and maps continue to work. I have checked all of the most recent records to make sure there is nothing that could be undefined and I have found no issues. I've checked my arrays in the console and they all look correct. I've also checked the chart objects in the console just before drawing and they are properly populated, so I am stumped. Can anyone help me figure out what could be happening?
load google charts with a saved version (a.k.a. Frozen Charts Version)...
google.charts.load('50', {
when implementing a page or application,
always use a saved version of google charts.
this way, changes to the 'current' version can't mess with your code.
you can find a list of the saved versions at the following link,
along with the changes that were implemented...
https://developers.google.com/chart/interactive/docs/release_notes#version-history

Which is the better way to white-label a flutter app

I have one project that I have to sell to another clients, so I wanna found a way to unify the code to, when I release some updates, I have to manipulate only one code (and, of course, keeping the specificities from each one)
I found an article HERE which the guy creates a new folder named 'config' and set some variables there to be used in the parent project. I tried this but find out that would be very tough to do because the first app was developed specifically by one client, and with it I would need so much time to make all the aspects dynamic... Another problem is firebase, in first app I used firebase but in the second i won't. How to make it possible?
And in this article they say about 'flavours' that can be used to do something similar.
Someone knows about this approaches or there is another to reach my goal? With flavours I will have less re-factor than with config?
I appreciate any help
A third way to do this with no client specific app configuration is to make an api call to get back your client specific theme, and then set the flutter theme based on this.
If you need web support see below:
First update your assets in index.html that aren't white labeled, leaving stubs in their place that we'll fill in later. i.e.
Next show a nice loading indicator while flutter loads. To do this, just put the html for it in the body element of the index.html file.
Finally update the webpage title and favicon using javascript inside Flutter. I used package
universal_html: 2.0.8
https://pub.dev/packages/universal_html
then you can update the favicon
import 'package:universal_html/html.dart';
var favicon = document.getElementById('favicon');
favicon?.setAttribute('href','insertLinkToYourImage');
Updating the title can be accomplished in various normal ways like just setting the title attribute of a MaterialApp widget.

Looking for an interactive pie chart to use with GWT (without extern communication)?

I'm looking for a stand-alone Pie Chart which I can use in a GWT application. The Chart should be interactive, so that I can react on user input (read mouse clicks on the chart).
I've already looked at Google Chart Tools with GWT Visualization. This is exactly what I want. A simple to use PieChart class with user interaction and a simple and comprehensive data input. Except that the data is transfered to Google for the rendering part. The data should not leave the client or our server.
Have you tried Fusion Charts? Here's the Pie Chart showcase. Its a Flash object hence you will need to use JSNI to embed the object into your widget or use a library like GWT2SWF to do it for you.
I have used Fusion Charts + GWT2SWF combination in one of my products, and would recommend it to anyone looking for a interactive flash charting tool (outside of google's toolset)
A colleague of mine found following library: GChart. Rather then using Flash we'll try to draw our own. Not sure how easy this will be.
You mentioned:
"The Data should not leave the server"
With Google visualization APIs (as opposed to the chart apis) the data remains on your server, only the code is downloaded from google.
However, if you meant that you shouldnt need access to google at all, then GCharts is the only remaining and a pretty good option.
Check out GWT-RCharts hosted on http://code.google.com/p/gwt-rcharts/ . It is stand alone i.e doesn't have external dependency like Visualization. The API works on SVG/VML specification so no plugin dependency. You may find it quite easy to install, implement and use. You can find the demo at http://gwt-rcharts.appspot.com/

Advice for building simple bar chart, but with custom styling

I have some data that is displayed in a bar chart, using Google's Visualization API. Was simple enough until designers redesigned it... Now it appears to be something that is beyond what Google can help me with.
Given the attached mockup (and note the finer details like reflection and gradients!)- how would you go about building it? Using some existing graphing libraries? Homebrew from the ground up?
Thanks for any advice.
If you need to adhere to the custom design requirements as depicted in the image above, I would build a charting application using a more generalized graphics library such as Rapheal.
While it doesn't provide a simple API for plugging data into a chart, it does provide the ability to build a chart with the following:
a variety of shapes (i.e. the bars)
gradients
embedded images (i.e. the background)
You can change the visual effect using CSS.
Ofcourse you can use chuckx recommendation of Rapheal which is a SVG based Javascript Library. It can accept JSON values so say if you have JSON from Google API you could feed in directly.
Option 2 : HTML Canvas. There are lot of HTML 5 canvas libraries like Kinect, fabric.js powerful javascript canvas libraries