• CUC Logo
New

Data Visualisation

Gain the skills to implement a wide range of data visualisation techniques, essential for storytelling and data journalism.

Three professionals talking and referring to a data chart.

Data Visualisation

  • 6 weeks

  • 4 hours per week

  • Digital certificate when eligible

  • Intermediate level

Find out more about how to join this course

Develop practical, industry-ready data skills

On this six-week course, you’ll gain strong foundational skills in data visualisation to ensure you can turn data into captivating visuals.

With expert guidance and practical exercises, you’ll explore web visualisation of arrays and JSON data using the latest tools and technologies.

Gain an introduction to bar charts and piecharts

You’ll start by understanding how to create impactful bar charts using HTML, CSS, JavaScript, and SVG, paving the way for advanced data interpretation. These foundational skills form the backbone of data visual communication.

Next, you’ll learn to design pie charts that distill complex data into intuitive, visual formats, making your information easily digestible and engaging. By mastering pie charts, you’ll open new avenues for communicating data-driven insights.

Unlock the power of WordClouds and TreeMaps

You’ll understand how to employ WordClouds and TreeMaps to highlight patterns and relationships within your datasets. You’ll be able to effectively visualise hierarchical data and text frequency with these dynamic tools.

Then you’ll learn to utilise SVG charts and the powerful D3.js library to craft sophisticated visual representations like force-directed graphs and treemaps. This skill set is essential for any aspiring data visualisation professional, ready to tackle complex datasets.

Finish with advanced data visualisation skills

Finally, you’ll learn to push beyond 2D visuals by venturing into 3D histograms and scene rendering with Three.js, enhancing your toolkit and enabling you to present data in captivating ways that engage your audience.

By the end of this course, you’ll have the knowledge and confidence to turn data into compelling visual stories and be empowered to rapidly disseminate information in today’s data-driven world.

Download video: standard or HD

Syllabus

  • Week 1

    Introduction of Data Visualization and Bar Chart

    • 1-Introduction of Data Visualization

      This is an introductory video that encompasses all 10 types of charts covered in this course.

    • 2-BarChart

      This histogram is created using JavaScript, CSS, SVG, and HTML. No third-party APIs are involved, with the aim of illustrating the principles of 2D visualization. ----- Have a go at re-creating your own version. =^_^=

    • 3-Quiz-BarChart

      This is a problem about implementing a 2D coordinate axis visualization using SVG in JavaScript.

    • Meet the Team

      Welcome to Week 1 of our Data Visualization course!

    • Wrapping up Week 1

      This week, we explored the 10 key charts that form the foundation of this course, demonstrating the breadth of data visualization. We implemented a JavaScript-based histogram using CSS and SVG for dynamic rendering.

  • Week 2

    BinTree D3BarChart

    • BinTree

      In this video, we first drew a binary tree and then made a small modification. These small changes will make a big difference for the visual learning experience.

    • D3BarChart

      This video provides an overview of D3 and histogram plotting.

    • Wrapping up Week 2

      This week, we explored the foundational techniques for web-based visualization, including: Core SVG elements (<rect>, <line>, <text>) D3.js as the standard library for datav.

  • Week 3

    PieCharts ForceDirectedGraph

    • PieCharts

      Let's learn about pie charts together; they can be easily adapted into donut charts and rose diagrams.

    • ForceDirectedGraph

      This is a force-directed graph that represents relational data. It can be utilized in various domains such as character relationships, social networks, and knowledge graphs.

    • Wrapping up Week 3

      d3.pie and d3.forceSimulation

  • Week 4

    TreeMap WordCloud

    • WordCloud

      Word clouds are widely used in big data and data analysis posters. Font size shows the quantity each word represents.

    • TreeMap

      Tree maps are great for showing hierarchical data like categories, org charts, and more. Give it a try! The site has 7 types of tree maps. Visit https://cuc.yingshinet.com/v7/ch6/.

    • Wrapping up Week 4

      d3.tree and d3.hierarchy. d3.layout.cloud.js and d3.layout.ruyicloud.js.

  • Week 5

    Conture-Density Threejs-Intro

    • Conture-Density

      This video, we'll learn about contour and density plots. Contour plots are great for geographic data. Density plots show non-parametric density estimates and look like contour plots. The input data for both is different.

    • Threejs-Intro

      This is a quick intro to Three.js. 3D graphics look amazing, but they’re a bit trickier to create than 2D and can make web pages load slower.

    • Wrapping up Week 5

      (1) d3.conture and d3.conture-density (2) Three.js

  • Week 6

    ThreeJS-BarCharts Flask+MySQL+D3JS

    • ThreeJS-BarCharts

      Let's create a scene combining various basic 3D shapes. In 3D visualization, data can be mapped to the height of cylinders, the radius of spheres, and other attributes.

    • Flask+MySQL+D3JS

      Flask+MySQL+D3JS

    • Wrapping Up Week 6

      About Three.js and Data Visualization in Software.

    • A summary about D3.js.

      D3.js is the JavaScript library for bespoke data visualization, allowing you to create custom dynamic visualizations with unparalleled flexibility. Let's do a small exercise to see if you've understood D3.js. Congratulations!

    • Check your knowledge

      As we summarize this course, test your understanding with these interactive multiple-choice questions.

