149Echarts - 旭日图(Drink Flavors)

2023-10-11 00:59

本文主要是介绍149Echarts - 旭日图(Drink Flavors),希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

效果图

在这里插入图片描述

源代码
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>ECharts</title><!-- 引入 echarts.js --><script src="js/echarts.min.js"></script><script src="js/jquery-1.11.0.min.js"></script><script src="dist/extension/dataTool.js"></script></head><body><!-- 为ECharts准备一个具备大小(宽高)的Dom --><div id="main" style="width: 1024px;height:768px;"></div><script type="text/javascript">// 基于准备好的dom,初始化echarts实例var myChart = echarts.init(document.getElementById('main'));var option;
var data = [{name: 'Flora',itemStyle: {color: '#da0d68'},children: [{name: 'Black Tea',value: 1,itemStyle: {color: '#975e6d'}}, {name: 'Floral',itemStyle: {color: '#e0719c'},children: [{name: 'Chamomile',value: 1,itemStyle: {color: '#f99e1c'}}, {name: 'Rose',value: 1,itemStyle: {color: '#ef5a78'}}, {name: 'Jasmine',value: 1,itemStyle: {color: '#f7f1bd'}}]}]
}, {name: 'Fruity',itemStyle: {color: '#da1d23'},children: [{name: 'Berry',itemStyle: {color: '#dd4c51'},children: [{name: 'Blackberry',value: 1,itemStyle: {color: '#3e0317'}}, {name: 'Raspberry',value: 1,itemStyle: {color: '#e62969'}}, {name: 'Blueberry',value: 1,itemStyle: {color: '#6569b0'}}, {name: 'Strawberry',value: 1,itemStyle: {color: '#ef2d36'}}]}, {name: 'Dried Fruit',itemStyle: {color: '#c94a44'},children: [{name: 'Raisin',value: 1,itemStyle: {color: '#b53b54'}}, {name: 'Prune',value: 1,itemStyle: {color: '#a5446f'}}]}, {name: 'Other Fruit',itemStyle: {color: '#dd4c51'},children: [{name: 'Coconut',value: 1,itemStyle: {color: '#f2684b'}}, {name: 'Cherry',value: 1,itemStyle: {color: '#e73451'}}, {name: 'Pomegranate',value: 1,itemStyle: {color: '#e65656'}}, {name: 'Pineapple',value: 1,itemStyle: {color: '#f89a1c'}}, {name: 'Grape',value: 1,itemStyle: {color: '#aeb92c'}}, {name: 'Apple',value: 1,itemStyle: {color: '#4eb849'}}, {name: 'Peach',value: 1,itemStyle: {color: '#f68a5c'}}, {name: 'Pear',value: 1,itemStyle: {color: '#baa635'}}]}, {name: 'Citrus Fruit',itemStyle: {color: '#f7a128'},children: [{name: 'Grapefruit',value: 1,itemStyle: {color: '#f26355'}}, {name: 'Orange',value: 1,itemStyle: {color: '#e2631e'}}, {name: 'Lemon',value: 1,itemStyle: {color: '#fde404'}}, {name: 'Lime',value: 1,itemStyle: {color: '#7eb138'}}]}]
}, {name: 'Sour/\nFermented',itemStyle: {color: '#ebb40f'},children: [{name: 'Sour',itemStyle: {color: '#e1c315'},children: [{name: 'Sour Aromatics',value: 1,itemStyle: {color: '#9ea718'}}, {name: 'Acetic Acid',value: 1,itemStyle: {color: '#94a76f'}}, {name: 'Butyric Acid',value: 1,itemStyle: {color: '#d0b24f'}}, {name: 'Isovaleric Acid',value: 1,itemStyle: {color: '#8eb646'}}, {name: 'Citric Acid',value: 1,itemStyle: {color: '#faef07'}}, {name: 'Malic Acid',value: 1,itemStyle: {color: '#c1ba07'}}]}, {name: 'Alcohol/\nFremented',itemStyle: {color: '#b09733'},children: [{name: 'Winey',value: 1,itemStyle: {color: '#8f1c53'}}, {name: 'Whiskey',value: 1,itemStyle: {color: '#b34039'}}, {name: 'Fremented',value: 1,itemStyle: {color: '#ba9232'}}, {name: 'Overripe',value: 1,itemStyle: {color: '#8b6439'}}]}]
}, {name: 'Green/\nVegetative',itemStyle: {color: '#187a2f'},children: [{name: 'Olive Oil',value: 1,itemStyle: {color: '#a2b029'}}, {name: 'Raw',value: 1,itemStyle: {color: '#718933'}}, {name: 'Green/\nVegetative',itemStyle: {color: '#3aa255'},children: [{name: 'Under-ripe',value: 1,itemStyle: {color: '#a2bb2b'}}, {name: 'Peapod',value: 1,itemStyle: {color: '#62aa3c'}}, {name: 'Fresh',value: 1,itemStyle: {color: '#03a653'}}, {name: 'Dark Green',value: 1,itemStyle: {color: '#038549'}}, {name: 'Vegetative',value: 1,itemStyle: {color: '#28b44b'}}, {name: 'Hay-like',value: 1,itemStyle: {color: '#a3a830'}}, {name: 'Herb-like',value: 1,itemStyle: {color: '#7ac141'}}]}, {name: 'Beany',value: 1,itemStyle: {color: '#5e9a80'}}]
}, {name: 'Other',itemStyle: {color: '#0aa3b5'},children: [{name: 'Papery/Musty',itemStyle: {color: '#9db2b7'},children: [{name: 'Stale',value: 1,itemStyle: {color: '#8b8c90'}}, {name: 'Cardboard',value: 1,itemStyle: {color: '#beb276'}}, {name: 'Papery',value: 1,itemStyle: {color: '#fefef4'}}, {name: 'Woody',value: 1,itemStyle: {color: '#744e03'}}, {name: 'Moldy/Damp',value: 1,itemStyle: {color: '#a3a36f'}}, {name: 'Musty/Dusty',value: 1,itemStyle: {color: '#c9b583'}}, {name: 'Musty/Earthy',value: 1,itemStyle: {color: '#978847'}}, {name: 'Animalic',value: 1,itemStyle: {color: '#9d977f'}}, {name: 'Meaty Brothy',value: 1,itemStyle: {color: '#cc7b6a'}}, {name: 'Phenolic',value: 1,itemStyle: {color: '#db646a'}}]}, {name: 'Chemical',itemStyle: {color: '#76c0cb'},children: [{name: 'Bitter',value: 1,itemStyle: {color: '#80a89d'}}, {name: 'Salty',value: 1,itemStyle: {color: '#def2fd'}}, {name: 'Medicinal',value: 1,itemStyle: {color: '#7a9bae'}}, {name: 'Petroleum',value: 1,itemStyle: {color: '#039fb8'}}, {name: 'Skunky',value: 1,itemStyle: {color: '#5e777b'}}, {name: 'Rubber',value: 1,itemStyle: {color: '#120c0c'}}]}]
}, {name: 'Roasted',itemStyle: {color: '#c94930'},children: [{name: 'Pipe Tobacco',value: 1,itemStyle: {color: '#caa465'}}, {name: 'Tobacco',value: 1,itemStyle: {color: '#dfbd7e'}}, {name: 'Burnt',itemStyle: {color: '#be8663'},children: [{name: 'Acrid',value: 1,itemStyle: {color: '#b9a449'}}, {name: 'Ashy',value: 1,itemStyle: {color: '#899893'}}, {name: 'Smoky',value: 1,itemStyle: {color: '#a1743b'}}, {name: 'Brown, Roast',value: 1,itemStyle: {color: '#894810'}}]}, {name: 'Cereal',itemStyle: {color: '#ddaf61'},children: [{name: 'Grain',value: 1,itemStyle: {color: '#b7906f'}}, {name: 'Malt',value: 1,itemStyle: {color: '#eb9d5f'}}]}]
}, {name: 'Spices',itemStyle: {color: '#ad213e'},children: [{name: 'Pungent',value: 1,itemStyle: {color: '#794752'}}, {name: 'Pepper',value: 1,itemStyle: {color: '#cc3d41'}}, {name: 'Brown Spice',itemStyle: {color: '#b14d57'},children: [{name: 'Anise',value: 1,itemStyle: {color: '#c78936'}}, {name: 'Nutmeg',value: 1,itemStyle: {color: '#8c292c'}}, {name: 'Cinnamon',value: 1,itemStyle: {color: '#e5762e'}}, {name: 'Clove',value: 1,itemStyle: {color: '#a16c5a'}}]}]
}, {name: 'Nutty/\nCocoa',itemStyle: {color: '#a87b64'},children: [{name: 'Nutty',itemStyle: {color: '#c78869'},children: [ {name: 'Peanuts',value: 1,itemStyle: {color: '#d4ad12'}}, {name: 'Hazelnut',value: 1,itemStyle: {color: '#9d5433'}}, {name: 'Almond',value: 1,itemStyle: {color: '#c89f83'}}]}, {name: 'Cocoa',itemStyle: {color: '#bb764c'},children: [{name: 'Chocolate',value: 1,itemStyle: {color: '#692a19'}}, {name: 'Dark Chocolate',value: 1,itemStyle: {color: '#470604'}}]}]
}, {name: 'Sweet',itemStyle: {color: '#e65832'},children: [{name: 'Brown Sugar',itemStyle: {color: '#d45a59'},children: [{name: 'Molasses',value: 1,itemStyle: {color: '#310d0f'}}, {name: 'Maple Syrup',value: 1,itemStyle: {color: '#ae341f'}}, {name: 'Caramelized',value: 1,itemStyle: {color: '#d78823'}}, {name: 'Honey',value: 1,itemStyle: {color: '#da5c1f'}}]}, {name: 'Vanilla',value: 1,itemStyle: {color: '#f89a80'}}, {name: 'Vanillin',value: 1,itemStyle: {color: '#f37674'}}, {name: 'Overall Sweet',value: 1,itemStyle: {color: '#e75b68'}}, {name: 'Sweet Aromatics',value: 1,itemStyle: {color: '#d0545f'}}]
}];option = {title: {text: 'WORLD COFFEE RESEARCH SENSORY LEXICON',subtext: 'Source: https://worldcoffeeresearch.org/work/sensory-lexicon/',textStyle: {fontSize: 14,align: 'center'},subtextStyle: {align: 'center'},sublink: 'https://worldcoffeeresearch.org/work/sensory-lexicon/'},series: {type: 'sunburst',highlightPolicy: 'ancestor',data: data,radius: [0, '95%'],sort: null,levels: [{}, {r0: '15%',r: '35%',itemStyle: {borderWidth: 2},label: {rotate: 'tangential'}}, {r0: '35%',r: '70%',label: {align: 'right'}}, {r0: '70%',r: '72%',label: {position: 'outside',padding: 3,silent: false},itemStyle: {borderWidth: 3}}]}
};myChart.setOption(option);</script></body></html>

