sachin-angular-phonegap's Issues
UI Beautification
Once we have the entire charts ready.
Lets plan how to go about UI, Such that it looks good on all platforms. Feel free to express your ideas and how to go about UI thing.
Note: Complexity to UI can be added later (like complex transitions) @pinakinmistry is however expert at it.
Top5 Charts First, Next 5 Charts Next
Merge Score Buckets and Loss by in one chart
Merge in one tile with buttons(3)
Animate on series update
Donut chart to analyze the wins data
Data for Test, ODI and T20
ODI/Tests selector
- Separate navigation for ODIs and Tests can create an additional click away from looking at the charts. We should instead have a button on the top right corner of each page to choose either ODI or Tests as follows.
To achieve this seamlessly, following can be done:
- Main controller watches for change to this model and changes the folder path (to chose test data or ODI data)
- Each controller to define function plot_graph which will be called upon the change of the model to re-render.
Data Validation
Master Issue for Charts
Charts we are looking now at:
- Summary Charts #14
- Donut of Wins/Losses #5 - There must be option for filtering this one by Stadium, vs Country etc.
- Area Chart of Runs #15
- Records Charts #13
- Wins/Losses in a donut chart With Sachin/Without Sachin.
- 3D chart of the records (as commented by Adi, below)
Potentially more to consider/discuss:
- How about a Pie drill down chart of the Donut chart? (On click of Donut can it change to the drilldown pie?)
- Sachin scores vs wins, losses for the batting order, - #10 (may be also for the toss)
- Scores/Centuries etc in Stadium (There is another dataset for these)
- Worldmap D3 visualisation of the scores in a country (and against a country.)
To look for:
- Can we use multi axis combination chart
- Any other D3 or SVG visualisation we can use.
Discuss about the width 100%
This doesnt seem to allow scrolling easily and what about the side borders?
Include GA local file
It was fetching from the CDN. Removed the CDNifyer.
On refresh charts not rendering
Score vs Won Loss Percent Donut and Pie Chart
(Potentially) use the flatly bootswatch theme.
Testing on Device
Its high time we should start testing it on devices. This will help us from doing any kind of rework.
Use Range slider for "Find out by yourself" graph input
Explore alt CSS to bootstrap
This is not needed for this project per se, but good to checkout if it makes sense to use one of:
Lungo: https://github.com/TapQuo/Lungo.js/
Adobe Topcoat: http://topcoat.io/topcoat
Not using this one, but has good angular integration: http://ionicframework.com/
From the author of bootstrap for mobile: http://maker.github.io/ratchet/
Master issue for External integrations.
- Phonegap build
- Appgyver Steroids
- Crittercism
- Helpshift for feedback.
- PushWoosh... for Push Notifications.
- Any analytics package
- Firebase for chat? (only explore)
Highcharts behavior should be same for our App
Icons and Screens needed
This folder has various icons and screens for the platforms we need.
All of these have to be replaced: https://github.com/becomingGuru/sachin-angular-phonegap/tree/master/app/res
Summary charts UI
The neat and good dropdowns/selections, colors etc.
JS compress
... before phonegapping.
Windows publisher id
Find out Yourself tile validation
Master Issue for First Release
Find out yourself in one chart with two buttons
Main Issue List
- ODI/Test Button : [Text]
- No jump [min-height]
- Remove bootstrap css
- Add share button [Along with bar]
- No horizontal jump in 3rd tile
- SVG-PNG [through highcharts]
- Check on youtube tile [top margin]
Integrate PushWoosh
For Push Notifications on all devices.
Integrate Phonegap Social Sharing widget
Remove Won/Lost tile
Integrate Social Networking Modules
Creating Twitter follow link and also the tweets list.
Optimise Angular for Mobile
- minify (use grunt minify and angular-minify enabler.)
- Remove 300ms delay for click.
Read:
Chart 3: Cumulative Area chart of Runs
Example: http://www.highcharts.com/demo/area-basic/skies
Data for this is already available: sachin_odi_all.json
android publisher id etc
layout issue
Relative to other Player bar charts
One page for all of the relative greatness of Sachin:
- Most matches in career: http://stats.espncricinfo.com/ci/content/records/223375.html
- Most consecutive matches: http://stats.espncricinfo.com/ci/content/records/128609.html
- Most player of the match awards: http://stats.espncricinfo.com/ci/content/records/283705.html
- Most player of the series awards: http://stats.espncricinfo.com/ci/content/records/283448.html
- Longest Career: http://stats.espncricinfo.com/ci/content/records/283448.html
Summary Charts functionality
Similar to the CT charts - selection of the json and of the attrs
UI for all possible screens sizes and both portrait and landscape mode.
function calculateSizes() {
tileCount = Math.floor(screenWidth / 160); //320px is min width; so 2 tiles min
tileSize = screenWidth / tileCount;
chartWidth = screenWidth;
}
onPageLoad or onScreenResize -> calculateSizes(), redraw charts with new width and options.
Make Font in the 2 Life time charts consistent with other charts
Create a dev server
Use github pages if possible, else Heroku.
pg plugins
GA,
PW,
EC,
Instagram,
Helpshift
Scores/ Wins / Year denormalized data
Data in the json format.
UI navigation
Back and the Home buttons with flip-contract animation using css transitions.
Single flip on back and double flip for the home-page (with the home icon.)
Donut chart for win loss vs order of batting (1st, 2nd,..., DNB)
Write up about the SRT angular hc directive
Remove Hashbangs
Angular uses # in the url to support old browsers.
Since we dont support them anyway, use proper URLs without #.
Chart 1 : Summary
Feedback for Sachin Lifetime Score Chart
Please leave your comments about the charts.
D3 TimeSeries of the top 15 scorers
Package as a phonegap app
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. ๐๐๐
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google โค๏ธ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.