When would you like to start?

Start straight away and join a global classroom of learners. If the course hasn’t started yet you’ll see the future date listed below.

  • Available now

Learning on this course

On every step of the course you can meet other learners, share your ideas and join in with active discussions in the comments.

What will you achieve?

By the end of the course, you‘ll be able to...

  • Certification in Data Visualization: Demonstrates your proficiency in web-based interactive data visualization. You are skilled in creating histograms, pie charts, force-directed graphs, tree maps, word clouds, contour maps, and simple 3D barcharts.
  • You can proficiently use D3.js to create visualizations for web pages, which can be embedded into software projects or used to develop interactive data journalism pages.
  • Use color and layout to design visually appealing and effective visualization pages.

Who is the course for?

This course is designed for anyone interested in data visualisation with knowledge of at least one programming language.

It will be particularly useful for undergraduate and graduate students in Computer Science, Data Science, Data Journalism, Computational Advertising, Digital Media Technology, Digital Media Art, or related professionals.

What software or tools do you need?

D3.js, JavaScript, SVG, CSS, HTML

Who will you learn with?

Associate Professor at the School of Computer and Cyber Sciences, Communication University of China, holds a Ph.D. from Beihang University. Her research interests include data visualization and AIGC.

Who developed the course?

Communication University of China

The Communication University of China (CUC) is one of the China’s key universities included in 211 Project and “985 Project Innovation Platform” under the Double First-Class Initiative, which is directly administered by the Ministry of Education. CUC was the first communication university founded in 1954 . In August 2004, it was renamed from Beijing Broadcasting Institute to Communication University of China.

Ways to learn

Subscribe & save

Buy this course

Limited access

Choose the best way to learn for you!

$349.99 for one year

Automatically renews

$79/one-off payment

Free

Develop skills to further your careerFulfill your current learning needSample the course materials
Access to this courseticktick

Access expires 30 May 2025

Access to 1,000+ coursestickcrosscross
Learn at your own paceticktickcross
Discuss your learning in commentstickticktick
Tests to check your learningticktickcross
Certificate when you're eligibleDigital onlyPrinted and digitalcross
Continue & Upgrade

Cancel for free anytime

Ways to learn

Choose the best way to learn for you!

Buy this course

$79/one-off payment

Fulfill your current learning need

  • Access to this course
  • Learn at your own pace
  • Discuss your learning in comments
  • Tests to boost your learning
  • Printed and digital certificate when you’re eligible

Subscribe & save

$349.99 for one year

Automatically renews

Develop skills to further your career

  • Access to this course
  • Access to 1,000+ courses
  • Learn at your own pace
  • Discuss your learning in comments
  • Tests to boost your learning
  • Digital certificate when you're eligible

Cancel for free anytime

Limited access

Free

Sample the course materials

  • Access expires 30 May 2025

Find out more about certificates, Unlimited or buying a course (Upgrades)

Learning on FutureLearn

Your learning, your rules

  • Courses are split into weeks, activities, and steps to help you keep track of your learning
  • Learn through a mix of bite-sized videos, long- and short-form articles, audio, and practical activities
  • Stay motivated by using the Progress page to keep track of your step completion and assessment scores

Join a global classroom

  • Experience the power of social learning, and get inspired by an international network of learners
  • Share ideas with your peers and course educators on every step of the course
  • Join the conversation by reading, @ing, liking, bookmarking, and replying to comments from others

Map your progress

  • As you work through the course, use notifications and the Progress page to guide your learning
  • Whenever you’re ready, mark each step as complete, you’re in control
  • Complete 90% of course steps and all of the assessments to earn your certificate

Want to know more about learning on FutureLearn? Using FutureLearn

Do you know someone who'd love this course? Tell them about it...