这篇关于149Echarts - 旭日图(Drink Flavors)的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/184380

相关文章

地平线旭日X3开发板--摄像头驱动是否可以支持v4l2接口?

mipi摄像头,除了调用HB_VIN接口外,是否能支持v4l2接口 ? 因为当前HB_VIN接口是非开源的,很多东西无法看到,也没法改动。 现在有这样的需求,每一帧图像除了分辨率等信息之外, 需要加入更多的图像其他信息,现在好像我无法改动这部分的内容。 比如除了获得一帧图像之外,还要获得该帧图像的时间戳、增益和曝光时间等其他标识信息。 官方回复 目前不支持

地平线旭日X3开发板跑分测试

前言 一般拿到手机或者电脑后评测时我们喜欢跑跑分,可以看看战胜了多少网友。 而对于这个国产旭日x3的CPU自然也想看看到底和国际大厂的类似CPU性能是否有差异, 所以实际测试看看。 从最终的测试结果来看是不失所望的,本CPU和配置一致的iMx8M性能是一样的, 测试数值甚至高了一点,所以完全不用怀疑本CPU的性能还有5T算力的BPU,强悍妥妥的, 后面跑AI一点都不用心虚,放肆造!发烧

地平线旭日X3开发板编译USB网卡驱动 AX88772B

