Git Product home page Git Product logo

ckanext-visualize's Introduction

image

image

ckanext-visualize

CKAN extension which allows users to visualize data in a very efficient and intuitive way, in a simple to use User Interface. The viewer automatically creates the most meaningful chart based on the chosen columns. Administrators can create predefined charts and easily configure them based on the needs.

Features

  • Intuitive and easy to use. This CKAN extension enables users to easily build and visualize charts that are simple to use.
  • Predefined charts. Administrators can create meaningful charts for users as CKAN views, so they can immediately visualize and understand the data.
  • Standalone chart viewer. The extension allows the chart viewer to be embedded on third-party websites without creating CKAN views.
  • Intelligent chart type selection. Depending on the data types of the columns that are chosen, the extension automatically chooses the most appropriate type to visualize the data.
  • Drag-and-drop columns. Creating a chart is as easy as dragging a column from the list of all available columns into the X or Y axis.
  • Color attribute. Data in the chart can be grouped based on the selected column and colored for each distinct value.
  • Visually distinct columns. All available columns that can be dragged are color coded based on the data type of the column and have a specific icon defined in a legend.
  • Chart types. The viewer supports the following types of chart: bar, line and point, with more coming in the next release.
  • Customizable color palette. The extension comes with a default color palette that is using carefully chosen colors that are accessible, with the possibility to change them and add additional ones from a configuration page.
  • Customizable chart type icons. For each supported chart type, there is a corresponding icon that can be customized from a configuration page.
  • Mobile support. Drag-and-drop functionality is supported on mobile devices as well.
  • Responsive. The extension is optimized to work across many screen sizes, from mobile to desktop.

Used technologies

  • HTML, CSS, Bootstrap, JavaScript, jQuery, Chart.js, SortableJS, Python

Screenshots

- Predefined chart .. image:: screenshots/predefined-chart.png

- Intelligent chart type selection .. image:: screenshots/line-chart.png

- Drag-and-drop columns .. image:: screenshots/drag-and-drop.png

- Color attributes .. image:: screenshots/color-attributes.png

- Chart colors .. image:: screenshots/chart-colors.png

- Data types .. image:: screenshots/data-types.png

- Chart types .. image:: screenshots/chart-types.png

- Customizable color palette .. image:: screenshots/customizable-color-palette.png

Requirements

This extension is developed and tested on CKAN 2.8

Installation

To install ckanext-visualize:

  1. Activate your CKAN virtual environment, for example:

    . /usr/lib/ckan/default/bin/activate
  2. Install the ckanext-visualize Python package into your virtual environment:

    pip install ckanext-visualize
  3. Add visualize to the ckan.plugins setting in your CKAN config file (by default the config file is located at /etc/ckan/default/production.ini).
  4. Restart CKAN. For example if you've deployed CKAN with Apache on Ubuntu:

    sudo service apache2 reload

Development Installation

To install ckanext-visualize for development, activate your CKAN virtualenv and do:

git clone https://github.com/keitaroinc/ckanext-visualize.git
cd ckanext-visualize
python setup.py develop
pip install -r requirements.txt
pip install -r dev-requirements.txt

Running the Tests

To run the tests, do:

nosetests --nologcapture --with-pylons=test.ini

To run the tests and produce a coverage report, first make sure you have coverage installed in your virtualenv (pip install coverage) then run:

nosetests --nologcapture --with-pylons=test.ini --with-coverage --cover-package=ckanext.visualize --cover-inclusive --cover-erase

Chart icons

The default icons that are used for the types of chart are taken from The R Graph Gallery.

Illustration

The illustration that is used is a modified version based on the open-source illustration from Katerina Limpitsouni.

Known issues

  • Performance. If a resource contains large data, e.g. more than 10000 rows, the viewer may be slower as it needs more time to prepare the data.
  • Internet Explorer. The HTML element <input type="color"> is not supported in Internet Explorer, therefore the color picker does not work in the administrator configuration page.

ckanext-visualize's People

Contributors

gocemitevski avatar miroslavgruevski avatar emickovska avatar zoranpandovski avatar klikstermkd avatar muhammadismailshahzad avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo 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.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.