proustibat / d3js-ionic Goto Github PK

D3.js examples in an Ionic app

Home Page: https://play.google.com/store/apps/details?id=prstbt.ionic.d3

License: GNU Affero General Public License v3.0

TypeScript 40.27% HTML 41.30% CSS 14.23% JavaScript 0.98% Shell 3.22%

ionic-framework ionic3 ionic-apps typescript d3 d3-js d3v4 d3-visualization ionic-cordova ionic-applications ionic tutorial tutorials tutorial-sourcecode learning learning-ionic d3js

d3js-ionic's Introduction

D3.js with Ionic

A tutorial app built with Ionic Framework to learn D3.js with Typescript

Presentation

Why this app?

I made this app while learning D3.js. But while I had in mind that my goal was to use it in an Ionic app, I realized there was some differences compared to a classical use. Mainly because of Typescript.

If you're in this case, you need to install TypeScript type definitions. So syntax may be different than a simple usage of D3.js.

Who is this for?

I propose to share my work to make you save time while learning.

I think these examples could also be appropriated if you already are in and advanced step of your learning but stuck on some points.

What can you find here?

Most of these examples are based on Dashing D3.js tutorials adapted in Typescript 2 for Ionic 3.

Working with this code

Prerequisites

Of course you need node and npm.

Please also be sure you installed Ionic and Cordova:

npm install -g ionic cordova

To verify your system is ok run ionic info.

Installation

Install the app by running:

git clone [email protected]:proustibat/d3js-ionic.git
cd d3js-ionic
ionic cordova prepare

This should prompt you if you want to install npm packages, answer yes. If it's not the case, run npm install;

Run the app:

// in the browser with livereload
ionic serve -l
// or on a device
ionic cordova run android --device
ionic cordova run ios --device

Documentation

Code documentation is available here

Feel free to improve the app

Please use commitizen if you wanna contribute to the project and create a pull request ( run git cz instead of git commit)
Quality code status is available on Sonarcloud
CI with Travis

Contribute

Issue Tracker: https://github.com/proustibat/d3js-ionic/issues
Source Code: https://github.com/proustibat/d3js-ionic

Support

If you are having issues, questions or any suggestions, please let me know: [email protected] / twitter/@proustibat

License

The project is licensed under the GNU Affero General Public License v3.0 license

Dev stats

Complexity

How simple or complicated the control flow of the application is.

Documentation & sizes

Duplications

Issues

Maintainability

Issues in this domain mark code that will be more difficult to update competently than it should

Technical debt

Effort to fix all maintainability issues. The measure is stored in minutes. An 8-hour day is assumed when values are shown in days. (The value of the cost to develop a line of code is 0.06 days)

Reliability

Issues in this domain mark code where you will get behavior other than what was expected.

Security

d3js-ionic's People

Contributors

Stargazers

Watchers

Forkers

nengock ionic4-toolbox

d3js-ionic's Issues

Action required: Greenkeeper could not be activated 🚨

🚨 You need to enable Continuous Integration on all branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because it uses your CI build statuses to figure out when to notify you about breaking changes.

Since we didn’t receive a CI status on the greenkeeper/initial branch, it’s possible that you don’t have CI set up yet. We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

If you have already set up a CI for this repository, you might need to check how it’s configured. Make sure it is set to run on all new branches. If you don’t want it to run on absolutely every branch, you can whitelist branches starting with greenkeeper/.

Once you have installed and configured CI on this repository correctly, you’ll need to re-trigger Greenkeeper’s initial pull request. To do this, please delete the greenkeeper/initial branch in this repository, and then remove and re-add this repository to the Greenkeeper App’s white list on Github. You'll find this list on your repo or organization’s settings page, under Installed GitHub Apps.

Circles SVG are not drawn on some pages

Expected behavior

SVG circles displayed on pages:

Basic SVG Elements
Drawing Basic Shapes using JSON data

Actual behavior

If the user comes from one of those pages navigating to the other, cirecles are not drawn on this second page

Steps to reproduce the behavior

Run the app, tap 'let's get started' on the home page. Tap next button: circles are drawn. Tap next again: circles are not drawn.

Specifications

Platform

Android
Browser serve with Ionic

Device

One Plus 3T
Chrome

Version 10 of node.js has been released

Version 10 of Node.js (code name Dubnium) has been released! 🎊

To see what happens to your code in Node.js 10, Greenkeeper has created a branch with the following changes:

Added the new Node.js version to your .travis.yml

If you’re interested in upgrading this repo to Node.js 10, you can open a PR with these changes. Please note that this issue is just intended as a friendly reminder and the PR as a possible starting point for getting your code running on Node.js 10.

More information on this issue

Greenkeeper has checked the engines key in any package.json file, the .nvmrc file, and the .travis.yml file, if present.

engines was only updated if it defined a single version, not a range.
.nvmrc was updated to Node.js 10
.travis.yml was only changed if there was a root-level node_js that didn’t already include Node.js 10, such as node or lts/*. In this case, the new version was appended to the list. We didn’t touch job or matrix configurations because these tend to be quite specific and complex, and it’s difficult to infer what the intentions were.

For many simpler .travis.yml configurations, this PR should suffice as-is, but depending on what you’re doing it may require additional work or may not be applicable at all. We’re also aware that you may have good reasons to not update to Node.js 10, which is why this was sent as an issue and not a pull request. Feel free to delete it without comment, I’m a humble robot and won’t feel rejected 🤖

FAQ and help

There is a collection of frequently asked questions. If those don’t help, you can always ask the humans behind Greenkeeper.

Your Greenkeeper Bot 🌴

An in-range update of cordova-android is breaking the build 🚨

The dependency cordova-android was updated from `7.1.1` to `7.1.2`.

🚨 View failing branch.

This version is covered by your current version range and after updating it in your project the build failed.

cordova-android is a direct dependency of this project, and it is very likely causing it to break. If other packages depend on yours, this update is probably also breaking those in turn.

Status Details

❌ continuous-integration/travis-ci/push: The Travis CI build could not complete due to an error (Details).