Course Introduction

Project demonstration

Data visualization concepts

Introduction to ECharts

Get started quickly with ECharts

Explanation of related configuration items

Basic implementation and common effects of bar charts

General configuration_title related configuration

General configuration_tooltip related configuration

General configuration_toolbox related configuration

General configuration_legend related configuration

Basic implementation of line chart

Common effects of line charts 1

Common effects of line charts 2

Basic implementation of scatter plot

Common effects of scatter plots

Common configuration grid of rectangular coordinate system

Common configuration axis of rectangular coordinate system

Commonly used configurations of rectangular coordinate systems dataZoom

Basic implementation of pie chart

Common effects of pie charts

Basic implementation and common configurations of maps

Common map effects_display a map of a province

Common map effects_show air quality

Common effects of maps_combination of maps and scatter plots

Implementation of Radar Chart

Implementation of dashboard

Summary of ECharts basics

Theme usage

Color palettes and color gradients

Use of direct styles and highlight styles

Implementation of chart adaptation

Implementation of chart loading animation

Explanation of chart incremental animation

Chart animation configuration items

Common methods of global ECharts objects 1

Common methods of global ECharts objects 2

Common methods of echartsInstance object 1

Common methods of echartsInstance object 2

ECharts Advanced Summary

Introduction to Koa2

Getting started quickly with Koa2

Features of Koa2 middleware

Backend Project_Project Preparation

Backend project_Total time-consuming development of middleware

Backend project_development of response header middleware

Backend project_development of business logic middleware

Backend project_cross-domain configuration

Front-end project_project creation and preparation

Front-end project_merchant sales statistics_component structure and layout structure

Front-end project_merchant sales statistics_chart basic functions

Front-end project_Merchant sales statistics_implementation of dynamic refresh

Front-end project_merchant sales statistics_UI adjustment 1

Front-end project_merchant sales statistics_UI adjustment 2

Front-end project_merchant sales statistics_split option

Front-end project_merchant sales statistics_resolution adaptation

Front-end project_sales trend chart_general code structure

Front-end project_sales trend chart_display of basic chart

Front-end project_sales trend chart_UI adjustment

Front-end project_sales trend chart_implementation of switching chart

Front-end project_sales trend chart_resolution adaptation

Front-end project_Merchant map distribution_Display map

Front-end project_Merchant map distribution_Show scatter points

Front-end project_Merchant map distribution_UI adjustment

Front-end project_Merchant map distribution_Resolution adaptation

Front-end project_Merchant map distribution_Map click effect

Front-end project_sales ranking chart_display of basic chart

Front-end project_sales ranking chart_UI adjustment

Front-end project_sales ranking chart_translation animation effect

Front-end project_sales ranking chart_resolution adaptation

Front-end project_proportion of hot-selling products_display of basic charts

Front-end project_proportion of hot-selling products_data switching

Front-end project_proportion of hot-selling products_UI adjustment

Front-end project_Proportion of hot-selling products_Resolution adaptation

Front-end project_inventory sales module_display of basic charts

Front-end project_inventory sales module_UI adjustment

Front-end project_inventory sales module_switching animation

Front-end project_inventory sales module_resolution adaptation

Basic use of WebSocket_backend

Basic use of WebSocket_front end

Transformation of back-end projects

Conventions on front-end and back-end data fields

Processing when the backend receives data

Front-end code transformation_Connect to server

Front-end code transformation_processing received data

Front-end code transformation_component transformation

Front-end code transformation_optimization

Detail processing_component merging

Detail processing_full screen switching_layout style

Detail processing_full screen switching_click event processing

Detail processing_full screen switching_linkage effect

Detail processing_theme switching_chart theme

Detail processing_theme switching_definition data

Detail processing_theme switching_native HTML switching

Detail processing_theme switching_linkage effect