由于使用的激光雷达是网口输出的, 为了不占用X3派已有的网口,接上去了一个绿联的usb网卡, 发现系统没有驱动,所以动手看看能不能自己编译一个 首先lsusb查看一下网卡型号 发现型号是AX88772B,去官网看了一下,发现官方提供驱动 AX88772B - Low-Power USB 2.0 to Fast Ethernet Controller | ASIX 下

人体跟随小车(旭日x3派,yolov5,ros2)

最终现象 人体跟随 策略 底盘主控是stm32f103c8t6,读取左右轮编码器并标定速度,读取mpu6050的yaw值一并传至上位机。上位机通过usb摄像头捕获图像,送入模型进行推理,根据得到的结果生成控制指令下发给底盘进行人体跟随。

Echarts绘制差异代谢产物分类与KEGG通路分类的旭日图

文章目录 前言数据准备工作绘图excel旭日图的绘制ECharts旭日图的绘制ECharts旭日图菜鸟编辑器修改后的旭日图 附演示代码 前言 整理实验数据,进行可视化,旭日图有利于简洁明了的展示多层次结构 数据准备工作 对公司返回回来的代谢组结果进行整理,在MSMS二级质谱结果中找到需要分析组别的csv格式文件,直接用excel打开(p值过滤后的数据) 在总表的结

