使用高级 CSS 条形图构建静态投资组合

在本教程中，我们将构建另一个有吸引力的静态投资组合页面，这一次以纯CSS条形图为特色，不使用任何外部JavaScript库、SVG或canvas元素！我们正在建造什么这是我们将要创建的项目：SeethePen ASimple,StaticPortfolioPagebyEnvatoTuts+(@tuts...

如何使用JavaScript和HTML5 Canvas绘制条形图

在之前的教程中，我们介绍了如何使用HTML5画布绘制饼图或圆环图。在本教程中，我将向您展示如何使用JavaScript和html 5画布作为使用条形图以图形方式显示数据的方法。但是，如果您想知道创建这样的库需要什么，本教程适合您。什么是条形图？条形图是用于表示数值数据的非常常用的工具。从财务报告到PowerPoint演示文稿再到...

使用Plotly.js创建交互式图表第3部分：条形图

在我们的上一个教程中，您学习了如何在Plotly.js中创建折线图。折线图的每个方面，例如要绘制的数据以及连接绘制点的线条的形状或颜色，都可以使用一组属性进行控制。Plotly.js允许您以类似的方式创建条形图。 在本教程中，您将学习如何使用Plotly.js创建不同类型的条形图。我还将讨论如何使用特定属性来控制这些图表的外观，...

免费好用的JavaScript图表库

数据就在我们身边。我们用它来优化性能、提供服务和提高效率。然而，原始数字并不总是传递信息的最佳方式。如果数据是视觉格式而不是文本格式，人们更有可能保留您呈现给他们的任何数据。这使得图表成为共享信息不可或缺的工具。JavaScript提供了许多免费库，您可以使用它们在您的网站上创建图表。在这篇文章中，我们将创建一个最好的免费JavaScript...

使用方差图在浏览器中更轻松的可视化数据

今天，我们将深入研究方差图；一种独特的基于javascript的“图形语法”，它提供了一种抽象的、声明性的标记样式来创建原本相当复杂的图表。VarianceCharts介于D3.js和HighCharts之间，提供了灵活性，同时保留了平易近人的语法。使用方差图不依赖于对JavaScript的更深入了解。让我们来看看！获取图书馆Varian...

Chart.js 入门：雷达和极地区域图

在本教程中，您将了解可以使用Chart.js创建的两种新图表类型：雷达图和极地图。就像之前的教程一样，我们将从图表类型的简要概述开始，然后进行更详细的讨论。创建雷达图当您只想比较大量对象的一个或两个属性时，折线图和条形图非常有用，例如，亚洲所有***的人口或大气中不同污染物的数量。假设您只想比较三种不同液体的密度、不透明度、粘度、折射率和沸点。为...