(助力国赛)美赛O奖数学建模可视化!!!含代码2(箱型图、旭日图、直方图、三元图、平行坐标图、密度图、局部放大图)

众所周知,数学建模的过程中,将复杂的数据和模型结果通过可视化图形呈现出来,不仅能够帮助我们更深入地理解问题,还能够有效地向评委展示我们的研究成果。   今天,承接《可视化代码1》,作者将与大家分享《可视化代码2》,内含9种强大的数学建模可视化图形及其在实际问题中的应用,包含如下图形:“箱型图”、“旭日图”、“直方图”、“三元图”、“平行坐标图”、“密度图”、“局部放大图”。   如果阅者喜欢

视觉循迹小车(旭日x3派、opencv)

基于旭日x3派的视觉循迹小车,未完全实现,参考:https://developer.horizon.cc/forumDetail/146176819622746404 效果硬件视觉循迹原理python代码 效果 硬件 1、旭日x3派(烧录好系统镜像) 2、USB摄像头 3、TB6612 4、小车底盘(直流电机或直流减速电机) 视觉循迹原理 x3派读取摄

echarts 旭日图 层级嵌套

基础的可以直接参考官网进行配置。 Echarts旭日图的特点如下: 1 层次结构展示:旭日图适用于展示层次结构数据,通过不同的扇形区域来表示不同层次的数据。每个扇形区域的大小和位置表示了数据的大小和层次关系。 2 渐进式呈现:旭日图支持渐进式呈现,可以通过交互操作逐步展开或收缩各个层次结构,使得用户可以更加深入地了解数据的细节。 3 编码多个维度:旭日图可以编码多个维度的数据,通过扇形区域

【开源项目揭秘】yshop-drink:一站式扫码点餐系统,赋能餐饮业数字化升级

一、项目概述 随着移动互联网的普及,扫码点餐已成为餐饮业提升服务效率、优化顾客体验的重要手段。今天我们要介绍的开源项目——yshop-drink,是一款专为餐饮业打造的一站式扫码点餐系统。本篇文章将详解该项目的安装流程、核心特点以及应用场景,助力餐饮商家轻松实现数字化转型。 二、项目安装与部署 1. 环境准备 确保您的服务器已安装Node.js环境(建议使用v14.x以上版本)以及MySQL

视觉循迹小车(旭日x3派、摄像头、循迹)

1、旭日x3派(烧录好系统镜像) 2、USB摄像头 3、TB6612 4、小车底盘(直流电机或直流减速电机)   视觉循迹原理 x3派读取摄像头图像,转换成灰度图像,从灰度图像中选择第 120 行(图像的一个水平线),遍历第120行的全部320列,根据像素值小于或大于阈值,将相应的值(0 或 1)添加到 date 列表中。最后根据小于阈值的像素个数和它们的总和来判断黑色赛道的位置,以此