diff --git a/.dumi/theme/locales/en.json b/.dumi/theme/locales/en.json deleted file mode 100644 index 90d13735b..000000000 --- a/.dumi/theme/locales/en.json +++ /dev/null @@ -1,338 +0,0 @@ -{ - "蚂蚁数据可视化": "AntV", - "·让AGI栩栩如生": "· Liven AGI Lively", - "蚂蚁集团全新一代数据可视化解决方案": "A new generation of data visualization solution from Ant Group", - "AntV 是蚂蚁集团全新一代数据可视化解决方案,致力于提供一套简单方便、专业可靠、无限可能的数据可视化最佳实践。": "AntV is a new generation of data visualization solution from Ant Group. We provide best practices of data visualization with simplicity, convenience, profession, reliability, and infinite possibilities.", - "立业・利业": "Found business・Help business", - "了解我们": "More about Us", - "更新": "Update", - "我们是蚂蚁集团数据可视化团队,一群有爱有梦的人,怀揣「让人们在数据世界里获得视觉化思考能力」的梦想前行,成就智能时代全球领先的数据可视化解决方案。": "We're the Data Visualization Team of Ant Group, a group of dreamers who move forward with the dream of getting people to think visually in the data world to become the world's leading data visualization solution in the smart age.", - "关于我们": "About Us", - "最新资讯": "News", - "L7 发布新版本,让地图动起来!": "L7 has published the new version!", - "推荐": "Recommend", - "Kitchen 3.75,效率大幅提升!": "Kitchen 3.75, lift your efficient!", - "我们的产品": "Our Products", - "基础产品": "Basic Products", - "扩展产品": "Extensions", - "图表示例": "Examples", - "API 文档": "API Documents", - "G2 可视化图形语法": "G2 - Grammar of Graphics", - "以数据驱动,具有高度的易用性和扩展性的可视化图形语法。": "A data driven grammar of Graphics for visualization with usability and scalability.", - "G6 图可视化引擎": "G6 - A Graph Vis Engine", - "一套便捷的关系数据可视化引擎与图分析工具。": "A handy graph visualization engine and analysis tool for relational data.", - "F2 移动端可视化方案": "F2 - A Vis Solution for Mobile", - "一套为移动而生,开箱即用的可视化解决方案。": "An visualization solution out of the box for mobile.", - "L7 地理空间数据可视化": "L7 - For Geospacial Data Vis", - "一套高性能,高渲染质量的地理空间数据可视化框架。": "A geospacial data visualization framework with high performance and rendering quality.", - "g2plot": "g2plot", - "开箱即用、易于配置、具有良好视觉和交互体验的通用图表。": "G2plot is an interactive and responsive charting library based on the grammar of graphics.", - "Graphin": "Graphin", - "ChartCube": "ChartCube", - "AntV 在线图表解决方案 让你拖拖拽拽搞定图表制作。": "AntV online chart generator, making charts with extremely simple interactions.", - "工具和资源": "Tools and Resources", - "图表用法": "Usages", - "从数据出发,从功能角度对常见图表进行分类,提供规范使用指引。": "We classified the charts by their data features and provided the usage guidelines.", - "设计原则": "Design", - "设计价值观": "Design", - "对数据图形进行拆解、提炼,抽象出一套数据图形可视化交互视觉规范。": "We provide a set of visualization design principles by decomposing and abstracting of visualization graphics.", - "工具资源": "Resources", - "在进行模式、组件和语言的整理过程中发现的优秀书籍和资源。": "We recommend some excellent books and resources during the our daily work.", - "查看详情": "Details", - "AntV 企业级可视化解决方案": "AntV - An Enterprise-level Data Visualization Solution", - "AntV 3.0 已全新升级,主要包含 G2、G6、F2、L7 以及一套完整的图表使用和设计规范。得益于丰富的业务场景和用户需求挑战,AntV 经历多年积累与不断打磨,已支撑阿里集团内外 20000+ 业务系统,通过了日均千万级 UV 产品的严苛考验后方敢与君见。": "AntV 3.0 has been fully upgraded which includes G2, G6, F2, L7, combining with a set of usage and desgin principles for visualization. AntV has supported more than 20,000 business systems inside and outside of Alibaba Group. Polished by rich business scenarios for several years, AntV has the ability to support the products with million user visits. Finally, AntV is ready for you.", - "我们的优势": "Our Advantages", - "简单方便": "Simple and Convenient", - "从数据出发,仅需几行代码可以轻松获得想要的图表展示效果。": "Driven by data, you will get the visualizations with only a few lines of codes.", - "方便可靠": "Reliable", - "大量产品实践之上,提供绘图引擎、完备图形语法,专业设计规范。": "We provide the render engines, the complete implementation of grammar of graphics, and professional design principles for plenty of products.", - "无限可能": "Infinite", - "任何图表,都可以基于图形语法灵活绘制,满足你无限的创意。": "Powered by the grammar of graphics, any charts or diagrams can be flexibly created, which will satisfy your infinite ideas.", - "G2 项目顾问": "Project consultant of G2", - "伊利诺伊大学计算机科学客座教授,H2O.ai 首席科学家,G2 项目顾问": "Visiting professor of Computer Science College, University of Illinois. Chief Scientist of H2O.ai. Project consultant of G2", - "陈为": "Wei Chen", - "浙江大学计算机学院 CAD & CG 国家重点实验室教授": "Professor of State Key Lab of CAD & CG, Zhejiang University", - "在多年可视化设计与开发的积累基础上,蚂蚁金服团队推出了 AntV 产品,这是工业界在基础可视化语法与实践方面发出的最强声音,也是工业界与学术界一道推进可视化研发进展的最佳利器。": "Based on years of design and development, Ant Group launched AntV. It is the strongest voice on basic visualization syntax and industrial practices, and the best tool for advancing the visualization collaboration between industry and academia.", - "林峰": "Feng Lin", - "爱烹饪的可视化攻城狮": "Visualization Developer Who Loves Cooking", - "G2 是面粉,Echarts 是面条,皆微小而美好,因小食材怀大梦想,助力共筹东方巨龙崛起之盛宴,迎四海饕客。": "G2 is the flour, Echarts is the noodle. They are both tiny but beautiful. Tiny ingredients have big dreams, helping to co-sponser the feast of the rise of the Eastern Dragon, and welcoming the guests from all over the world.", - "2000+ 公司正在使用": "2000+ Companies are Using AntV", - "加入我们": "Join Us", - "我们是蚂蚁集团数据可视化团队,一群有爱有梦的人,怀揣「让人们在数据世界里获得视觉化思考能力」的梦想前行,成就智能时代全球领先的数据可视化解决方案,满足与日俱增的数据洞察需求。": "We are the data visualization team from Ant Group, a group of people who have a dream to enpowering people with the visual thinking ability and insight in the world of data.", - "如果你对可视化、图形技术、数据分析充满激情, 无论你是工程师、设计师还是数据分析师,请联系我们,期待你的加入。": "Whatever you are an engineer, a designer, or a data analyser, if you have passion in visualization, graphics techniques, or data analysis, you are the one we are looking for.", - "立即加入": "Join now", - "贡献者名录": "Contributors", - "问题与反馈": "Questions and Feedback", - "任何问题,欢迎到我们的仓库提交相关的 issues。": "If you have any proplem, please commit corresponding issues to our github repositories.", - "立即反馈": "Feedback", - "蚂蚁集团数据可视化团队": "Data Visualization Team from Ant Group", - "「让人们在数据世界里获得视觉化思考能力」": "「Help people fetch the visualized thinking ability in data world.」", - "工程师": "Engineer", - "设计师": "Designer", - "动效设计师": "Animation Designer", - "产品经理": "Product Designer", - "历史贡献者": "Contributors in History", - "查看 demo": "demo", - "全屏显示": "Fullscreen", - "论坛": "Forum", - "第十五届 D2 前端技术论坛·无界": "The 15th D2 Frontend Technology Forum", - - "巴思": "Basi", - "白弦": "Baixian", - "柏愚": "Boyu", - "不过": "Buguo", - "步茗": "Buming", - "沧东": "Cangdong", - "沉鱼": "Chenyu", - "导演": "Daoyan", - "董珊珊": "Shanshan Dong", - "福晋": "Fujin", - "顾己": "Guji", - "顾倾": "Guqing", - "光生": "Guangsheng", - "广知": "Guangzhi", - "画康": "Huakang", - "尽白": "Jinbai", - "镜曦": "Jingxi", - "聚则": "Juze", - "绝云": "Jueyun", - "珂甫": "Kefu", - "林外": "Linwai", - "翎刀": "Lingdao", - "陆沉": "Luchen", - "罗宪": "Luoxian", - "米法": "Mifa", - "芈乐": "Mile", - "幕阑": "Mulan", - "偏右": "Pianyou", - "青湳": "Qingnan", - "轻声": "Qingsheng", - "璆鸣": "Qiuming", - "山果": "Shanguo", - "十吾": "Shiwu", - "拾锋": "Shifeng", - "索丘": "Suoqiu", - "完白": "Wanbai", - "问崖": "Wenya", - "乌诺": "Wunuo", - "象数": "Xiangshu", - "逍为": "Xiaowei", - "萧庆": "Xiaoqing", - "新茗": "Xinming", - "亦叶": "Yiye", - "有田": "Youtian", - "玉伯": "Yubo", - "御术": "Yushu", - "再飞": "Zaifei", - "早弦": "Zaoxian", - "张初尘": "Chuchen Zhang", - "长哲": "Changzhe", - "祯逸": "Zhenyi", - "诸岳": "Zhuyue", - "杍鱼": "Ziyu", - "它山": "Tashan", - - "按使用目的维度": "Usage", - "按图表类型维度": "Chart Type", - "按数据类型维度": "Data Type", - "图表分类": "Visualization Category", - - "分布": "Distribution", - "组成": "Composition", - "占比": "Percentage", - "关系": "Relation", - "流程": "Flow", - "比较": "Comparison", - "趋势": "Trend", - - "基础柱状图": "Basic \nColumn", - "分组柱状图": "Grouped \nColumn", - "堆叠柱状图": "Stacked \nColumn", - "百分比堆\n叠柱状图": "% Stack \nColumn", - "区间柱状图": "Interval \nColumn", - "瀑布图": "Waterfall\n Chart", - "直方图": "Histogram", - "基础条形图": "Basic \nBar Chart", - "堆叠条形图": "Stacked \nBar Chart", - "百分比堆\n叠条形图": "% Stacked\n Bar", - "分组条形图": "Grouped \nBar Chart", - "区间条形图": "Internal \nBar Chart", - "玉珏图": "Radial \nBar Chart", - "对称分组\n条形图": "Symmetric\n Grouped Bar", - "基础饼图": "Basic \nPie Chart", - "环形饼图": "Donut \nChart", - "环图": "Donut", - "嵌套饼图": "Multi-level\n Pie", - "南丁格尔图": "Nightingale", - "基础面积图": "Basic \nArea Chart", - "路径地图": "Path\n Map", - "多折线图": "Multi-Line\n Chart", - "股票k线图": "Stock \nKlines", - "河流图": "Stream\n Chart", - "烛形图": "Candle\n Stick", - "堆叠面积图": "Stacked \nArea Chart", - "区间面积图": "Interval \nArea Chart", - "基础折线": "Basic \nLine Chart", - "百分比堆\n叠面积图": "% Stacked\n Area", - "复合图表\n地图": "Chart Map", - "矩阵树图": "TreeMap", - "散点图": "Scatter Plot", - "散点\n气泡图": "Bubble \nScatter Plot", - "径向系统树": "Radial \nDendrogram", - "环形弧线图": "Circular \nArc Diagram", - "弧线图": "Arc Diagram", - "和弦图": "Chord \nDiagram", - "基础漏斗图": "Basic\n Funnel", - "对比漏斗图": "Compare\n Funnel", - "对称漏斗图": "Symmetric\n Funnel", - "气泡地图": "Bubble Map", - "箱型图": "Bin Chart", - "色块热力图": "Grid\n Heatmap", - "基础热力图": "Basic\n Heatmap", - "仪表盘": "Gauge Graph", - "雷达图": "Radar Chart", - "词云图": "World Cloud", - "紧凑树": "CompactBox", - "系统树": "Dendrogram", - "脑图": "Mindmap", - "缩进树": "Indented", - "辐射树": "Radial Tree", - "流程图": "Flow Diagram", - "Fruchterman\n聚类": "Fruchterman\n Clustering", - "Fruchterman": "Fruchterman", - "力导向图": "Force-\ndirected", - "环形图": "Circular", - "螺旋线图": "Spiral", - "辐射图": "Radial", - "同心圆": "Concentric", - "网格图": "Grid", - "气泡图": "Bubbles", - "定点地图": "Dot Map", - "符号地图": "Symbol\n Layer", - "3D 柱状\n地图": "3D Column\n Map", - "散点地图": "Scatter Map", - "关系地图": "Relation Map", - "3D 弧线地图": "3D Arc Map", - "分类填充图": "Choroplet\n Map", - "聚合地图": "Chart Map", - "蜂窝热力图": "Hexagonal\n Heatmap", - "3D 网格\n热力图": "3D Grid\n Heatmap", - "3D 蜂窝\n热力图": "3D Hex\n Heatmap", - "经典热力图": "Classical\n Heatmap", - "网格\n热力图": "Grid\n Heatmap", - "桑基图": "Sankey", - "自定义\n Maker": "Custom\n Maker", - "等值线地图": "Isoline Map", - "3D 填充地图": "Extrude Map", - "旭日图": "Sunburst\n Diagram", - "圆堆积图": "Polar \nTreemap", - "极坐标树图": "Circle \nPacking", - "分组柱形图": "Stacked Column", - "力导向图布局": "Force-directed Layout", - "堆叠柱形图": "Grouped Column", - - "统计图表": "Statistic", - "关系图": "Graph", - "地图": "Map", - "折线图": "Line Chart", - "其他": "Others", - "面积图": "Area Chart", - "柱状图": "Column Chart", - "条形图": "Bar Chart", - "饼图": "Pie Chart", - "股票": "Stock", - "树图": "Tree", - "点图层": "Point Layer", - "线图层": "Line Layer", - "面图层": "Polygon\n Layer", - "热力图": "Heatmap", - - "关系型": "Relational", - "数值型": "Numeric", - "时序型": "Time Series", - "分类型": "Category", - "地理型": "Geography", - "树": "Tree", - "聚类": "Cluster", - "层次": "Hierarchy", - "层级": "Hierarchy", - "流": "Flow", - "流向": "Flow", - "场景案例": "ShowCase", - "Leland Wilkinson": "Leland Wilkinson", - "I am thrill with G2. It is amazingly faithful to the GG system and has the potential to generate more graphics.": "I am thrill with G2. It is amazingly faithful to the GG system and has the potential to generate more graphics.", - "AntV": "AntV", - "继续了解": "Learn More", - - "3D大图": "3D Chart", - "超强性能": "Super Power", - "叙事动画": "Animation", - "性能飞跃,专业优雅": "Performance Leap, Professional Elegance", - "专家之声": "Expert Voice", - "来自数据可视化专家的专业认可与推荐": "Professional endorsement and recommendation from data visualization experts.", - "丰富图表,选用自如": "Rich Chart, Choose Freely", - "数据驱动,高度易用,可扩展的可视化图形语法": "Data-driven, highly easy to use, extensible visual graphics syntax", - "开箱即用的多维可视分析表格": "Multi-dimensional visual analysis form out of the box.", - "便捷的关系数据可视化引擎与图分析工具": "Convenient relational data visualization engine and graph analysis tool.", - "散点图 (3D图表)": "Scatter Plot (3D Chart)", - "高性能/高渲染质量的地理空间数据可视化框架": "High performance/high render quality geospatial data visualization framework.", - "统计图表 (移动端)": "Statistical Charts (Mobile)", - "专注于移动端的可视化解决方案,兼容 H5/小程序/Weex 等多端环境": "Focus on mobile visualization solutions, compatible with H5/Mini Program/Weex and other multi-terminal environments.", - "树形图表 (移动端)": "Tree Chart (Mobile)", - "思维导图": "Mind Map", - "一款可以快速、流畅运行于移动设备中的图可视化引擎": "A graphical visualization engine that runs fast and smoothly on mobile devices.", - "极易定制、开箱即用、数据驱动的图编辑引擎": "Easy to customize, out of the box, data-driven graph editing engine.", - "树形图表": "Tree Chart", - "地图 (3D图表)": "Map (3D Chart)", - "矩形式树图 (移动端)": "Heat Tree Map (Mobile)", - "智能洞察": "Intelligent Insight", - "图表库": "Chart Base", - "267全系F版": "267 All Series F", - "多维表格": "Dimensions Table", - "移动统计图": "Module Statistical", - "移动关系图": "Module Diagram", - "移动地图": "Module Map", - "常用统计数据": "Common Statistics", - "关系数据": "Relational Data", - "极致移动定制": "Extreme Mobile Customization", - "设计语言": "Design", - "图表引擎": "Chart Engine", - "拷贝代码": "Copy", - "规范下载": "Download", - "定制主题,一键生成": "Custom Theme, One Click Generation", - "copy 主题": "Copy Theme", - "已复制": "Copied", - "自定主题": "Custom", - "活动战报": "Report", - "数据监控": "Monitoring", - "日常分析": "Analysis", - "开始使用": "Start", - "·让数据栩栩如生": "· Make Data Come To Life", - "让普通应用低成本享受 Serverless 体验,帮助企业降本增效!": "Let General application enjoy Serverless experience at low cost, help enterprises reduce costs and increase efficiency!", - "产品首页": "HomePage", - "使用文档": "Docs", - "伊利诺伊大学计算机科学客座教授H2O.ai 首席科学家,G2 项目顾问": "Visiting Professor of Computer Science at the University of Illinois, Principal Scientist at H2O.ai and Advisor to the G2 project.", - "在多年可视化设计与开发的基础上,蚂蚁金服推出了 AntV 产品,这是工业界基础可视化语法与实践方面发出的最强声音,也是工业界与学术界一道推进可视化研发进展的最佳利器。": "Building on years of visualization design and development, Ant Financial launched AntV, the industry's strongest voice in basic visualization grammar and practice, and the best tool for industry to work with academia to advance visualization research and development.", - "设计,让数据美而简单,让可视化更普惠。好策略、好资产助力好报表、好产品。": "Design, make the data beautiful and simple, make the visualization more inclusive. Good strategy, good assets help good reports, good products.", - "用户总量": "Total", - "3D 可视化图": "3D Visual Chart", - "渲染器运行时切换": "Renderer Runtime Switch", - "分面帧动画": "Faceted Frame Animation", - - "分类色板": "Classification Color Palette", - "单一顺序色板": "Single Sequential Color Palette", - "邻近顺序色板": "Adjacent Sequential Color Palette", - "发散色板": "Diverge Color Palette", - "主要用于描述分类数据,如苹果、香蕉、梨,常用一个颜色代表一个值以区分不同类型,取色时色相分布均衡,相邻颜色之间明暗需考虑差异性,常用于饼图的不同分类、填充地图中的不同国家、关系图中的不同角色等。": "It is mainly used to describe classified data, such as apples, bananas, pears, usually a color represents a value to distinguish different types, the color distribution is balanced, the difference between adjacent colors should be considered between the light and dark, often used for different pie chart classification, filling different countries in the map, different roles in the relationship chart, etc.", - "单色顺序色板,均基于分类色板生长而来,一般使用同一色相,通过明度或饱和度的渐变,常用来表示同一事物中的数值大小或梯度变化,如排行榜等级变化、一个国家或地区的新增人口数对比、风险等级变化等。": "Monochromatic sequential color palette, all based on the growth of classification swatches, generally use the same hue, through the gradual change of brightness or saturation, commonly used to represent the numerical size or gradient change in the same thing, such as ranking changes, comparison of the number of new people in a country or region, risk level changes, etc.", - "邻近顺序色板,均基于分类色板生长而来,为加大辨识度也可使用邻近色相,通过明度或饱和度的渐变,常用来表示同一事物中的数值大小或梯度变化,如排行榜等级变化、一个国家或地区的新增人口数对比、风险等级变化等。": "Adjacent sequential color palette, all based on the growth of the classification color palette, in order to increase the recognition can also use adjacent colors, through the gradual change of brightness or saturation, commonly used to represent the value size or gradient change in the same thing, such as ranking change, comparison of the number of new population in a country or region, risk level change.", - "点再到正向值的连续变化区间,显示相对立的两个值的大小关系,常用于气温的冷热、海拔高低、股票涨跌等。": "The continuous change interval from the point to the positive value shows the size relationship between the two opposite values, which is often used for the cold and hot temperature, altitude, stock rise and fall, etc.", - "柱形图、饼图、关系图、地图、多维表格等260+丰富图表随心选用": "Column、Pie、Graph、Map、Dimensions Table and other 260+ rich chart choice at will.", - - "设计语言与研发框架": "Design language and R&D framework", - "资产一览,让你快速搭建网站应用": "Assets list, let you quickly build a website application.", - "Ant Design / AntV 设计负责人": "Ant Design / AntV Design Leader", - "地理空间数据": "For Geospacial Data", - "267 全系 F 版": "F2、6、7", - "蚂蚁企业级数据可视化解决方案,让人们在数据世界里获得视觉化思考能力": "Ant enterprise data visualization solutions, so that people in the data world to get the ability to think visually." -} diff --git a/.dumi/theme/locales/zh.json b/.dumi/theme/locales/zh.json deleted file mode 100644 index 1e53d4aa2..000000000 --- a/.dumi/theme/locales/zh.json +++ /dev/null @@ -1,330 +0,0 @@ -{ - "蚂蚁数据可视化": "蚂蚁数据可视化", - "·让AGI栩栩如生": "·让AGI栩栩如生", - "蚂蚁集团全新一代数据可视化解决方案": "蚂蚁集团全新一代数据可视化解决方案", - "AntV 是蚂蚁集团全新一代数据可视化解决方案,致力于提供一套简单方便、专业可靠、无限可能的数据可视化最佳实践。": "AntV 是蚂蚁集团全新一代数据可视化解决方案,致力于提供一套简单方便、专业可靠、无限可能的数据可视化最佳实践。", - "立业・利业": "立业・利业", - "了解我们": "了解我们", - "更新": "更新", - "我们是蚂蚁集团数据可视化团队,一群有爱有梦的人,怀揣「让人们在数据世界里获得视觉化思考能力」的梦想前行,成就智能时代全球领先的数据可视化解决方案。": "我们是蚂蚁集团数据可视化团队,一群有爱有梦的人,怀揣「让人们在数据世界里获得视觉化思考能力」的梦想前行,成就智能时代全球领先的数据可视化解决方案。", - "关于我们": "关于我们", - "最新资讯": "最新资讯", - "L7 发布新版本,让地图动起来!": "L7 发布新版本,让地图动起来!", - "推荐": "推荐", - "Kitchen 3.75,效率大幅提升!": "Kitchen 3.75,效率大幅提升!", - "我们的产品": "我们的产品", - "基础产品": "基础产品", - "扩展产品": "扩展产品", - "图表示例": "图表示例", - "API 文档": "API 文档", - "G2 可视化图形语法": "G2 可视化图形语法", - "以数据驱动,具有高度的易用性和扩展性的可视化图形语法。": "以数据驱动,具有高度的易用性和扩展性的可视化图形语法。", - "G6 图可视化引擎": "G6 图可视化引擎", - "一套便捷的关系数据可视化引擎与图分析工具。": "一套便捷的关系数据可视化引擎与图分析工具。", - "F2 移动端可视化方案": "F2 移动端可视化方案", - "一套为移动而生,开箱即用的可视化解决方案。": "一套为移动而生,开箱即用的可视化解决方案。", - "L7 地理空间数据可视化": "L7 地理空间数据可视化", - "一套高性能,高渲染质量的地理空间数据可视化框架。": "一套高性能,高渲染质量的地理空间数据可视化框架。", - "g2plot": "g2plot", - "开箱即用、易于配置、具有良好视觉和交互体验的通用图表。": "开箱即用、易于配置、具有良好视觉和交互体验的通用图表。", - "Graphin": "Graphin", - "ChartCube": "ChartCube", - "AntV 在线图表解决方案 让你拖拖拽拽搞定图表制作。": "AntV 在线图表解决方案 让你拖拖拽拽搞定图表制作。", - "工具和资源": "工具和资源", - "图表用法": "图表用法", - "从数据出发,从功能角度对常见图表进行分类,提供规范使用指引。": "从数据出发,从功能角度对常见图表进行分类,提供规范使用指引。", - "设计原则": "设计原则", - "设计价值观": "设计价值观", - "对数据图形进行拆解、提炼,抽象出一套数据图形可视化交互视觉规范。": "对数据图形进行拆解、提炼,抽象出一套数据图形可视化交互视觉规范。", - "工具资源": "工具资源", - "在进行模式、组件和语言的整理过程中发现的优秀书籍和资源。": "在进行模式、组件和语言的整理过程中发现的优秀书籍和资源。", - "查看详情": "查看详情", - "AntV 企业级可视化解决方案": "AntV 企业级可视化解决方案", - "AntV 3.0 已全新升级,主要包含 G2、G6、F2、L7 以及一套完整的图表使用和设计规范。得益于丰富的业务场景和用户需求挑战,AntV 经历多年积累与不断打磨,已支撑阿里集团内外 20000+ 业务系统,通过了日均千万级 UV 产品的严苛考验后方敢与君见。": "AntV 3.0 已全新升级,主要包含 G2、G6、F2、L7 以及一套完整的图表使用和设计规范。得益于丰富的业务场景和用户需求挑战,AntV 经历多年积累与不断打磨,已支撑阿里集团内外 20000+ 业务系统,通过了日均千万级 UV 产品的严苛考验后方敢与君见。", - "我们的优势": "我们的优势", - "简单方便": "简单方便", - "从数据出发,仅需几行代码可以轻松获得想要的图表展示效果。": "从数据出发,仅需几行代码可以轻松获得想要的图表展示效果。", - "方便可靠": "方便可靠", - "大量产品实践之上,提供绘图引擎、完备图形语法,专业设计规范。": "大量产品实践之上,提供绘图引擎、完备图形语法,专业设计规范。", - "无限可能": "无限可能", - "任何图表,都可以基于图形语法灵活绘制,满足你无限的创意。": "任何图表,都可以基于图形语法灵活绘制,满足你无限的创意。", - "G2 项目顾问": "G2 项目顾问", - "伊利诺伊大学计算机科学客座教授,H2O.ai 首席科学家,G2 项目顾问": "伊利诺伊大学计算机科学客座教授,H2O.ai 首席科学家,G2 项目顾问", - "陈为": "陈为", - "浙江大学计算机学院 CAD & CG 国家重点实验室教授": "浙江大学计算机学院 CAD & CG 国家重点实验室教授", - "在多年可视化设计与开发的积累基础上,蚂蚁金服团队推出了 AntV 产品,这是工业界在基础可视化语法与实践方面发出的最强声音,也是工业界与学术界一道推进可视化研发进展的最佳利器。": "在多年可视化设计与开发的积累基础上,蚂蚁金服团队推出了 AntV 产品,这是工业界在基础可视化语法与实践方面发出的最强声音,也是工业界与学术界一道推进可视化研发进展的最佳利器。", - "林峰": "林峰", - "爱烹饪的可视化攻城狮": "爱烹饪的可视化攻城狮", - "G2 是面粉,Echarts 是面条,皆微小而美好,因小食材怀大梦想,助力共筹东方巨龙崛起之盛宴,迎四海饕客。": "G2 是面粉,Echarts 是面条,皆微小而美好,因小食材怀大梦想,助力共筹东方巨龙崛起之盛宴,迎四海饕客。", - "2000+ 公司正在使用": "2000+ 公司正在使用", - "加入我们": "加入我们", - "我们是蚂蚁集团数据可视化团队,一群有爱有梦的人,怀揣「让人们在数据世界里获得视觉化思考能力」的梦想前行,成就智能时代全球领先的数据可视化解决方案,满足与日俱增的数据洞察需求。": "我们是蚂蚁集团数据可视化团队,一群有爱有梦的人,怀揣「让人们在数据世界里获得视觉化思考能力」的梦想前行,成就智能时代全球领先的数据可视化解决方案,满足与日俱增的数据洞察需求。", - "如果你对可视化、图形技术、数据分析充满激情, 无论你是工程师、设计师还是数据分析师,请联系我们,期待你的加入。": "如果你对可视化、图形技术、数据分析充满激情, 无论你是工程师、设计师还是数据分析师,请联系我们,期待你的加入。", - "立即加入": "立即加入", - "贡献者名录": "贡献者名录", - "问题与反馈": "问题与反馈", - "任何问题,欢迎到我们的仓库提交相关的 issues。": "任何问题,欢迎到我们的仓库提交相关的 issues。", - "立即反馈": "立即反馈", - "蚂蚁集团数据可视化团队": "蚂蚁集团数据可视化团队", - "「让人们在数据世界里获得视觉化思考能力」": "「让人们在数据世界里获得视觉化思考能力」", - "工程师": "工程师", - "设计师": "设计师", - "动效设计师": "动效设计师", - "产品经理": "产品经理", - "历史贡献者": "历史贡献者", - "查看 demo": "查看 demo", - "全屏显示": "全屏显示", - "论坛": "论坛", - "第十五届 D2 前端技术论坛·无界": "第十五届 D2 前端技术论坛·无界", - "巴思": "巴思", - "白弦": "白弦", - "柏愚": "柏愚", - "不过": "不过", - "步茗": "步茗", - "沧东": "沧东", - "沉鱼": "沉鱼", - "导演": "导演", - "董珊珊": "董珊珊", - "福晋": "福晋", - "顾己": "顾己", - "顾倾": "顾倾", - "光生": "光生", - "广知": "广知", - "画康": "画康", - "尽白": "尽白", - "镜曦": "镜曦", - "聚则": "聚则", - "绝云": "绝云", - "珂甫": "珂甫", - "林外": "林外", - "翎刀": "翎刀", - "陆沉": "陆沉", - "罗宪": "罗宪", - "米法": "米法", - "芈乐": "芈乐", - "幕阑": "幕阑", - "偏右": "偏右", - "青湳": "青湳", - "轻声": "轻声", - "璆鸣": "璆鸣", - "山果": "山果", - "十吾": "十吾", - "拾锋": "拾锋", - "索丘": "索丘", - "完白": "完白", - "问崖": "问崖", - "乌诺": "乌诺", - "象数": "象数", - "逍为": "逍为", - "萧庆": "萧庆", - "新茗": "新茗", - "亦叶": "亦叶", - "有田": "有田", - "玉伯": "玉伯", - "御术": "御术", - "再飞": "再飞", - "早弦": "早弦", - "张初尘": "张初尘", - "长哲": "长哲", - "祯逸": "祯逸", - "诸岳": "诸岳", - "杍鱼": "杍鱼", - "它山": "它山", - "按使用目的维度": "按使用目的维度", - "按图表类型维度": "按图表类型维度", - "按数据类型维度": "按数据类型维度", - "图表分类": "图表分类", - "分布": "分布", - "组成": "组成", - "占比": "占比", - "关系": "关系", - "流程": "流程", - "比较": "比较", - "趋势": "趋势", - "基础柱状图": "基础柱状图", - "分组柱状图": "分组柱状图", - "堆叠柱状图": "堆叠柱状图", - "百分比堆\n叠柱状图": "百分比堆\n叠柱状图", - "区间柱状图": "区间柱状图", - "瀑布图": "瀑布图", - "直方图": "直方图", - "基础条形图": "基础条形图", - "堆叠条形图": "堆叠条形图", - "百分比堆\n叠条形图": "百分比堆\n叠条形图", - "分组条形图": "分组条形图", - "区间条形图": "区间条形图", - "玉珏图": "玉珏图", - "对称分组\n条形图": "对称分组\n条形图", - "基础饼图": "基础饼图", - "环形饼图": "环形饼图", - "环图": "环图", - "嵌套饼图": "嵌套饼图", - "南丁格尔图": "南丁格尔图", - "基础面积图": "基础面积图", - "路径地图": "路径地图", - "多折线图": "多折线图", - "股票k线图": "股票k线图", - "河流图": "河流图", - "烛形图": "烛形图", - "堆叠面积图": "堆叠面积图", - "区间面积图": "区间面积图", - "基础折线": "基础折线", - "百分比堆\n叠面积图": "百分比堆\n叠面积图", - "复合图表\n地图": "复合图表\n地图", - "矩阵树图": "矩阵树图", - "散点图": "散点图", - "散点\n气泡图": "散点\n气泡图", - "径向系统树": "径向系统树", - "环形弧线图": "环形弧线图", - "弧线图": "弧线图", - "和弦图": "和弦图", - "基础漏斗图": "基础漏斗图", - "对比漏斗图": "对比漏斗图", - "对称漏斗图": "对称漏斗图", - "气泡地图": "气泡地图", - "箱型图": "箱型图", - "色块热力图": "色块热力图", - "基础热力图": "基础热力图", - "仪表盘": "仪表盘", - "雷达图": "雷达图", - "词云图": "词云图", - "紧凑树": "紧凑树", - "系统树": "系统树", - "脑图": "脑图", - "缩进树": "缩进树", - "辐射树": "辐射树", - "流程图": "流程图", - "Fruchterman\n聚类": "Fruchterman\n聚类", - "Fruchterman": "Fruchterman", - "力导向图": "力导向图", - "环形图": "环形图", - "螺旋线图": "螺旋线图", - "辐射图": "辐射图", - "同心圆": "同心圆", - "网格图": "网格图", - "气泡图": "气泡图", - "定点地图": "定点地图", - "符号地图": "符号地图", - "3D 柱状\n地图": "3D 柱状\n地图", - "散点地图": "散点地图", - "关系地图": "关系地图", - "3D 弧线地图": "3D 弧线地图", - "分类填充图": "分类填充图", - "聚合地图": "聚合地图", - "蜂窝热力图": "蜂窝热力图", - "3D 网格\n热力图": "3D 网格\n热力图", - "3D 蜂窝\n热力图": "3D 蜂窝\n热力图", - "经典热力图": "经典热力图", - "网格\n热力图": "网格\n热力图", - "桑基图": "桑基图", - "自定义\n Maker": "自定义\n Maker", - "等值线地图": "等值线地图", - "3D 填充地图": "3D 填充地图", - "旭日图": "旭日图", - "圆堆积图": "圆堆积图", - "极坐标树图": "极坐标树图", - "统计图表": "统计图表", - "关系图": "关系图", - "地图": "地图", - "折线图": "折线图", - "其他": "其他", - "面积图": "面积图", - "柱状图": "柱状图", - "条形图": "条形图", - "饼图": "饼图", - "股票": "股票", - "树图": "树图", - "点图层": "点图层", - "线图层": "线图层", - "面图层": "面图层", - "热力图": "热力图", - "关系型": "关系型", - "数值型": "数值型", - "时序型": "时序型", - "分类型": "分类型", - "地理型": "地理型", - "分组柱形图": "分组柱形图", - "力导向图布局": "力导向图布局", - "堆叠柱形图": "堆叠柱形图", - "树": "树", - "聚类": "聚类", - "层次": "层次", - "层级": "层级", - "流": "流", - "流向": "流向", - "场景案例": "场景案例", - "Leland Wilkinson": "Leland Wilkinson", - "I am thrill with G2. It is amazingly faithful to the GG system and has the potential to generate more graphics.": "I am thrill with G2. It is amazingly faithful to the GG system and has the potential to generate more graphics.", - "AntV": "AntV", - "继续了解": "继续了解", - "3D大图": "3D大图", - "超强性能": "超强性能", - "叙事动画": "叙事动画", - "性能飞跃,专业优雅": "性能飞跃,专业优雅", - "专家之声": "专家之声", - "来自数据可视化专家的专业认可与推荐": "来自数据可视化专家的专业认可与推荐", - "丰富图表,选用自如": "丰富图表,选用自如", - "数据驱动,高度易用,可扩展的可视化图形语法": "数据驱动,高度易用,可扩展的可视化图形语法", - "开箱即用的多维可视分析表格": "开箱即用的多维可视分析表格", - "便捷的关系数据可视化引擎与图分析工具": "便捷的关系数据可视化引擎与图分析工具", - "散点图 (3D图表)": "散点图 (3D图表)", - "高性能/高渲染质量的地理空间数据可视化框架": "高性能/高渲染质量的地理空间数据可视化框架", - "统计图表 (移动端)": "统计图表 (移动端)", - "专注于移动端的可视化解决方案,兼容 H5/小程序/Weex 等多端环境": "专注于移动端的可视化解决方案,兼容 H5/小程序/Weex 等多端环境", - "树形图表 (移动端)": "树形图表 (移动端)", - "思维导图": "思维导图", - "一款可以快速、流畅运行于移动设备中的图可视化引擎": "一款可以快速、流畅运行于移动设备中的图可视化引擎", - "极易定制、开箱即用、数据驱动的图编辑引擎": "极易定制、开箱即用、数据驱动的图编辑引擎", - "树形图表": "树形图表", - "地图 (3D图表)": "地图 (3D图表)", - "矩形式树图 (移动端)": "矩形式树图 (移动端)", - "智能洞察": "智能洞察", - "图表库": "图表库", - "267全系F版": "267全系F版", - "多维表格": "多维表格", - "移动统计图": "移动统计图", - "移动关系图": "移动关系图", - "移动地图": "移动地图", - "常用统计数据": "常用统计数据", - "关系数据": "关系数据", - "极致移动定制": "极致移动定制", - "设计语言": "设计语言", - "图表引擎": "图表引擎", - "拷贝代码": "拷贝代码", - "规范下载": "规范下载", - "定制主题,一键生成": "定制主题,一键生成", - "copy 主题": "copy 主题", - "已复制": "已复制", - "自定主题": "自定主题", - "活动战报": "活动战报", - "数据监控": "数据监控", - "日常分析": "日常分析", - "开始使用": "开始使用", - "·让数据栩栩如生": "·让数据栩栩如生", - "让普通应用低成本享受 Serverless 体验,帮助企业降本增效!": "让普通应用低成本享受 Serverless 体验,帮助企业降本增效!", - "产品首页": "产品首页", - "使用文档": "使用文档", - "伊利诺伊大学计算机科学客座教授H2O.ai 首席科学家,G2 项目顾问": "伊利诺伊大学计算机科学客座教授H2O.ai 首席科学家,G2 项目顾问", - "在多年可视化设计与开发的基础上,蚂蚁金服推出了 AntV 产品,这是工业界基础可视化语法与实践方面发出的最强声音,也是工业界与学术界一道推进可视化研发进展的最佳利器。": "在多年可视化设计与开发的基础上,蚂蚁金服推出了 AntV 产品,这是工业界基础可视化语法与实践方面发出的最强声音,也是工业界与学术界一道推进可视化研发进展的最佳利器。", - "设计,让数据美而简单,让可视化更普惠。好策略、好资产助力好报表、好产品。": "设计,让数据美而简单,让可视化更普惠。好策略、好资产助力好报表、好产品。", - "用户总量": "用户总量", - "3D 可视化图": "3D 可视化图", - "渲染器运行时切换": "渲染器运行时切换", - "分面帧动画": "分面帧动画", - "分类色板": "分类色板", - "单一顺序色板": "单一顺序色板", - "邻近顺序色板": "邻近顺序色板", - "发散色板": "发散色板", - "主要用于描述分类数据,如苹果、香蕉、梨,常用一个颜色代表一个值以区分不同类型,取色时色相分布均衡,相邻颜色之间明暗需考虑差异性,常用于饼图的不同分类、填充地图中的不同国家、关系图中的不同角色等。": "主要用于描述分类数据,如苹果、香蕉、梨,常用一个颜色代表一个值以区分不同类型,取色时色相分布均衡,相邻颜色之间明暗需考虑差异性,常用于饼图的不同分类、填充地图中的不同国家、关系图中的不同角色等。", - "单色顺序色板,均基于分类色板生长而来,一般使用同一色相,通过明度或饱和度的渐变,常用来表示同一事物中的数值大小或梯度变化,如排行榜等级变化、一个国家或地区的新增人口数对比、风险等级变化等。": "单色顺序色板,均基于分类色板生长而来,一般使用同一色相,通过明度或饱和度的渐变,常用来表示同一事物中的数值大小或梯度变化,如排行榜等级变化、一个国家或地区的新增人口数对比、风险等级变化等。", - "邻近顺序色板,均基于分类色板生长而来,为加大辨识度也可使用邻近色相,通过明度或饱和度的渐变,常用来表示同一事物中的数值大小或梯度变化,如排行榜等级变化、一个国家或地区的新增人口数对比、风险等级变化等。": "邻近顺序色板,均基于分类色板生长而来,为加大辨识度也可使用邻近色相,通过明度或饱和度的渐变,常用来表示同一事物中的数值大小或梯度变化,如排行榜等级变化、一个国家或地区的新增人口数对比、风险等级变化等。", - "点再到正向值的连续变化区间,显示相对立的两个值的大小关系,常用于气温的冷热、海拔高低、股票涨跌等。": "点再到正向值的连续变化区间,显示相对立的两个值的大小关系,常用于气温的冷热、海拔高低、股票涨跌等。", - "柱形图、饼图、关系图、地图、多维表格等260+丰富图表随心选用": "柱形图、饼图、关系图、地图、多维表格等260+丰富图表随心选用", - - "设计语言与研发框架": "设计语言与研发框架", - "资产一览,让你快速搭建网站应用": "资产一览,让你快速搭建网站应用", - "Ant Design / AntV 设计负责人": "Ant Design / AntV 设计负责人", - "地理空间数据": "地理空间数据", - "267 全系 F 版": "267 全系 F 版", - "蚂蚁企业级数据可视化解决方案,让人们在数据世界里获得视觉化思考能力": "蚂蚁企业级数据可视化解决方案,让人们在数据世界里获得视觉化思考能力" -} diff --git a/.dumi/theme/slots/Detail/index.tsx b/.dumi/theme/slots/Detail/index.tsx deleted file mode 100644 index e7ffde7bb..000000000 --- a/.dumi/theme/slots/Detail/index.tsx +++ /dev/null @@ -1,66 +0,0 @@ -import SEO from '@antv/dumi-theme-antv/dist/common/CommonHelmet'; -import { useIntl, useLocale } from 'dumi'; -import { debounce } from 'lodash'; -import React, { useEffect, useRef } from 'react'; -import Banner from 'site/components/Banner/Banner'; -import { ComplexCharts } from 'site/components/ComplexCharts'; -import { FamousPersons } from 'site/components/FamousPersons'; -import { LinkCharts } from 'site/components/LinkCharts'; -import { ProjectCard } from 'site/components/ProjectCard'; -import { ThemeCharts } from 'site/components/ThemeCharts'; - -export const Detail: React.FC = () => { - const locale = useLocale(); - const intl = useIntl(); - const ref = useRef(null); - - const useT = (transformedMessage: string) => { - return intl.formatMessage({ - id: transformedMessage, - }); - }; - - useEffect(() => { - const onResize = debounce(() => { - if (ref?.current) { - const scrollDom = ref?.current as HTMLDivElement; - const { clientWidth, scrollWidth } = scrollDom; - scrollDom.scrollLeft = (scrollWidth - clientWidth) / 2; - } - }, 100); - window.addEventListener('resize', onResize); - - return () => { - window.removeEventListener('resize', onResize); - }; - }, []); - - return ( -
- -
-
- - - - - - -
-
-
- ); -}; diff --git a/.dumirc.ts b/.dumirc.ts deleted file mode 100644 index 44adf38b8..000000000 --- a/.dumirc.ts +++ /dev/null @@ -1,154 +0,0 @@ -import { defineConfig } from 'dumi'; -import { homepage, repository } from './package.json'; -export default defineConfig({ - locales: [ - { id: 'zh', name: '中文' }, - { id: 'en', name: 'English' }, - ], - favicons: [ - 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*7svFR6wkPMoAAAAAAAAAAAAADmJ7AQ/original', - ], // 网站 favicon - metas: [ - // 自定义 meta 标签 - { name: 'keywords', content: 'AntV' }, - { name: 'description', content: 'Ant Visualization solution' }, - ], - themeConfig: { - title: 'AntV', - description: 'Ant Visualization solution', - defaultLanguage: 'zh', // 默认语言 - isAntVSite: true, // 是否是 AntV 的大官网 - footerTheme: 'light', - siteUrl: homepage, // 官网地址 - githubUrl: 'https://github.com/antvis/antvis.github.io', // GitHub 地址 - showSearch: true, // 是否显示搜索框 - showGithubCorner: true, // 是否显示头部的 GitHub icon - showAntVProductsCard: true, // 是否显示 AntV 产品汇总的卡片 - showLanguageSwitcher: true, // 是否显示官网语言切换 - showWxQrcode: true, // 是否显示头部菜单的微信公众号 - docsearchOptions: { - // 头部搜索框配置 - apiKey: '9d1cd586972bb492b7b41b13a949ef30', - indexName: 'antv_g6', - }, - navs: [ - { - slug: 'docs/specification/principles/basic', - title: { - zh: '设计语言', - en: 'Design', - }, - }, - ], - ecosystems: [ - // 头部的菜单中的「周边生态」 - ], - docs: [ - { - slug: 'specification/principles', - title: { - zh: '设计价值观', - en: 'Design Values', - }, - order: 0, - }, - { - slug: 'specification/language', - title: { - zh: '设计语言', - en: 'Language', - }, - order: 1, - }, - { - slug: 'specification/strategy', - title: { - zh: '设计策略', - en: 'Strategies', - }, - order: 2, - }, - { - slug: 'specification/graph', - title: { - zh: '图表设计指引', - en: 'Visualization Guides', - }, - order: 3, - }, - { - slug: 'specification/module', - title: { - zh: '组件设计指引', - en: 'Components Guide', - }, - order: 4, - }, - { - slug: 'specification/tool', - title: { - zh: '工具', - en: 'Tools', - }, - order: 6, - }, - ], - tutorials: [ - { - slug: 'manual/about', - title: { - zh: '关于', - en: 'About', - }, - order: 1, - }, - ], - examples: [], - mdPlayground: { - // 第一个分块的大小 - splitPaneMainSize: '62%', - }, - announcement: { - zh: '', - en: '', - }, - /** 首页技术栈介绍 */ - detail: { - title: { - zh: 'Antv', - en: 'Antv', - }, - description: { - zh: 'Ant Visualization solution', - en: 'Ant Visualization solution', - }, - }, - metas: { - title: { - zh: "AntV", - en: "AntV" - }, - description: { - zh: "让AGI栩栩如生", - en: "Ant Visualization solution" - } - }, - }, - alias: { - site: '/site', - }, - mfsu: false, - analytics: { - // google analytics 的 key (GA 4) - // ga_v2: 'G-abcdefg', - // 若你在使用 GA v1 旧版本,请使用 `ga` 来配置 - ga_v2: 'G-96Q5R280YF', - // 百度统计的 key - // baidu: 'baidu_tongji_key', - }, - links: [], - scripts: [], - https: { - http2: false - } -}); diff --git a/.gitignore b/.gitignore index e13843391..61e4edb6c 100644 --- a/.gitignore +++ b/.gitignore @@ -56,7 +56,6 @@ typings/ # gatsby files .cache/ -public # Mac files .DS_Store @@ -74,10 +73,15 @@ _site -# dumi production +# Site production /dist +# @antv/site generated files +/.antv-site +/.astro + # dumi tmp_production .dumi/tmp .dumi/tmp-production .idea +pnpm-lock.yaml \ No newline at end of file diff --git a/README.md b/README.md index 14e070233..7a17611de 100644 --- a/README.md +++ b/README.md @@ -1,26 +1,28 @@ -# AntV New Site 📈 +# AntV Site -New AntV site built on [@antv/dumi-theme-antv](https://github.com/antvis/dumi-theme-antv). +The AntV full-stack visualization website is built with +[`@antv/site`](https://github.com/antvis/site). ![prettier code style](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square) ## Install & Preview ```bash -npm install -npm start +pnpm install +pnpm start ``` -Visit https://127.0.0.1:8000 +The development server prints its local URL after startup. -## Prettier +## Validation ```bash -npm run format +pnpm check +pnpm build ``` ## Deploy to antv.vision ```bash -npm run deploy +pnpm deploy ``` diff --git a/astro.config.mjs b/astro.config.mjs new file mode 100644 index 000000000..e65373b29 --- /dev/null +++ b/astro.config.mjs @@ -0,0 +1,110 @@ +import { defineConfig } from '@antv/site'; + +export default defineConfig({ + site: { + title: 'AntV', + origin: 'https://antv.antgroup.com', + repository: 'https://github.com/antvis/antvis.github.io', + defaultLocale: 'zh', + locales: ['zh', 'en'], + favicon: + 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*7svFR6wkPMoAAAAAAAAAAAAADmJ7AQ/original', + logo: 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*A-lcQbVTpjwAAAAAAAAAAAAADmJ7AQ/original', + description: { + zh: 'AntV 是蚂蚁集团全新一代数据可视化解决方案,提供简单方便、专业可靠、无限可能的数据可视化最佳实践。', + en: 'AntV is Ant Group’s next-generation data visualization solution, providing simple, reliable, and extensible visualization practices.', + }, + }, + content: { + docs: './docs', + examples: null, + edit: { + branch: 'master', + path: 'docs', + }, + sidebar: { + 'specification/principles': { + zh: '设计价值观', + en: 'Design Values', + order: 0, + }, + 'specification/language': { + zh: '设计语言', + en: 'Language', + order: 1, + }, + 'specification/strategy': { + zh: '设计策略', + en: 'Strategies', + order: 2, + }, + 'specification/graph': { + zh: '图表设计指引', + en: 'Visualization Guides', + order: 3, + }, + 'specification/module': { + zh: '组件设计指引', + en: 'Component Guides', + order: 4, + }, + 'specification/tool': { + zh: '工具', + en: 'Tools', + order: 6, + }, + }, + }, + navigation: [ + { + text: { zh: '设计语言', en: 'Design' }, + href: '/specification/principles/basic', + }, + ], + search: { + enabled: false, + }, + home: { + eyebrow: { + zh: 'AntV 企业级数据可视化', + en: 'Enterprise data visualization by AntV', + }, + title: { + zh: '让 AI 栩栩如生', + en: 'Make AI come alive', + }, + description: { + zh: '蚂蚁企业级数据可视化解决方案,让人们在数据世界里获得视觉化思考能力。', + en: 'Enterprise visualization technology that helps people think visually in a world of data.', + }, + showStats: false, + actions: [], + features: [], + }, + qa: { + enabled: true, + }, + slots: { + home: { + hero: ['./site/Home.astro'], + }, + }, + theme: { + tokens: { + '--brand': '#691eff', + '--brand-strong': '#5312d6', + '--brand-button': '#5a16c9', + '--brand-soft': '#f0e8ff', + '--brand-faint': '#faf7ff', + }, + }, + footer: { + description: { + zh: '从底层渲染到智能分析,构建开放、可靠的全栈数据可视化技术。', + en: 'An open visualization stack spanning rendering, visual analysis, and intelligent tooling.', + }, + }, + demo: { + height: 480, + }, +}); diff --git a/docs/specification/principles/basic.en.md b/docs/specification/principles/basic.en.md index bc8cacec3..493c880a2 100644 --- a/docs/specification/principles/basic.en.md +++ b/docs/specification/principles/basic.en.md @@ -1,3 +1,8 @@ +--- +title: Design Values +order: 0 +--- + The design values of AntV for data visualization are derived from the Ant Design design system (Ant Design) and serve as guiding principles with characteristics of data visualization. While adhering to the design values of Ant Design, it offers a further interpretation in the field of data visualization. AntV's design language initially defined four design values: "Accuracy, Clarity, Effectiveness, and Beauty". After several years of extensive project practice in internal business and with the changes in users' demands for data analysis, new requirements have been put forward for charts. diff --git a/package.json b/package.json index dcce718c1..a1138a1fb 100644 --- a/package.json +++ b/package.json @@ -3,11 +3,16 @@ "private": true, "description": "Ant Visualization solution home page", "version": "1.0.0", + "type": "module", + "packageManager": "pnpm@10.34.5", + "engines": { + "node": ">=22.12.0" + }, "author": "AntV Team", "keywords": [ - "dumi", "antvis", - "antv" + "antv", + "visualization" ], "homepage": "https://antv.antgroup.com", "repository": { @@ -17,54 +22,22 @@ "bugs": { "url": "https://github.com/antvis/antvis.github.io/issues" }, - "dependencies": { - "ahooks": "^3.9.5", - "@tanstack/react-query": "^5.90.2", - "@ant-design/icons": "^4.8.3", - "@antv/dumi-theme-antv": "^0.8.6", - "@antv/g2plot": "^2.3.1", - "@antv/g6": "3.3.7", - "@antv/util": "^3.3.1", - "antd": "5.10.2", - "chroma-js": "^2.1.0", - "classnames": "^2.2.6", - "dumi": "~2.4.21", - "gh-pages": "^3.1.0", - "husky": "^8.0.2", - "lodash": "^4.17.20", - "prettier": "^2.0.0", - "pretty-quick": "^3.1.3", - "react": "^18.3.1", - "react-dom": "^18.3.1", - "react-github-btn": "^1.4.0" - }, "devDependencies": { - "@types/classnames": "^2.2.9", - "@types/lodash": "^4.14.189", - "@types/parse-github-url": "^1.0.0", - "@types/react": "^18.3.26", - "@types/react-dom": "^18.3.7", - "@types/react-github-button": "^0.1.0", - "@types/react-helmet": "^6.0.0", - "typescript": "latest" + "@antv/site": "link:../site-platform", + "@astrojs/check": "0.9.10", + "@tabler/icons": "^3.46.0", + "astro": "7.2.0", + "gh-pages": "^6.3.0", + "typescript": "5.9.3" }, "license": "MIT", "scripts": { - "start": "npm run develop", - "build": "dumi build", - "dev": "dumi dev", - "deploy": " npm run build && npm run gh-pages", + "start": "astro dev", + "dev": "astro dev", + "build": "astro build", + "check": "astro check", + "deploy": "pnpm run build && pnpm run gh-pages", "gh-pages": "gh-pages -d dist", - "copy-mirror-action": "mkdir -p public/.github/workflows && cp .github/workflows/mirror.yml public/.github/workflows", - "format": "prettier --write \"**/*.{ts,tsx,js,jsx,json,md,less}\"", - "pretty-quick": "pretty-quick", - "tsc": "tsc", - "serve": "dumi preview", - "type-check": "tsc --noEmit" - }, - "husky": { - "hooks": { - "pre-commit": "pretty-quick --staged" - } + "preview": "astro preview" } } diff --git a/public/CNAME b/public/CNAME new file mode 100644 index 000000000..764eb862a --- /dev/null +++ b/public/CNAME @@ -0,0 +1 @@ +antv.vision diff --git a/site/Home.astro b/site/Home.astro new file mode 100644 index 000000000..7c386d1fd --- /dev/null +++ b/site/Home.astro @@ -0,0 +1,1611 @@ +--- +import type { HomeSlotProps } from '@antv/site'; +import { Carousel, QaEntry, Updates } from '@antv/site/components'; +import antdVisual from './assets/home/antd.svg?url'; +import avaVisual from './assets/home/ava.svg?url'; +import contextVisual from './assets/home/context.png?url'; +import gptVisVisual from './assets/home/gpt-vis.svg?url'; +import heroBackground from './assets/home/hero-background.png?url'; +import heroEffect from './assets/home/hero-effect.gif?url'; +import infographicVisual from './assets/home/infographic.svg?url'; +import mcpVisual from './assets/home/mcp.svg?url'; +import siveVisual from './assets/home/sive.svg?url'; +import skillsVisual from './assets/home/skills.svg?url'; +import { + aiSolutions, + ecosystem, + experts, + foundation, + qaSuggestions, + showcases, +} from './data/home'; + +type Props = HomeSlotProps; + +const { locale } = Astro.props; +const isZh = locale === 'zh'; +const text = { + heroTitle: isZh ? '让 AI 栩栩如生' : 'Make AI come alive', + heroDescription: isZh + ? '蚂蚁企业级数据可视化解决方案,让人们在数据世界里获得视觉化思考能力。' + : 'Enterprise visualization technology that helps people think visually in a world of data.', + updatesTitle: isZh ? 'AntV 最新动态' : 'Latest from AntV', + aiTitle: isZh ? 'AI 可视化方案' : 'AI visualization solutions', + aiDescription: isZh + ? '从产品知识、专业技能到工具连接与数据理解,形成完整的 AI 可视化工作流。' + : 'A complete workflow spanning product knowledge, reusable skills, connected tools, and data understanding.', + performanceTitle: isZh ? '卓越性能、自在表达' : 'High performance, expressive by design', + performanceDescription: isZh + ? '定制主题、一键生成、性能飞跃、专业优雅、丰富图表、选用自如。' + : 'Custom themes, fast generation, high performance, and expressive charts for every use case.', + matrixTitle: isZh ? '产品矩阵' : 'Product matrix', + aiAgent: 'AntV AI Agent', + designLanguage: isZh ? 'AntV Design 设计语言' : 'AntV Design language', + expertsTitle: isZh ? '专家之声' : 'Expert voices', +}; + +const metrics = [ + { value: '10+', suffix: isZh ? '年' : 'years', label: isZh ? '可视化技术积累' : 'of visualization practice' }, + { value: isZh ? '72+' : '720K+', suffix: isZh ? '万' : '', label: 'GitHub Stars' }, + { value: isZh ? '15+' : '1.5B+', suffix: isZh ? '亿' : '', label: isZh ? '年度 NPM 下载' : 'annual NPM downloads' }, +]; +const solutionVisuals: Record = { + Context: contextVisual, + Skills: skillsVisual, + MCP: mcpVisual, + AVA: avaVisual, + 'GPT Vis': gptVisVisual, + Infographic: infographicVisual, +}; +const matrixAgentDescriptions = isZh + ? ['知识召回', '专业技能', '生态链接', '智能洞察'] + : ['Context retrieval', 'Specialist skills', 'Ecosystem links', 'Intelligent insights']; +const matrixGptVisDescription = isZh ? '数据分析图表库' : 'Data analysis chart library'; +--- + +
+
+ +
+

+ AntV{text.heroTitle} +

+

{text.heroDescription}

+ question[locale])} /> +
+
+ +
+

{text.updatesTitle}

+
+
+ {metrics.map((metric) => ( +
+

{metric.value}{metric.suffix}

+ {metric.label} +
+ ))} +
+
+ +
+
+
+ +
+
+
+

{text.aiTitle}

+

{text.aiDescription}

+
+ +
+
+ +
+
+
+

{text.performanceTitle}

+

{text.performanceDescription}

+
+
+ {showcases.map((item, index) => { + const titleNote = item.titleNote?.[locale]; + return ( + +
+
+ {`${item.product} +
+
+ + + + {item.title[locale]} + {titleNote && <> {titleNote}} + + {item.product} + + {item.description[locale]} + +
+ ); + })} +
+
+
+ +
+
+
+

{text.matrixTitle}

+
+ +
+
+ +
+
+
+

{text.expertsTitle}

+
+ +
+
+
+ + + + diff --git a/site/assets/home/ai-heading.webp b/site/assets/home/ai-heading.webp new file mode 100644 index 000000000..6f1452878 Binary files /dev/null and b/site/assets/home/ai-heading.webp differ diff --git a/site/assets/home/antd.svg b/site/assets/home/antd.svg new file mode 100644 index 000000000..9fa02f278 --- /dev/null +++ b/site/assets/home/antd.svg @@ -0,0 +1,82 @@ + + + 编组 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/site/assets/home/antv.svg b/site/assets/home/antv.svg new file mode 100644 index 000000000..a7b77910a --- /dev/null +++ b/site/assets/home/antv.svg @@ -0,0 +1,17 @@ + + + 矢量智能对象 + + + + + + + + + + + + + + \ No newline at end of file diff --git a/site/assets/home/ava.svg b/site/assets/home/ava.svg new file mode 100644 index 000000000..2d5fba3d3 --- /dev/null +++ b/site/assets/home/ava.svg @@ -0,0 +1,52 @@ + + + 编组 14 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/site/assets/home/context.png b/site/assets/home/context.png new file mode 100644 index 000000000..523e72289 Binary files /dev/null and b/site/assets/home/context.png differ diff --git a/site/assets/home/experts-background.svg b/site/assets/home/experts-background.svg new file mode 100644 index 000000000..3e1c55a83 --- /dev/null +++ b/site/assets/home/experts-background.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + + + + + + diff --git a/site/assets/home/fonts/home-light.woff2 b/site/assets/home/fonts/home-light.woff2 new file mode 100644 index 000000000..37fd76294 Binary files /dev/null and b/site/assets/home/fonts/home-light.woff2 differ diff --git a/site/assets/home/fonts/metrics-bold.woff2 b/site/assets/home/fonts/metrics-bold.woff2 new file mode 100644 index 000000000..72468eb15 Binary files /dev/null and b/site/assets/home/fonts/metrics-bold.woff2 differ diff --git a/site/assets/home/gpt-vis.svg b/site/assets/home/gpt-vis.svg new file mode 100644 index 000000000..75859a125 --- /dev/null +++ b/site/assets/home/gpt-vis.svg @@ -0,0 +1,52 @@ + + + 编组 14 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/site/assets/home/hero-background.png b/site/assets/home/hero-background.png new file mode 100644 index 000000000..52a2ac5ab Binary files /dev/null and b/site/assets/home/hero-background.png differ diff --git a/site/assets/home/hero-effect.gif b/site/assets/home/hero-effect.gif new file mode 100644 index 000000000..f1cb38a8f Binary files /dev/null and b/site/assets/home/hero-effect.gif differ diff --git a/site/assets/home/infographic.svg b/site/assets/home/infographic.svg new file mode 100644 index 000000000..6ad8d8b3d --- /dev/null +++ b/site/assets/home/infographic.svg @@ -0,0 +1,52 @@ + + + 编组 14 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/site/assets/home/matrix-agent.webp b/site/assets/home/matrix-agent.webp new file mode 100644 index 000000000..062e1df71 Binary files /dev/null and b/site/assets/home/matrix-agent.webp differ diff --git a/site/assets/home/matrix-design.webp b/site/assets/home/matrix-design.webp new file mode 100644 index 000000000..a805b2dbd Binary files /dev/null and b/site/assets/home/matrix-design.webp differ diff --git a/site/assets/home/matrix-heading.webp b/site/assets/home/matrix-heading.webp new file mode 100644 index 000000000..971568bca Binary files /dev/null and b/site/assets/home/matrix-heading.webp differ diff --git a/site/assets/home/mcp.svg b/site/assets/home/mcp.svg new file mode 100644 index 000000000..52f97cbaf --- /dev/null +++ b/site/assets/home/mcp.svg @@ -0,0 +1,52 @@ + + + 编组 14 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/site/assets/home/showcase-heading.webp b/site/assets/home/showcase-heading.webp new file mode 100644 index 000000000..139b3c4c8 Binary files /dev/null and b/site/assets/home/showcase-heading.webp differ diff --git a/site/assets/home/signal-background.svg b/site/assets/home/signal-background.svg new file mode 100644 index 000000000..fa226027e --- /dev/null +++ b/site/assets/home/signal-background.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + + + + + + diff --git a/site/assets/home/sive.svg b/site/assets/home/sive.svg new file mode 100644 index 000000000..649064708 --- /dev/null +++ b/site/assets/home/sive.svg @@ -0,0 +1,17 @@ + + + 位图 + + + + + + + + + + + + + + \ No newline at end of file diff --git a/site/assets/home/skills.svg b/site/assets/home/skills.svg new file mode 100644 index 000000000..c8c73e6a9 --- /dev/null +++ b/site/assets/home/skills.svg @@ -0,0 +1,52 @@ + + + 编组 14 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/site/assets/home/solution-grid.webp b/site/assets/home/solution-grid.webp new file mode 100644 index 000000000..887e6303b Binary files /dev/null and b/site/assets/home/solution-grid.webp differ diff --git a/site/assets/home/weavefox.svg b/site/assets/home/weavefox.svg new file mode 100644 index 000000000..1955d53dc --- /dev/null +++ b/site/assets/home/weavefox.svg @@ -0,0 +1,17 @@ + + + 位图 + + + + + + + + + + + + + + \ No newline at end of file diff --git a/site/components/Banner/Banner.module.less b/site/components/Banner/Banner.module.less deleted file mode 100644 index 928770b57..000000000 --- a/site/components/Banner/Banner.module.less +++ /dev/null @@ -1,311 +0,0 @@ -@font-face { - font-family: AlibabaPuHuiTiRHeavy; - src: url(../../font/Alibaba-PuHuiTi-Heavy.otf); -} - -.commonFlexConfig { - display: flex; - align-items: center; - justify-content: center; -} - -.banner { - position: relative; - background-image: url(https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*KL9wS54k2U8AAAAAAAAAAAAADmJ7AQ/original); - background-repeat: no-repeat; - background-size: cover; - - .leftBackground, - .rightBackground { - width: 765px; - height: 100%; - position: absolute; - background-repeat: no-repeat; - background-size: contain; - - > img { - position: absolute; - } - } - - .leftBackground { - left: 0; - top: 75px; - background-image: url(https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*B4UvSKE2hfEAAAAAAAAAAAAADmJ7AQ/original); - background-position-x: -48px; - - &::before, - &::after { - content: ''; - background-image: url(https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*pD8oT49V-bcAAAAAAAAAAAAADmJ7AQ/original); - background-size: contain; - position: absolute; - height: 40px; - width: 40px; - left: 35px; - top: 300px; - } - - &::before { - height: 32px; - width: 32px; - left: 220px; - top: 345px; - } - - .waffle { - height: 254.3px; - transform: rotate(3deg); - left: -20px; - } - - .bug { - height: 160px; - transform: rotate(-7deg); - left: 279px; - top: 214px; - } - } - - .rightBackground { - top: 90px; - right: 0; - background-position-x: 66px; - background-image: url(https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*DR_FR7Q721sAAAAAAAAAAAAADmJ7AQ/original); - - .chips { - height: 263.3px; - transform: rotate(8deg); - right: 140px; - top: 140px; - } - - .cookie { - height: 117.1px; - right: 10px; - top: 40px; - } - - &::before, - &::after { - content: ''; - background-image: url(https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*pD8oT49V-bcAAAAAAAAAAAAADmJ7AQ/original); - background-size: contain; - position: absolute; - height: 21px; - width: 21px; - right: 310px; - opacity: 0.67; - top: 310px; - } - - &::before { - height: 31px; - width: 31px; - right: 55px; - top: 335px; - } - } - - .header { - height: 1130px; - position: relative; - font-family: PingFangSC; - } - - .top { - z-index: 10; - position: absolute; - left: 0; - right: 0; - top: 0; - bottom: 0; - font-family: AlibabaPuHuiTiR; - } - - .mainTitle { - font-size: 64px; - color: #000; - text-align: center; - margin-top: 108px; - font-family: AlibabaPuHuiTiRHeavy; - - > span { - color: #691eff; - } - } - - .subTitle { - color: #424e66; - text-align: center; - font-size: 18px; - margin-top: 8px; - } - - .bgVideo { - position: absolute; - top: 0px; - right: 0px; - min-width: 100%; - z-index: -999; - } - - .buttons { - &:extend(.commonFlexConfig); - z-index: 11; - position: absolute; - top: 350px; - width: 100%; - - > div, - > a { - &:extend(.commonFlexConfig); - height: 54px; - width: 166px; - border-radius: 12px; - font-size: 18px; - font-weight: bold; - cursor: pointer; - box-shadow: 0 8px 28px 0 #f2f2f2; - margin: 0 11.5px; - - > img { - margin-right: 6px; - } - } - - .start { - font-size: 18px; - background-color: #691eff; - color: #ffffff; - - .startIcon { - width: 20px; - height: 20px; - margin-right: 6px; - background-image: url(https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*lo_5RYdqKLsAAAAAAAAAAAAADmJ7AQ/original), - url(https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*UcuoSovQjxAAAAAAAAAAAAAADmJ7AQ/original), - url(https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*3VvbT7spBhIAAAAAAAAAAAAADmJ7AQ/original), - url(https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*PI67SoRSfgsAAAAAAAAAAAAADmJ7AQ/original), - url(https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*sP-zRZweTJcAAAAAAAAAAAAADmJ7AQ/original), - url(https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*SFfnTachgWgAAAAAAAAAAAAADmJ7AQ/original); - background-repeat: no-repeat; - background-position-y: 0, 20px, 40px, 60px, 80px, 100px; - } - - &:hover { - opacity: 0.8; - - .startIcon { - animation: hoverIcon 5s; - } - } - } - - .design { - font-size: 18px; - background-color: #ffffff; - border: 1px solid #e8e8e8; - - &:hover { - color: #691eff; - } - } - } - - .bottom { - &:extend(.commonFlexConfig); - z-index: 10; - width: 100%; - position: absolute; - top: 966px; - - .message { - &:extend(.commonFlexConfig); - min-height: 114px; - height: 140px; - width: calc((100vw - 360px - 26px) / 3); - min-width: 338px; - max-width: 551px; - background-color: #ffffff; - border: 1px solid #e5e8ef; - transition: all 0.2s; - padding: 16px; - box-shadow: 0 8px 28px 0 rgba(0, 0, 0, 0.05); - border-radius: 16px; - margin: 0 13px; - flex-direction: column; - - .messageTitle { - font-weight: 500; - font-size: 18px; - color: #1d2129; - margin-bottom: 8px; - text-align: center; - position: relative; - - > img { - width: 24px; - height: 24px; - position: relative; - top: -2px; - } - } - - .messageSubTitle { - font-size: 14px; - color: #86909c; - text-align: center; - } - - &:hover { - transform: translateY(-8px); - box-shadow: 0 8px 20px 0 rgba(0, 0, 0, 0.1); - - .messageTitle { - color: rgba(105, 30, 255, 1); - } - } - } - } -} - -@keyframes hoverIcon { - 0% { - background-position-y: 0px, 20px, 40px, 60px, 80px, 100px; - } - - 16.6% { - background-position-y: -20px, 0px, 20px, 40px, 60px, 80px; - } - - 33.3% { - background-position-y: -40px, -20px, 0px, 20px, 40px, 60px; - } - - 50% { - background-position-y: -60px, -40px, -20px, 0px, 20px, 40px; - } - - 66.6% { - background-position-y: -80px, -60px, -40px, -20px, 0px, 20px; - } - - 83.3% { - background-position-y: -100px, -80px, -60px, -40px, -20px, 0px; - } - - 100% { - background-position-y: -100px, -80px, -60px, -40px, -20px, 0px; - } -} - -div.listContainer { - width: 80vw; - min-width: 760px; - margin-right: auto; - margin-left: auto; - @media (min-width: 2700px) { - width: 2100px; - } -} diff --git a/site/components/Banner/Banner.tsx b/site/components/Banner/Banner.tsx deleted file mode 100644 index 989231748..000000000 --- a/site/components/Banner/Banner.tsx +++ /dev/null @@ -1,103 +0,0 @@ -import { useIntl, useLocale } from 'dumi'; -import React, { useEffect, useState } from 'react'; -import { ANCHORNAME } from '../ProjectCard'; -import { getBaseSiteDataUrl } from '@antv/dumi-theme-antv/dist/utils/env'; - -import styles from './Banner.module.less'; -import { HomeDialog } from '@antv/dumi-theme-antv/dist/components/AI/HomeDialog'; - -export default () => { - const [message, setMessage] = useState([]); - const locale = useLocale(); - - const language: 'zh' | 'en' = locale.id.includes('zh') ? 'zh' : 'en'; - - const intl = useIntl(); - const useT = (transformedMessage: string) => { - return intl.formatMessage({ - id: transformedMessage, - }); - }; - - useEffect(() => { - fetch(`${getBaseSiteDataUrl()}/antv/banner-messages.json`) - .then((res) => res.json()) - .then((data) => { - setMessage(data); - }); - }, []); - - // 跳转到 丰富图表,选用自如 - const scrollToAnchor = () => { - const anchorElement = document.getElementById(ANCHORNAME); - if (anchorElement) { - anchorElement.scrollIntoView({ block: 'start', behavior: 'smooth' }); - } - }; - - return ( -
-
- waffle - bug -
-
- chips - cookie -
-
-
-
- AntV - {useT('·让AGI栩栩如生')} -
-
- {useT( - '蚂蚁企业级数据可视化解决方案,让人们在数据世界里获得视觉化思考能力', - )} -
-
- -
- {message.map(({ title, subTitle, img, link }) => { - return ( - -
- message_title {title[language]} -
-
- {subTitle[language]} -
-
- ); - })} -
-
-
-
- ); -}; diff --git a/site/components/Banner/helper.ts b/site/components/Banner/helper.ts deleted file mode 100644 index 8abd9fe02..000000000 --- a/site/components/Banner/helper.ts +++ /dev/null @@ -1,60 +0,0 @@ -import { map } from 'lodash'; -import bannerInfo from 'site/data/banner-info.json'; -import bannerLinks from 'site/data/banner-link.json'; - -/** - * 获取真实的 url。根据是否国内镜像进行调整 - * @param url - * @param isChinaMirrorHost - * @returns - */ -export function getActualUrl(url: string, isChinaMirrorHost: boolean): string { - let link = url; - if (isChinaMirrorHost && link) { - // g2plot.antv.antgroup.com => antv-g2plot.gitee.io - const match = link.match(/([http|https]):\/\/(.*)\.antv\.vision/); - if (match && match[2]) { - link = link.replace( - `${match[2]}.antv.vision`, - `antv-${match[2]}.gitee.io`, - ); - } - } - return link; -} - -/** - * 获取 banner 的场景 demo 信息。根据是否国内镜像进行调整 url - */ -export function getBannerInfo(isChinaMirrorHost: boolean) { - const products_tabs = bannerInfo.products_tabs.map((products_tab) => { - if (!products_tab.demos) { - return products_tab; - } - const demos = map(products_tab.demos, (demo: any) => { - return { - ...demo, - // @ts-ignore - host: demo.host && getActualUrl(demo.host, isChinaMirrorHost), - }; - }); - return { ...products_tab, demos }; - }); - - return { ...bannerInfo, products_tabs }; -} - -/** - * 获取 banner 的产品链接。根据是否国内镜像进行调整 url - */ -export function getBannerLink(isChinaMirrorHost: boolean) { - return bannerLinks.map((bannerLink) => { - if (bannerLink.url) { - return { - ...bannerLink, - url: getActualUrl(bannerLink.url, isChinaMirrorHost), - }; - } - return bannerLink; - }); -} diff --git a/site/components/ComplexCharts/index.module.less b/site/components/ComplexCharts/index.module.less deleted file mode 100644 index 5cc544970..000000000 --- a/site/components/ComplexCharts/index.module.less +++ /dev/null @@ -1,73 +0,0 @@ -.commonFlexConfig { - display: flex; - align-items: center; - justify-content: center; -} - -.complexCharts { - &:extend(.commonFlexConfig); - padding: 80px 0 40px; - flex-direction: column; - font-family: PingFangSC; - - .title { - height: 48px; - font-size: 40px; - color: #1d2129; - margin-bottom: 48px; - font-family: AlibabaPuHuiTiB; - } - - .complexButtons { - display: flex; - justify-content: center; - margin-bottom: 32px; - - .button { - &:extend(.commonFlexConfig); - height: 52px; - width: 160px; - cursor: pointer; - background-color: #ffffff; - border: 2px solid #e5e8ef; - border-radius: 8px; - margin-right: 20px; - line-height: 52px; - font-size: 18px; - - > img { - margin-right: 8px; - } - - &:hover { - font-weight: 500; - border: 2px solid #691eff; - } - } - - .isSelect { - font-weight: 500; - border: 2px solid #691eff; - color: #691eff; - } - } - - .content { - width: calc(100vw - 360px); - height: calc((100vw - 360px) * (571 / 1680)); - max-width: 1680px; - min-width: 1040px; - max-height: 571px; - min-height: 353px; - border-radius: 16px; - box-sizing: border-box; - box-shadow: 0 8px 28px 0 rgba(0, 0, 0, 0.2); - overflow: hidden; - - > video { - width: 100%; - height: 100%; - background-size: cover; - } - } -} diff --git a/site/components/ComplexCharts/index.tsx b/site/components/ComplexCharts/index.tsx deleted file mode 100644 index 6b64a3415..000000000 --- a/site/components/ComplexCharts/index.tsx +++ /dev/null @@ -1,61 +0,0 @@ -import { useChinaMirrorHost } from '@antv/dumi-theme-antv/dist/slots/hooks'; -import classNames from 'classnames'; -import { useIntl, useLocale } from 'dumi'; -import React, { useState } from 'react'; -import COMPLEX_DATAS from '../../data/complex-charts.json'; -import { transformUrl } from '../Products/getProducts'; - -import styles from './index.module.less'; - -// 性能飞跃,专业优雅 -export function ComplexCharts() { - const locale = useLocale(); - const [isChinaMirrorHost] = useChinaMirrorHost(); - - const language: 'zh' | 'en' = locale.id.includes('zh') ? 'zh' : 'en'; - - const intl = useIntl(); - const useT = (transformedMessage: string) => { - return intl.formatMessage({ - id: transformedMessage, - }); - }; - - const [select, setSelect] = useState(COMPLEX_DATAS[0]); - - return ( -
-
{useT('性能飞跃,专业优雅')}
-
- {COMPLEX_DATAS.map((data) => { - const isSelect = select.text === data.text; - return ( -
setSelect(data)} - > - {data.text}{' '} - {useT(data.text)} -
- ); - })} -
- - -
- ); -} diff --git a/site/components/D2Chart/D2Chart.module.less b/site/components/D2Chart/D2Chart.module.less deleted file mode 100644 index ba1ad01f8..000000000 --- a/site/components/D2Chart/D2Chart.module.less +++ /dev/null @@ -1,11 +0,0 @@ -.canvas { - width: 100%; - height: 100%; - display: flex; - justify-content: center; - align-items: center; - - border-radius: 0px; - overflow: hidden; - position: relative; -} diff --git a/site/components/D2Chart/D2Chart.tsx b/site/components/D2Chart/D2Chart.tsx deleted file mode 100644 index d3b7d16b2..000000000 --- a/site/components/D2Chart/D2Chart.tsx +++ /dev/null @@ -1,807 +0,0 @@ -import { lowerCase } from '@antv/util'; -import React, { forwardRef, useLayoutEffect, useRef } from 'react'; -import styles from './D2Chart.module.less'; -import { - AFTERNOON_DAILY_SCHEDULE, - DAWN_DAILY_SCHEDULE, - MIDNIGHT_DAILY_SCHEDULE, - MORNING_DAILY_SCHEDULE, - NIGHT_DAILY_SCHEDULE, -} from './datas/dailySchedule'; -import { CLASSIC, ELECTRONIC, METAL, POP } from './datas/music'; - -// 资源 -const FONT_FAMILY = `Avenir, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif`; - -const DAILY_SCHEDULE_TEXT = 'Daily\nSchedule'; -const MUSIC_TEXT = 'Music'; - -const getViews = (props: Props, box: DOMRect | undefined) => { - const { - theme, - favoriteFramework /** 默认取 react */, - efficientWorktime, - music, - favoriteIDE, - themeMode, - } = props; - - let worktimeData: any[] = []; - switch (efficientWorktime) { - case 'morning': - worktimeData = MORNING_DAILY_SCHEDULE; - break; - case 'afternoon': - worktimeData = AFTERNOON_DAILY_SCHEDULE; - break; - case 'dawn': - worktimeData = DAWN_DAILY_SCHEDULE; - break; - case 'night': - worktimeData = NIGHT_DAILY_SCHEDULE; - break; - case 'midnight': - MIDNIGHT_DAILY_SCHEDULE.forEach((d) => { - worktimeData.push( - { ...d, type: 'male' }, - { ...d, type: 'female', y: d.y * 0.8 }, - ); - }); - break; - default: - worktimeData = NIGHT_DAILY_SCHEDULE; - break; - } - - const yMax = Math.max(...worktimeData.map((d) => d.y)); - const width280 = box && Math.min(box?.height, box?.width) < 280; - const width320 = box && Math.min(box?.height, box?.width) < 320; - - let musicData: any[] = []; - switch (music) { - case 'classic': - musicData = CLASSIC; - break; - case 'metal': - musicData = METAL; - break; - case 'electronic': - musicData = ELECTRONIC; - break; - case 'pop': - musicData = POP; - break; - default: - musicData = CLASSIC; - break; - } - - // 控制水滴的角度, 用来控制随机角度 - const waterdropStartAngle = - (Math.PI / 2) * Math.random() * (Math.random() > 0.5 ? -0.5 : 1); - const waterdropEndAngle = Math.PI * 2 + (Math.PI / 6) * Math.random(); - - /** 前端框架的一些渲染配置:vis-waterdrop(4种💧,角度随机) */ - const FrameworkData = [ - { x: 'React', y: 11 }, - { x: 'Bymyself', y: 8 }, - { x: 'Vue', y: 8 }, - { x: 'Angular', y: 7 }, - ]; - - const framework = favoriteFramework || 'bymyself'; - const favoriteFrameworkIndex = FrameworkData.findIndex( - (d) => lowerCase(d.x) === lowerCase(framework), - ); - if (favoriteFrameworkIndex !== -1) { - // 交换 y 轴 - FrameworkData[0].y = FrameworkData[favoriteFrameworkIndex].y; - FrameworkData[favoriteFrameworkIndex].y = 11; - } - - return [ - { - // 条形图 - // 处理数据,让数据超过内环的 0.6 - data: worktimeData.map((d) => ({ - ...d, - // TODO 调试 - y: d.y / yMax < 0.46 ? d.y + yMax * 0.46 * 0.2 : d.y, - })), - coordinate: { - type: 'polar', - cfg: { radius: 1, innerRadius: 0.6 /** 内环半径 */ }, - }, - axes: { - x: false, - y: { label: null, line: null, grid: null, min: 0 }, - }, - geometries: [ - { - type: 'interval', - xField: 'x', - yField: 'y', - meta: { x: { type: 'cat' }, y: { min: 0 } }, - colorField: 'type', - mapping: { - style: ({ x }: { x: string }) => { - const hour = Number(x.split(':')[0]); - const cfg: any = { fillOpacity: 0.45, lineCap: 'round' }; - const DAILY_SCHEDULE_COLOR = [ - 'l(0) 0:#6232B4 1:#81CCEA', - 'l(0) 0:#C0F08B 1:#A7E8EA', - 'l(0) 0:#FBD215 1:#B3E79A', - 'l(0) 0:#F8BF39 1:#E26AC4', - 'l(0) 0:#F262BD 1:#4D35AB', - ]; - if (hour >= 1 && hour < 5) { - cfg.fill = DAILY_SCHEDULE_COLOR[0]; - } else if (hour >= 5 && hour < 12) { - cfg.fill = DAILY_SCHEDULE_COLOR[1]; - } else if (hour >= 12 && hour < 17) { - cfg.fill = DAILY_SCHEDULE_COLOR[2]; - } else if (hour >= 17 && hour < 21) { - cfg.fill = DAILY_SCHEDULE_COLOR[3]; - } else { - cfg.fill = DAILY_SCHEDULE_COLOR[4]; - } - return cfg; - }, - }, - adjust: { - type: 'dodge', - marginRatio: 1, - }, - }, - ], - }, - { - // 同步环图, 环图外的光圈 - data: [{ value: 1 }], - coordinate: { type: 'theta', cfg: { radius: 0.6 } }, - geometries: [ - { - type: 'interval', - yField: 'value', - mapping: { - style: () => { - if (favoriteIDE === 'vim') { - if (themeMode === 'light') { - return { - // DONE 🎉 - shadowColor: 'rgba(63,58,53,0.45)', - shadowBlur: 60, - }; - } - return { - // DONE 🎉 - shadowColor: '#4AD8EA', - shadowBlur: 100, - }; - } - if (favoriteIDE === 'webstorm') { - return { - // DONE 🎉 - shadowColor: 'rgba(255,255,255,0.38)', - shadowBlur: 100, - }; - } - return { - shadowColor: 'rgba(255,255,255,0.38)', - shadowBlur: 140, - }; - }, - }, - }, - ], - }, - { - // 时间周期,vis-donut - region: { - start: { x: 0.18, y: 0.18 }, - end: { x: 0.82, y: 0.82 }, - }, - data: theme.dailySchedule.data, - coordinate: { - type: 'theta', - cfg: { - startAngle: (-Math.PI * 5) / 12, - endAngle: (Math.PI * 3) / 2 + (Math.PI * 1) / 12, - radius: 1, - innerRadius: 0.95, - }, - }, - axes: false, - geometries: [ - { - type: 'interval', - xField: '1', - yField: 'y', - colorField: 'x', - adjust: { type: 'stack' }, - label: { - fields: ['x'], - callback: (x: any) => { - const cfg: any = { - labelLine: false, - // todo 不生效 - autoRotate: true, - labelEmit: true, - style: { - fontFamily: FONT_FAMILY, - fill: theme.dailySchedule.customStyle.fontFill, - fillOpacity: 0.5, - fontSize: 10, - }, - }; - return cfg; - }, - }, - mapping: { - color: theme.dailySchedule.color, - style: theme.dailySchedule.style, - }, - }, - ], - annotations: [ - { - type: 'text', - position: ['50%', '50%'], - content: theme.dailySchedule.annotations[0].content, - // fixme 不知道为啥不居中 - offsetY: - (theme.dailySchedule.annotations[0].fontSize / 9) * - (width280 ? 0.6 : 1), - style: { - textAlign: 'center', - textBaseline: 'middle', - fontWeight: 700, - fontSize: - theme.dailySchedule.annotations[0].fontSize * - (width280 ? 0.6 : 1), - lineHeight: - theme.dailySchedule.annotations[0].fontSize * - (width280 ? 0.6 : 1), - fill: theme.dailySchedule.customStyle.fontFill, - fontFamily: FONT_FAMILY, - }, - }, - ], - }, - { - // 同步环图(环图内圈 vis-donut) - data: [{ value: 1 }], - coordinate: { type: 'theta', cfg: { radius: 0.65 * 0.95 } }, - geometries: [ - { - type: 'interval', - yField: 'value', - mapping: { - color: theme.backgroundColor, - style: { - fillOpacity: 1, - stroke: '#fff', - strokeOpacity: 0.15, - lineWidth: 0.8, - }, - }, - }, - ], - }, - { - // 音乐:vis-line - region: { - start: { x: 0.125, y: 0.125 }, - end: { x: 0.875, y: 0.875 }, - }, - data: musicData, - coordinate: { - type: 'polar', - cfg: { - radius: 0.8, - innerRadius: 0.4, - }, - }, - axes: false, - geometries: [ - { - type: 'line', - xField: 'x', - yField: 'y', - colorField: 'type', - shapeField: 'type', - mapping: { - color: [ - '#6D5EFF', - '#F5BE15', - '#5B8FF9', - '#EE8CB7', - '#60DCAB', - '#76D4F9', - ], - style: ({ type }: any) => { - const cfg: any = { lineWidth: 0.8, strokeOpacity: 0.3 }; - // 倒数第一条 0.3 透明度,倒数第二条 0.5 透明度, 依次 0.8, 0.9 - if ( - [ - 'Soprano', - 'Electric_guitar', - 'Amplifier_1', - 'Lead_guitar', - ].indexOf(type) !== -1 - ) { - // done 🎉 - cfg.strokeOpacity = 1; - } - if (type === 'Drum') { - // done 🎉 - cfg.strokeOpacity = 0.9; - } - if (['Alto', 'Electri_bass'].indexOf(type) !== -1) { - // done 🎉 - cfg.strokeOpacity = 0.8; - } - if (type === 'Amplifier_2') { - // done 🎉 - cfg.strokeOpacity = 0.5; - } - if (type === 'Amplifier') { - // done 🎉 - cfg.strokeOpacity = 0.5; - } - // done 🎉 - if (music === 'classic' && type === 'Tenor') { - cfg.strokeOpacity = 0.5; - } - if (music === 'metal' && type === 'Keyboard') { - cfg.strokeOpacity = 0.5; - } - // done 🎉 - if (music === 'pop') { - if (type === 'Keyboard') { - cfg.strokeOpacity = 0.8; - } - } - if (music === 'electronic' && type === 'Keyboard') { - cfg.strokeOpacity = 0.5; - } - if (music === 'electronic' && type === 'Drum') { - cfg.strokeOpacity = 0.3; - } - if (themeMode === 'light') { - cfg.strokeOpacity *= 1.2; - } - return cfg; - }, - shape: ({ type }: any) => { - if ( - ['Lead_guitar', 'Electri_bass', 'Rhythm_guitar'].indexOf( - type, - ) !== -1 - ) { - return 'smooth'; - } - return music === 'classic' || music === 'pop' ? 'smooth' : ''; - }, - }, - }, - { - type: 'point', - xField: 'x', - yField: 'y', - colorField: 'type', - mapping: { - color: [ - '#6D5EFF', - '#F5BE15', - '#5B8FF9', - '#EE8CB7', - '#60DCAB', - '#76D4F9', - ], - style: (datum: any) => { - const cfg: any = { r: 0, lineWidth: 0 }; - const musicDataIdx = musicData.findIndex( - (d) => - d.type === datum.type && d.x === datum.x && d.y === datum.y, - ); - if (music === 'metal') { - cfg.r = - musicDataIdx % 3 === 0 ? 0 : themeMode === 'light' ? 2 : 1.5; - } - if (music === 'classic') { - cfg.r = 2; - } - if (music === 'electronic') { - cfg.r = 1.5; - } - // 流行音乐 🎵:第一和第三条和第六条线是曲线,其余直线,第 5 条带圆形○标记 - if (music === 'pop') { - cfg.r = datum.type === 'Rhythm_guitar' ? 2 : 0; - } - // 小设备 - if (width320) { - if (music === 'metal') { - cfg.r *= 0.65; - } - } - return cfg; - }, - // note: 重金属(metal) 使用三角形, 古典音乐(classic)使用菱形 - shape: (type: string) => { - return music === 'metal' - ? 'triangle' - : music === 'classic' - ? 'diamond' - : 'breath-point'; - }, - }, - }, - ], - }, - { - // vis-time: 0、6、12、18 的时间刻度 (同步 vis-donut) - data: [ - { x: '0:00', y: 1 }, - { x: '6:00', y: 1 }, - { x: '12:00', y: 1 }, - { x: '18:00', y: 1 }, - ], - region: { - start: { x: 0.18, y: 0.18 }, - end: { x: 0.82, y: 0.82 }, - }, - coordinate: { - type: 'polar', - cfg: { radius: 1 }, - }, - geometries: [ - { - type: 'interval', - xField: 'x', - yField: 'y', - label: { - autoRotate: false, - fields: ['x'], - callback: (x: string) => { - const cfg: any = { - style: { - fill: theme.textColor, - fontSize: 10, - fontFamily: FONT_FAMILY, - }, - content: x, - offset: 4, - labelLine: { - style: { - stroke: theme.textColor, - strokeOpacity: 0.65, - lineWidth: 0.8, - }, - }, - }; - - if (x === '0:00') { - cfg.style.textBaseline = 'bottom'; - } - if (x === '6:00') { - cfg.style.textAlign = 'left'; - cfg.offsetX = 4; - } - if (x === '12:00') { - cfg.style.textBaseline = 'top'; - cfg.offsetY = 4; - } - if (x === '18:00') { - cfg.style.textAlign = 'right'; - cfg.offsetX = -4; - } - return cfg; - }, - }, - mapping: { color: 'transparent', style: { fill: 'transparent' } }, - }, - ], - }, - { - data: FrameworkData, - coordinate: { - type: 'polar', - cfg: { - radius: 0.48 /** 比 0.46 大一点 */, - startAngle: waterdropStartAngle, - endAngle: waterdropEndAngle, - }, - }, - axes: false, - geometries: [ - { - type: 'interval', - xField: 'x', - yField: 'y', - colorField: 'x', - label: { - fields: ['x'], - callback: (x: string) => { - const framework = favoriteFramework || 'bymyself'; - const selected = - framework === lowerCase(x) || - (framework === 'bymyself' && x === 'Bymyself'); - return { - autoRotate: true, - labelEmit: true, - content: selected - ? lowerCase(x) === 'bymyself' - ? 'My lib' - : x - : ' ', - offset: '-45%', - style: { - fill: - themeMode === 'light' - ? theme.textColor - : theme.backgroundColor, - fontSize: 10, - fontFamily: FONT_FAMILY, - }, - }; - }, - }, - mapping: { - color: ({ x }: any) => { - const colorMap: any = { - react: '#5ED3F3', - bymyself: '#C2C8D5', - vue: '#3FB37F', - angular: '#BC052B', - }; - return colorMap[lowerCase(x)]; - }, - shape: 'waterdrop', - size: () => { - if (width280) { - return 22; - } - return 35; - }, - style: ({ x }: any) => { - // 根据高亮设置 - const strokeMap: any = { - react: 'rgba(94,211,243,0.5)', - angular: 'rgba(215,2,47,0.5)', - vue: 'rgba(63,179,127,0.5)', - bymyself: 'rgba(194,200,213,0.5)', - }; - - const framework = favoriteFramework || 'bymyself'; - const selected = - framework === lowerCase(x) || - (framework === 'bymyself' && x === 'Bymyself'); - return { - fillOpacity: selected ? 1 : 0.65, - lineWidth: selected ? (width280 ? 1.2 : 1.5) : 0, - stroke: strokeMap[lowerCase(x)], - }; - }, - }, - }, - ], - }, - { - region: { - start: { x: 0, y: 0 }, - end: { x: 1, y: 1 }, - }, - data: [ - { x: '1', y: 38 }, - { x: '2', y: 33.7 }, - { x: '3', y: 25.8 }, - { x: '4', y: 31.7 }, - { x: '6', y: 33 }, - { x: '7', y: 46 }, - { x: '8', y: 38.3 }, - { x: '9', y: 28 }, - { x: '10', y: 42.5 }, - { x: '11', population: 42.5 }, - { x: '12', population: 42.5 }, - { x: DAILY_SCHEDULE_TEXT, y: 41.8 }, - { x: '13', population: 42.5 }, - { x: '14', population: 42.5 }, - { x: '15', population: 42.5 }, - { x: '17', y: 30.3 }, - ], - coordinate: { - type: 'polar', - cfg: { radius: 1, innerRadius: 0.65 }, - }, - geometries: [ - { - type: 'interval', - xField: 'x', - yField: '1', - label: { - fields: ['x'], - callback: (x: string) => { - return { - autoRotate: false, - content: [DAILY_SCHEDULE_TEXT].indexOf(x) !== -1 ? x : ' ', - offset: 25, - offsetX: 10, - style: { - fill: theme.subTextColor, - fontSize: 10, - fontFamily: FONT_FAMILY, - fontWeight: 700, - textAlign: 'left', - }, - }; - }, - }, - mapping: { - color: 'transparent', - }, - }, - ], - }, - { - region: { - start: { x: 0.125, y: 0.125 }, - end: { x: 0.875, y: 0.875 }, - }, - data: [ - { x: '1', y: 38 }, - { x: '2', y: 33.7 }, - { x: '3', y: 25.8 }, - { x: MUSIC_TEXT, y: 30.7 }, - { x: '4', y: 31.7 }, - { x: '6', y: 33 }, - { x: '7', y: 46 }, - { x: '8', y: 38.3 }, - { x: '9', y: 28 }, - { x: '10', y: 42.5 }, - { x: '11', population: 42.5 }, - { x: '12', population: 42.5 }, - { x: '13', population: 42.5 }, - { x: '14', population: 42.5 }, - { x: '15', population: 42.5 }, - { x: '17', y: 30.3 }, - ], - coordinate: { - type: 'polar', - cfg: { radius: 0.7, innerRadius: 0.65 }, - }, - geometries: [ - { - type: 'interval', - xField: 'x', - yField: '1', - label: { - fields: ['x'], - callback: (x: string) => { - return { - autoRotate: false, - content: [MUSIC_TEXT].indexOf(x) !== -1 ? x : ' ', - offset: 20, - offsetX: -8, - style: { - fill: theme.subTextColor, - fontSize: 10, - fontFamily: FONT_FAMILY, - fontWeight: 700, - }, - }; - }, - }, - mapping: { - color: 'transparent', - }, - }, - ], - }, - ]; -}; - -type Props = { - theme: { - backgroundColor: string; - textColor: string; - subTextColor: string; - /** 环图 */ - dailySchedule: { - data: Array<{ x: string; y: number | string }>; - color: string[]; - customStyle: { - fontFill: string; - }; - style: { - stroke?: string; - strokeWidth?: number; - }; - annotations: Array<{ content: string; fontSize: number }>; - }; - }; - /** 最喜欢的 ide */ - favoriteIDE: 'vim' | 'webstorm' | 'vscode' | 'atom'; - /** 最喜欢的前端框架 */ - favoriteFramework: string | 'react' | 'vue' | 'angular' | 'bymyself'; - /** 工作效率 高效时间段 */ - efficientWorktime: 'morning' | 'afternoon' | 'dawn' | 'night' | 'midnight'; - /** 喜欢听的音乐 🎵 */ - music: 'classic' | 'metal' | 'electronic' | 'pop'; - themeMode: 'dark' | 'light'; - /** */ - afterChartRender: () => void; -}; - -export const VisCanvas = forwardRef((props: Props, ref: any) => { - const { theme } = props; - - /** - * 同步 forward ref - * @param source - * @param target - */ - function syncRef(source: any, target: any) { - if (typeof target === 'function') { - target(source.current); - } else if (target) { - target.current = source.current; - } - } - - const plotRef = useRef(); - const containerRef = useRef(null); - - useLayoutEffect(() => { - if (plotRef.current) { - plotRef.current.destroy(); - } - - const { Lab } = require('@antv/g2plot/dist/g2plot.min.js'); - require('./shapes/waterdrop'); - require('./shapes/breath-point'); - - if (containerRef?.current) { - const container = containerRef.current; - const box = container.getBoundingClientRect(); - const canvasBox = document - .querySelector(`.${styles.canvas}`) - ?.getBoundingClientRect(); - - const appendPadding = [0, 0, 0, 0]; - const actualBox = box.height !== 0 ? box : canvasBox; - const width280 = box && Math.min(box?.height, box?.width) < 280; - - if (props.efficientWorktime === 'afternoon') { - appendPadding[0] = width280 ? -36 : -56; - } - const mvPlot = new Lab.MultiView(container, { - height: actualBox?.height || 400, // 441 /* 372 + 40 */, - autoFit: true, - padding: 0, - appendPadding, - tooltip: false, - views: getViews(props, actualBox), - syncViewPadding: true, - theme: { - background: theme.backgroundColor, - }, - }); - - mvPlot.render(); - // fix hack 下主题设置 - mvPlot.chart.views[0].theme({ roseWidthRatio: 0.6 }); - mvPlot.chart.render(true); - plotRef.current = mvPlot; - syncRef(plotRef, ref); - // 触发 afterRender 操作 - props.afterChartRender(); - } - }, [containerRef, props]); - - return ( -
-
-
- ); -}); diff --git a/site/components/D2Chart/datas/dailySchedule.ts b/site/components/D2Chart/datas/dailySchedule.ts deleted file mode 100644 index c5c70de9e..000000000 --- a/site/components/D2Chart/datas/dailySchedule.ts +++ /dev/null @@ -1,891 +0,0 @@ -/** DONE 👏 🎉 */ -export const DAWN_DAILY_SCHEDULE = [ - { type: 'male', x: 'x', y: null, time: 'dawn' }, - { type: 'female', x: 'x', y: null, time: 'dawn' }, - { type: 'male', x: '0:00', y: 133, time: 'dawn' }, - { type: 'female', x: '0:00', y: 106.4, time: 'dawn' }, - { type: 'male', x: '0:15', y: 106.4, time: 'dawn' }, - { type: 'female', x: '0:15', y: 85.12, time: 'dawn' }, - { type: 'male', x: '0:30', y: 65, time: 'dawn' }, - { type: 'female', x: '0:30', y: 52, time: 'dawn' }, - { type: 'male', x: '0:45', y: 52, time: 'dawn' }, - { type: 'female', x: '0:45', y: 41.6, time: 'dawn' }, - { type: 'male', x: '1:00', y: 26, time: 'dawn' }, - { type: 'female', x: '1:00', y: 20.8, time: 'dawn' }, - { type: 'male', x: '1:15', y: 20.8, time: 'dawn' }, - { type: 'female', x: '1:15', y: 16.64, time: 'dawn' }, - { type: 'male', x: '1:30', y: 36, time: 'dawn' }, - { type: 'female', x: '1:30', y: 28.8, time: 'dawn' }, - { type: 'male', x: '1:45', y: 28.8, time: 'dawn' }, - { type: 'female', x: '1:45', y: 23.040000000000003, time: 'dawn' }, - { type: 'male', x: '2:00', y: 181, time: 'dawn' }, - { type: 'female', x: '2:00', y: 144.8, time: 'dawn' }, - { type: 'male', x: '2:15', y: 144.8, time: 'dawn' }, - { type: 'female', x: '2:15', y: 115.84000000000002, time: 'dawn' }, - { type: 'male', x: '2:30', y: 206, time: 'dawn' }, - { type: 'female', x: '2:30', y: 164.8, time: 'dawn' }, - { type: 'male', x: '2:45', y: 164.8, time: 'dawn' }, - { type: 'female', x: '2:45', y: 131.84, time: 'dawn' }, - { type: 'male', x: '3:00', y: 148, time: 'dawn' }, - { type: 'female', x: '3:00', y: 118.4, time: 'dawn' }, - { type: 'male', x: '3:15', y: 118.4, time: 'dawn' }, - { type: 'female', x: '3:15', y: 94.72000000000001, time: 'dawn' }, - { type: 'male', x: '3:30', y: 201, time: 'dawn' }, - { type: 'female', x: '3:30', y: 160.8, time: 'dawn' }, - { type: 'male', x: '3:45', y: 160.8, time: 'dawn' }, - { type: 'female', x: '3:45', y: 128.64000000000001, time: 'dawn' }, - { type: 'male', x: '4:00', y: 104, time: 'dawn' }, - { type: 'female', x: '4:00', y: 83.2, time: 'dawn' }, - { type: 'male', x: '4:15', y: 83.2, time: 'dawn' }, - { type: 'female', x: '4:15', y: 66.56, time: 'dawn' }, - { type: 'male', x: '4:30', y: 178, time: 'dawn' }, - { type: 'female', x: '4:30', y: 142.4, time: 'dawn' }, - { type: 'male', x: '4:45', y: 142.4, time: 'dawn' }, - { type: 'female', x: '4:45', y: 113.92000000000002, time: 'dawn' }, - { type: 'male', x: '5:00', y: 174, time: 'dawn' }, - { type: 'female', x: '5:00', y: 139.20000000000002, time: 'dawn' }, - { type: 'male', x: '5:15', y: 139.2, time: 'dawn' }, - { type: 'female', x: '5:15', y: 111.36, time: 'dawn' }, - { type: 'male', x: '5:30', y: 149, time: 'dawn' }, - { type: 'female', x: '5:30', y: 119.2, time: 'dawn' }, - { type: 'male', x: '5:45', y: 119.2, time: 'dawn' }, - { type: 'female', x: '5:45', y: 95.36000000000001, time: 'dawn' }, - { type: 'male', x: '6:00', y: 85, time: 'dawn' }, - { type: 'female', x: '6:00', y: 68, time: 'dawn' }, - { type: 'male', x: '6:15', y: 68, time: 'dawn' }, - { type: 'female', x: '6:15', y: 54.400000000000006, time: 'dawn' }, - { type: 'male', x: '6:30', y: 116, time: 'dawn' }, - { type: 'female', x: '6:30', y: 92.80000000000001, time: 'dawn' }, - { type: 'male', x: '6:45', y: 92.8, time: 'dawn' }, - { type: 'female', x: '6:45', y: 74.24, time: 'dawn' }, - { type: 'male', x: '7:00', y: 150, time: 'dawn' }, - { type: 'female', x: '7:00', y: 120, time: 'dawn' }, - { type: 'male', x: '7:15', y: 120, time: 'dawn' }, - { type: 'female', x: '7:15', y: 96, time: 'dawn' }, - { type: 'male', x: '7:30', y: 245, time: 'dawn' }, - { type: 'female', x: '7:30', y: 196, time: 'dawn' }, - { type: 'male', x: '7:45', y: 196, time: 'dawn' }, - { type: 'female', x: '7:45', y: 156.8, time: 'dawn' }, - { type: 'male', x: '8:00', y: 160, time: 'dawn' }, - { type: 'female', x: '8:00', y: 128, time: 'dawn' }, - { type: 'male', x: '8:15', y: 128, time: 'dawn' }, - { type: 'female', x: '8:15', y: 102.4, time: 'dawn' }, - { type: 'male', x: '8:30', y: 199, time: 'dawn' }, - { type: 'female', x: '8:30', y: 159.20000000000002, time: 'dawn' }, - { type: 'male', x: '8:45', y: 159.2, time: 'dawn' }, - { type: 'female', x: '8:45', y: 127.36, time: 'dawn' }, - { type: 'male', x: '9:00', y: 94, time: 'dawn' }, - { type: 'female', x: '9:00', y: 75.2, time: 'dawn' }, - { type: 'male', x: '9:15', y: 75.2, time: 'dawn' }, - { type: 'female', x: '9:15', y: 60.160000000000004, time: 'dawn' }, - { type: 'male', x: '9:30', y: 199, time: 'dawn' }, - { type: 'female', x: '9:30', y: 159.20000000000002, time: 'dawn' }, - { type: 'male', x: '9:45', y: 159.2, time: 'dawn' }, - { type: 'female', x: '9:45', y: 127.36, time: 'dawn' }, - { type: 'male', x: '10:00', y: 90, time: 'dawn' }, - { type: 'female', x: '10:00', y: 72, time: 'dawn' }, - { type: 'male', x: '10:15', y: 72, time: 'dawn' }, - { type: 'female', x: '10:15', y: 57.6, time: 'dawn' }, - { type: 'male', x: '10:30', y: 57, time: 'dawn' }, - { type: 'female', x: '10:30', y: 45.6, time: 'dawn' }, - { type: 'male', x: '10:45', y: 45.6, time: 'dawn' }, - { type: 'female', x: '10:45', y: 36.480000000000004, time: 'dawn' }, - { type: 'male', x: '11:00', y: 41, time: 'dawn' }, - { type: 'female', x: '11:00', y: 32.800000000000004, time: 'dawn' }, - { type: 'male', x: '11:15', y: 32.8, time: 'dawn' }, - { type: 'female', x: '11:15', y: 26.24, time: 'dawn' }, - { type: 'male', x: '11:30', y: 35, time: 'dawn' }, - { type: 'female', x: '11:30', y: 28, time: 'dawn' }, - { type: 'male', x: '11:45', y: 28, time: 'dawn' }, - { type: 'female', x: '11:45', y: 22.400000000000002, time: 'dawn' }, - { type: 'male', x: '12:00', y: 79, time: 'dawn' }, - { type: 'female', x: '12:00', y: 63.2, time: 'dawn' }, - { type: 'male', x: '12:15', y: 63.2, time: 'dawn' }, - { type: 'female', x: '12:15', y: 50.56, time: 'dawn' }, - { type: 'male', x: '12:30', y: 112, time: 'dawn' }, - { type: 'female', x: '12:30', y: 89.60000000000001, time: 'dawn' }, - { type: 'male', x: '12:45', y: 89.6, time: 'dawn' }, - { type: 'female', x: '12:45', y: 71.67999999999999, time: 'dawn' }, - { type: 'male', x: '13:00', y: 90, time: 'dawn' }, - { type: 'female', x: '13:00', y: 72, time: 'dawn' }, - { type: 'male', x: '13:15', y: 72, time: 'dawn' }, - { type: 'female', x: '13:15', y: 57.6, time: 'dawn' }, - { type: 'male', x: '13:30', y: 238, time: 'dawn' }, - { type: 'female', x: '13:30', y: 190.4, time: 'dawn' }, - { type: 'male', x: '13:45', y: 190.4, time: 'dawn' }, - { type: 'female', x: '13:45', y: 152.32000000000002, time: 'dawn' }, - { type: 'male', x: '14:00', y: 335, time: 'dawn' }, - { type: 'female', x: '14:00', y: 268, time: 'dawn' }, - { type: 'male', x: '14:15', y: 268, time: 'dawn' }, - { type: 'female', x: '14:15', y: 214.4, time: 'dawn' }, - { type: 'male', x: '14:30', y: 309, time: 'dawn' }, - { type: 'female', x: '14:30', y: 247.20000000000002, time: 'dawn' }, - { type: 'male', x: '14:45', y: 247.2, time: 'dawn' }, - { type: 'female', x: '14:45', y: 197.76, time: 'dawn' }, - { type: 'male', x: '15:00', y: 287, time: 'dawn' }, - { type: 'female', x: '15:00', y: 229.60000000000002, time: 'dawn' }, - { type: 'male', x: '15:15', y: 229.6, time: 'dawn' }, - { type: 'female', x: '15:15', y: 183.68, time: 'dawn' }, - { type: 'male', x: '15:30', y: 336, time: 'dawn' }, - { type: 'female', x: '15:30', y: 268.8, time: 'dawn' }, - { type: 'male', x: '15:45', y: 268.8, time: 'dawn' }, - { type: 'female', x: '15:45', y: 215.04000000000002, time: 'dawn' }, - { type: 'male', x: '16:00', y: 375, time: 'dawn' }, - { type: 'female', x: '16:00', y: 300, time: 'dawn' }, - { type: 'male', x: '16:15', y: 300, time: 'dawn' }, - { type: 'female', x: '16:15', y: 240, time: 'dawn' }, - { type: 'male', x: '16:30', y: 463, time: 'dawn' }, - { type: 'female', x: '16:30', y: 370.40000000000003, time: 'dawn' }, - { type: 'male', x: '16:45', y: 370.4, time: 'dawn' }, - { type: 'female', x: '16:45', y: 296.32, time: 'dawn' }, - { type: 'male', x: '17:00', y: 265, time: 'dawn' }, - { type: 'female', x: '17:00', y: 212, time: 'dawn' }, - { type: 'male', x: '17:15', y: 212, time: 'dawn' }, - { type: 'female', x: '17:15', y: 169.60000000000002, time: 'dawn' }, - { type: 'male', x: '17:30', y: 600, time: 'dawn' }, - { type: 'female', x: '17:30', y: 480, time: 'dawn' }, - { type: 'male', x: '17:45', y: 480, time: 'dawn' }, - { type: 'female', x: '17:45', y: 384, time: 'dawn' }, - { type: 'male', x: '18:00', y: 572, time: 'dawn' }, - { type: 'female', x: '18:00', y: 457.6, time: 'dawn' }, - { type: 'male', x: '18:15', y: 457.6, time: 'dawn' }, - { type: 'female', x: '18:15', y: 366.08000000000004, time: 'dawn' }, - { type: 'male', x: '18:30', y: 512, time: 'dawn' }, - { type: 'female', x: '18:30', y: 409.6, time: 'dawn' }, - { type: 'male', x: '18:45', y: 409.6, time: 'dawn' }, - { type: 'female', x: '18:45', y: 327.68000000000006, time: 'dawn' }, - { type: 'male', x: '19:00', y: 646, time: 'dawn' }, - { type: 'female', x: '19:00', y: 516.8000000000001, time: 'dawn' }, - { type: 'male', x: '19:15', y: 516.8, time: 'dawn' }, - { type: 'female', x: '19:15', y: 413.44, time: 'dawn' }, - { type: 'male', x: '19:30', y: 747, time: 'dawn' }, - { type: 'female', x: '19:30', y: 597.6, time: 'dawn' }, - { type: 'male', x: '19:45', y: 597.6, time: 'dawn' }, - { type: 'female', x: '19:45', y: 478.08000000000004, time: 'dawn' }, - { type: 'male', x: '20:00', y: 699, time: 'dawn' }, - { type: 'female', x: '20:00', y: 559.2, time: 'dawn' }, - { type: 'male', x: '20:15', y: 559.2, time: 'dawn' }, - { type: 'female', x: '20:15', y: 447.36000000000007, time: 'dawn' }, - { type: 'male', x: '20:30', y: 729, time: 'dawn' }, - { type: 'female', x: '20:30', y: 583.2, time: 'dawn' }, - { type: 'male', x: '20:45', y: 583.2, time: 'dawn' }, - { type: 'female', x: '20:45', y: 466.56000000000006, time: 'dawn' }, - { type: 'male', x: '21:00', y: 734, time: 'dawn' }, - { type: 'female', x: '21:00', y: 587.2, time: 'dawn' }, - { type: 'male', x: '21:15', y: 587.2, time: 'dawn' }, - { type: 'female', x: '21:15', y: 469.76000000000005, time: 'dawn' }, - { type: 'male', x: '21:30', y: 672, time: 'dawn' }, - { type: 'female', x: '21:30', y: 537.6, time: 'dawn' }, - { type: 'male', x: '21:45', y: 537.6, time: 'dawn' }, - { type: 'female', x: '21:45', y: 430.08000000000004, time: 'dawn' }, - { type: 'male', x: '22:00', y: 690, time: 'dawn' }, - { type: 'female', x: '22:00', y: 552, time: 'dawn' }, - { type: 'male', x: '22:15', y: 552, time: 'dawn' }, - { type: 'female', x: '22:15', y: 441.6, time: 'dawn' }, - { type: 'male', x: '22:30', y: 427, time: 'dawn' }, - { type: 'female', x: '22:30', y: 341.6, time: 'dawn' }, - { type: 'male', x: '22:45', y: 341.6, time: 'dawn' }, - { type: 'female', x: '22:45', y: 273.28000000000003, time: 'dawn' }, - { type: 'male', x: '23:00', y: 273, time: 'dawn' }, - { type: 'female', x: '23:00', y: 218.4, time: 'dawn' }, - { type: 'male', x: '23:15', y: 218.4, time: 'dawn' }, - { type: 'female', x: '23:15', y: 174.72000000000003, time: 'dawn' }, - { type: 'male', x: '23:30', y: 352, time: 'dawn' }, - { type: 'female', x: '23:30', y: 281.6, time: 'dawn' }, - { type: 'male', x: '23:45', y: 281.6, time: 'dawn' }, - { type: 'female', x: '23:45', y: 225.28000000000003, time: 'dawn' }, -]; - -// DONE 👏 🎉 -export const NIGHT_DAILY_SCHEDULE = [ - { type: 'male', x: 'x', y: null, time: 'night' }, - { type: 'female', x: 'x', y: null, time: 'night' }, - { type: 'male', x: '0:00', y: 688, time: 'night' }, - { type: 'female', x: '0:00', y: 550.4, time: 'night' }, - { type: 'male', x: '0:15', y: 550.4, time: 'night' }, - { type: 'female', x: '0:15', y: 440.32, time: 'night' }, - { type: 'male', x: '0:30', y: 844, time: 'night' }, - { type: 'female', x: '0:30', y: 675.2, time: 'night' }, - { type: 'male', x: '0:45', y: 675.2, time: 'night' }, - { type: 'female', x: '0:45', y: 540.1600000000001, time: 'night' }, - { type: 'male', x: '1:00', y: 703, time: 'night' }, - { type: 'female', x: '1:00', y: 562.4, time: 'night' }, - { type: 'male', x: '1:15', y: 562.4, time: 'night' }, - { type: 'female', x: '1:15', y: 449.92, time: 'night' }, - { type: 'male', x: '1:30', y: 839, time: 'night' }, - { type: 'female', x: '1:30', y: 671.2, time: 'night' }, - { type: 'male', x: '1:45', y: 671.2, time: 'night' }, - { type: 'female', x: '1:45', y: 536.96, time: 'night' }, - { type: 'male', x: '2:00', y: 883, time: 'night' }, - { type: 'female', x: '2:00', y: 706.4000000000001, time: 'night' }, - { type: 'male', x: '2:15', y: 706.4, time: 'night' }, - { type: 'female', x: '2:15', y: 565.12, time: 'night' }, - { type: 'male', x: '2:30', y: 646, time: 'night' }, - { type: 'female', x: '2:30', y: 516.8000000000001, time: 'night' }, - { type: 'male', x: '2:45', y: 516.8, time: 'night' }, - { type: 'female', x: '2:45', y: 413.44, time: 'night' }, - { type: 'male', x: '3:00', y: 206, time: 'night' }, - { type: 'female', x: '3:00', y: 164.8, time: 'night' }, - { type: 'male', x: '3:15', y: 164.8, time: 'night' }, - { type: 'female', x: '3:15', y: 131.84, time: 'night' }, - { type: 'male', x: '3:30', y: 41, time: 'night' }, - { type: 'female', x: '3:30', y: 32.800000000000004, time: 'night' }, - { type: 'male', x: '3:45', y: 32.8, time: 'night' }, - { type: 'female', x: '3:45', y: 26.24, time: 'night' }, - { type: 'male', x: '4:00', y: 102, time: 'night' }, - { type: 'female', x: '4:00', y: 81.60000000000001, time: 'night' }, - { type: 'male', x: '4:15', y: 81.6, time: 'night' }, - { type: 'female', x: '4:15', y: 65.28, time: 'night' }, - { type: 'male', x: '4:30', y: 47, time: 'night' }, - { type: 'female', x: '4:30', y: 37.6, time: 'night' }, - { type: 'male', x: '4:45', y: 37.6, time: 'night' }, - { type: 'female', x: '4:45', y: 30.080000000000002, time: 'night' }, - { type: 'male', x: '5:00', y: 102, time: 'night' }, - { type: 'female', x: '5:00', y: 81.60000000000001, time: 'night' }, - { type: 'male', x: '5:15', y: 81.6, time: 'night' }, - { type: 'female', x: '5:15', y: 65.28, time: 'night' }, - { type: 'male', x: '5:30', y: 61, time: 'night' }, - { type: 'female', x: '5:30', y: 48.800000000000004, time: 'night' }, - { type: 'male', x: '5:45', y: 48.8, time: 'night' }, - { type: 'female', x: '5:45', y: 39.04, time: 'night' }, - { type: 'male', x: '6:00', y: 75, time: 'night' }, - { type: 'female', x: '6:00', y: 60, time: 'night' }, - { type: 'male', x: '6:15', y: 60, time: 'night' }, - { type: 'female', x: '6:15', y: 48, time: 'night' }, - { type: 'male', x: '6:30', y: 52, time: 'night' }, - { type: 'female', x: '6:30', y: 41.6, time: 'night' }, - { type: 'male', x: '6:45', y: 41.6, time: 'night' }, - { type: 'female', x: '6:45', y: 33.28, time: 'night' }, - { type: 'male', x: '7:00', y: 55, time: 'night' }, - { type: 'female', x: '7:00', y: 44, time: 'night' }, - { type: 'male', x: '7:15', y: 44, time: 'night' }, - { type: 'female', x: '7:15', y: 35.2, time: 'night' }, - { type: 'male', x: '7:30', y: 20, time: 'night' }, - { type: 'female', x: '7:30', y: 16, time: 'night' }, - { type: 'male', x: '7:45', y: 16, time: 'night' }, - { type: 'female', x: '7:45', y: 12.8, time: 'night' }, - { type: 'male', x: '8:00', y: 65, time: 'night' }, - { type: 'female', x: '8:00', y: 52, time: 'night' }, - { type: 'male', x: '8:15', y: 52, time: 'night' }, - { type: 'female', x: '8:15', y: 41.6, time: 'night' }, - { type: 'male', x: '8:30', y: 26, time: 'night' }, - { type: 'female', x: '8:30', y: 20.8, time: 'night' }, - { type: 'male', x: '8:45', y: 20.8, time: 'night' }, - { type: 'female', x: '8:45', y: 16.64, time: 'night' }, - { type: 'male', x: '9:00', y: 36, time: 'night' }, - { type: 'female', x: '9:00', y: 28.8, time: 'night' }, - { type: 'male', x: '9:15', y: 28.8, time: 'night' }, - { type: 'female', x: '9:15', y: 23.040000000000003, time: 'night' }, - { type: 'male', x: '9:30', y: 181, time: 'night' }, - { type: 'female', x: '9:30', y: 144.8, time: 'night' }, - { type: 'male', x: '9:45', y: 144.8, time: 'night' }, - { type: 'female', x: '9:45', y: 115.84000000000002, time: 'night' }, - { type: 'male', x: '10:00', y: 206, time: 'night' }, - { type: 'female', x: '10:00', y: 164.8, time: 'night' }, - { type: 'male', x: '10:15', y: 164.8, time: 'night' }, - { type: 'female', x: '10:15', y: 131.84, time: 'night' }, - { type: 'male', x: '10:30', y: 148, time: 'night' }, - { type: 'female', x: '10:30', y: 118.4, time: 'night' }, - { type: 'male', x: '10:45', y: 118.4, time: 'night' }, - { type: 'female', x: '10:45', y: 94.72000000000001, time: 'night' }, - { type: 'male', x: '11:00', y: 201, time: 'night' }, - { type: 'female', x: '11:00', y: 160.8, time: 'night' }, - { type: 'male', x: '11:15', y: 160.8, time: 'night' }, - { type: 'female', x: '11:15', y: 128.64000000000001, time: 'night' }, - { type: 'male', x: '11:30', y: 104, time: 'night' }, - { type: 'female', x: '11:30', y: 83.2, time: 'night' }, - { type: 'male', x: '11:45', y: 83.2, time: 'night' }, - { type: 'female', x: '11:45', y: 66.56, time: 'night' }, - { type: 'male', x: '12:00', y: 178, time: 'night' }, - { type: 'female', x: '12:00', y: 142.4, time: 'night' }, - { type: 'male', x: '12:15', y: 142.4, time: 'night' }, - { type: 'female', x: '12:15', y: 113.92000000000002, time: 'night' }, - { type: 'male', x: '12:30', y: 174, time: 'night' }, - { type: 'female', x: '12:30', y: 139.20000000000002, time: 'night' }, - { type: 'male', x: '12:45', y: 139.2, time: 'night' }, - { type: 'female', x: '12:45', y: 111.36, time: 'night' }, - { type: 'male', x: '13:00', y: 149, time: 'night' }, - { type: 'female', x: '13:00', y: 119.2, time: 'night' }, - { type: 'male', x: '13:15', y: 119.2, time: 'night' }, - { type: 'female', x: '13:15', y: 95.36000000000001, time: 'night' }, - { type: 'male', x: '13:30', y: 583, time: 'night' }, - { type: 'female', x: '13:30', y: 466.40000000000003, time: 'night' }, - { type: 'male', x: '13:45', y: 466.4, time: 'night' }, - { type: 'female', x: '13:45', y: 373.12, time: 'night' }, - { type: 'male', x: '14:00', y: 548, time: 'night' }, - { type: 'female', x: '14:00', y: 438.40000000000003, time: 'night' }, - { type: 'male', x: '14:15', y: 438.4, time: 'night' }, - { type: 'female', x: '14:15', y: 350.72, time: 'night' }, - { type: 'male', x: '14:30', y: 150, time: 'night' }, - { type: 'female', x: '14:30', y: 120, time: 'night' }, - { type: 'male', x: '14:45', y: 120, time: 'night' }, - { type: 'female', x: '14:45', y: 96, time: 'night' }, - { type: 'male', x: '15:00', y: 245, time: 'night' }, - { type: 'female', x: '15:00', y: 196, time: 'night' }, - { type: 'male', x: '15:15', y: 196, time: 'night' }, - { type: 'female', x: '15:15', y: 156.8, time: 'night' }, - { type: 'male', x: '15:30', y: 400, time: 'night' }, - { type: 'female', x: '15:30', y: 320, time: 'night' }, - { type: 'male', x: '15:45', y: 320, time: 'night' }, - { type: 'female', x: '15:45', y: 256, time: 'night' }, - { type: 'male', x: '16:00', y: 199, time: 'night' }, - { type: 'female', x: '16:00', y: 159.20000000000002, time: 'night' }, - { type: 'male', x: '16:15', y: 159.2, time: 'night' }, - { type: 'female', x: '16:15', y: 127.36, time: 'night' }, - { type: 'male', x: '16:30', y: 699, time: 'night' }, - { type: 'female', x: '16:30', y: 559.2, time: 'night' }, - { type: 'male', x: '16:45', y: 559.2, time: 'night' }, - { type: 'female', x: '16:45', y: 447.36000000000007, time: 'night' }, - { type: 'male', x: '17:00', y: 408, time: 'night' }, - { type: 'female', x: '17:00', y: 326.40000000000003, time: 'night' }, - { type: 'male', x: '17:15', y: 326.4, time: 'night' }, - { type: 'female', x: '17:15', y: 261.12, time: 'night' }, - { type: 'male', x: '17:30', y: 90, time: 'night' }, - { type: 'female', x: '17:30', y: 72, time: 'night' }, - { type: 'male', x: '17:45', y: 72, time: 'night' }, - { type: 'female', x: '17:45', y: 57.6, time: 'night' }, - { type: 'male', x: '18:00', y: 57, time: 'night' }, - { type: 'female', x: '18:00', y: 45.6, time: 'night' }, - { type: 'male', x: '18:15', y: 45.6, time: 'night' }, - { type: 'female', x: '18:15', y: 36.480000000000004, time: 'night' }, - { type: 'male', x: '18:30', y: 41, time: 'night' }, - { type: 'female', x: '18:30', y: 32.800000000000004, time: 'night' }, - { type: 'male', x: '18:45', y: 32.8, time: 'night' }, - { type: 'female', x: '18:45', y: 26.24, time: 'night' }, - { type: 'male', x: '19:00', y: 35, time: 'night' }, - { type: 'female', x: '19:00', y: 28, time: 'night' }, - { type: 'male', x: '19:15', y: 28, time: 'night' }, - { type: 'female', x: '19:15', y: 22.400000000000002, time: 'night' }, - { type: 'male', x: '19:30', y: 386, time: 'night' }, - { type: 'female', x: '19:30', y: 308.8, time: 'night' }, - { type: 'male', x: '19:45', y: 308.8, time: 'night' }, - { type: 'female', x: '19:45', y: 247.04000000000002, time: 'night' }, - { type: 'male', x: '20:00', y: 622, time: 'night' }, - { type: 'female', x: '20:00', y: 497.6, time: 'night' }, - { type: 'male', x: '20:15', y: 497.6, time: 'night' }, - { type: 'female', x: '20:15', y: 398.08000000000004, time: 'night' }, - { type: 'male', x: '20:30', y: 664, time: 'night' }, - { type: 'female', x: '20:30', y: 531.2, time: 'night' }, - { type: 'male', x: '20:45', y: 531.2, time: 'night' }, - { type: 'female', x: '20:45', y: 424.96000000000004, time: 'night' }, - { type: 'male', x: '21:00', y: 600, time: 'night' }, - { type: 'female', x: '21:00', y: 480, time: 'night' }, - { type: 'male', x: '21:15', y: 480, time: 'night' }, - { type: 'female', x: '21:15', y: 384, time: 'night' }, - { type: 'male', x: '21:30', y: 715, time: 'night' }, - { type: 'female', x: '21:30', y: 572, time: 'night' }, - { type: 'male', x: '21:45', y: 572, time: 'night' }, - { type: 'female', x: '21:45', y: 457.6, time: 'night' }, - { type: 'male', x: '22:00', y: 761, time: 'night' }, - { type: 'female', x: '22:00', y: 608.8000000000001, time: 'night' }, - { type: 'male', x: '22:15', y: 608.8, time: 'night' }, - { type: 'female', x: '22:15', y: 487.03999999999996, time: 'night' }, - { type: 'male', x: '22:30', y: 621, time: 'night' }, - { type: 'female', x: '22:30', y: 496.8, time: 'night' }, - { type: 'male', x: '22:45', y: 496.8, time: 'night' }, - { type: 'female', x: '22:45', y: 397.44000000000005, time: 'night' }, - { type: 'male', x: '23:00', y: 786, time: 'night' }, - { type: 'female', x: '23:00', y: 628.8000000000001, time: 'night' }, - { type: 'male', x: '23:15', y: 628.8, time: 'night' }, - { type: 'female', x: '23:15', y: 503.03999999999996, time: 'night' }, - { type: 'male', x: '23:30', y: 726, time: 'night' }, - { type: 'female', x: '23:30', y: 580.8000000000001, time: 'night' }, - { type: 'male', x: '23:45', y: 580.8, time: 'night' }, - { type: 'female', x: '23:45', y: 464.64, time: 'night' }, -]; - -// DONE 👏 -export const MIDNIGHT_DAILY_SCHEDULE = [ - { type: 'female', time: 'midnight', x: '0:00', y: 463 }, - { type: 'male', time: 'midnight', x: '0:15', y: 370.4 }, - { type: 'female', time: 'midnight', x: '0:30', y: 265 }, - { type: 'male', time: 'midnight', x: '0:45', y: 212 }, - { type: 'female', time: 'midnight', x: '1:00', y: 600 }, - { type: 'male', time: 'midnight', x: '1:15', y: 480 }, - { type: 'female', time: 'midnight', x: '1:30', y: 572 }, - { type: 'male', time: 'midnight', x: '1:45', y: 457.6 }, - { type: 'female', time: 'midnight', x: '2:00', y: 512 }, - { type: 'male', time: 'midnight', x: '2:15', y: 409.6 }, - { type: 'female', time: 'midnight', x: '2:30', y: 646 }, - { type: 'male', time: 'midnight', x: '2:45', y: 516.8 }, - { type: 'female', time: 'midnight', x: '3:00', y: 747 }, - { type: 'male', time: 'midnight', x: '3:15', y: 597.6 }, - { type: 'female', time: 'midnight', x: '3:30', y: 699 }, - { type: 'male', time: 'midnight', x: '3:45', y: 559.2 }, - { type: 'female', time: 'midnight', x: '4:00', y: 729 }, - { type: 'male', time: 'midnight', x: '4:15', y: 583.2 }, - { type: 'female', time: 'midnight', x: '4:30', y: 734 }, - { type: 'male', time: 'midnight', x: '4:45', y: 587.2 }, - { type: 'female', time: 'midnight', x: '5:00', y: 672 }, - { type: 'male', time: 'midnight', x: '5:15', y: 537.6 }, - { type: 'female', time: 'midnight', x: '5:30', y: 690 }, - { type: 'male', time: 'midnight', x: '5:45', y: 552 }, - { type: 'female', time: 'midnight', x: '6:00', y: 427 }, - { type: 'male', time: 'midnight', x: '6:15', y: 341.6 }, - { type: 'female', time: 'midnight', x: '6:30', y: 273 }, - { type: 'male', time: 'midnight', x: '6:45', y: 218.4 }, - { type: 'female', time: 'midnight', x: '7:00', y: 352 }, - { type: 'male', time: 'midnight', x: '7:15', y: 281.6 }, - { type: 'female', time: 'midnight', x: '7:30', y: 133 }, - { type: 'male', time: 'midnight', x: '7:45', y: 106.4 }, - { type: 'female', time: 'midnight', x: '8:00', y: 65 }, - { type: 'male', time: 'midnight', x: '8:15', y: 52 }, - { type: 'female', time: 'midnight', x: '8:30', y: 26 }, - { type: 'male', time: 'midnight', x: '8:45', y: 20.8 }, - { type: 'female', time: 'midnight', x: '9:00', y: 36 }, - { type: 'male', time: 'midnight', x: '9:15', y: 28.8 }, - { type: 'female', time: 'midnight', x: '9:30', y: 181 }, - { type: 'male', time: 'midnight', x: '9:45', y: 144.8 }, - { type: 'female', time: 'midnight', x: '10:00', y: 206 }, - { type: 'male', time: 'midnight', x: '10:15', y: 164.8 }, - { type: 'female', time: 'midnight', x: '10:30', y: 148 }, - { type: 'male', time: 'midnight', x: '10:45', y: 118.4 }, - { type: 'female', time: 'midnight', x: '11:00', y: 201 }, - { type: 'male', time: 'midnight', x: '11:15', y: 160.8 }, - { type: 'female', time: 'midnight', x: '11:30', y: 104 }, - { type: 'male', time: 'midnight', x: '11:45', y: 83.2 }, - { type: 'female', time: 'midnight', x: '12:00', y: 178 }, - { type: 'male', time: 'midnight', x: '12:15', y: 142.4 }, - { type: 'female', time: 'midnight', x: '12:30', y: 174 }, - { type: 'male', time: 'midnight', x: '12:45', y: 139.2 }, - { type: 'female', time: 'midnight', x: '13:00', y: 149 }, - { type: 'male', time: 'midnight', x: '13:15', y: 119.2 }, - { type: 'female', time: 'midnight', x: '13:30', y: 85 }, - { type: 'male', time: 'midnight', x: '13:45', y: 68 }, - { type: 'female', time: 'midnight', x: '14:00', y: 116 }, - { type: 'male', time: 'midnight', x: '14:15', y: 92.8 }, - { type: 'female', time: 'midnight', x: '14:30', y: 150 }, - { type: 'male', time: 'midnight', x: '14:45', y: 120 }, - { type: 'female', time: 'midnight', x: '15:00', y: 245 }, - { type: 'male', time: 'midnight', x: '15:15', y: 196 }, - { type: 'female', time: 'midnight', x: '15:30', y: 160 }, - { type: 'male', time: 'midnight', x: '15:45', y: 128 }, - { type: 'female', time: 'midnight', x: '16:00', y: 199 }, - { type: 'male', time: 'midnight', x: '16:15', y: 159.2 }, - { type: 'female', time: 'midnight', x: '16:30', y: 94 }, - { type: 'male', time: 'midnight', x: '16:45', y: 75.2 }, - { type: 'female', time: 'midnight', x: '17:00', y: 199 }, - { type: 'male', time: 'midnight', x: '17:15', y: 159.2 }, - { type: 'female', time: 'midnight', x: '17:30', y: 90 }, - { type: 'male', time: 'midnight', x: '17:45', y: 72 }, - { type: 'female', time: 'midnight', x: '18:00', y: 57 }, - { type: 'male', time: 'midnight', x: '18:15', y: 45.6 }, - { type: 'female', time: 'midnight', x: '18:30', y: 41 }, - { type: 'male', time: 'midnight', x: '18:45', y: 32.8 }, - { type: 'female', time: 'midnight', x: '19:00', y: 35 }, - { type: 'male', time: 'midnight', x: '19:15', y: 28 }, - { type: 'female', time: 'midnight', x: '19:30', y: 79 }, - { type: 'male', time: 'midnight', x: '19:45', y: 63.2 }, - { type: 'female', time: 'midnight', x: '20:00', y: 112 }, - { type: 'male', time: 'midnight', x: '20:15', y: 89.6 }, - { type: 'female', time: 'midnight', x: '20:30', y: 90 }, - { type: 'male', time: 'midnight', x: '20:45', y: 72 }, - { type: 'female', time: 'midnight', x: '21:00', y: 238 }, - { type: 'male', time: 'midnight', x: '21:15', y: 190.4 }, - { type: 'female', time: 'midnight', x: '21:30', y: 335 }, - { type: 'male', time: 'midnight', x: '21:45', y: 268 }, - { type: 'female', time: 'midnight', x: '22:00', y: 309 }, - { type: 'male', time: 'midnight', x: '22:15', y: 247.2 }, - { type: 'female', time: 'midnight', x: '22:30', y: 287 }, - { type: 'male', time: 'midnight', x: '22:45', y: 229.6 }, - { type: 'female', time: 'midnight', x: '23:00', y: 336 }, - { type: 'male', time: 'midnight', x: '23:15', y: 268.8 }, - { type: 'female', time: 'midnight', x: '23:30', y: 375 }, - { type: 'male', time: 'midnight', x: '23:45', y: 300 }, -]; - -// DONE 👏 🎉 -export const MORNING_DAILY_SCHEDULE = [ - { type: 'male', x: '1:30', y: 90, time: 'morning' }, - { type: 'female', x: '1:30', y: 72, time: 'morning' }, - { type: 'male', x: '1:45', y: 72, time: 'morning' }, - { type: 'female', x: '1:45', y: 57.6, time: 'morning' }, - { type: 'male', x: '2:00', y: 57, time: 'morning' }, - { type: 'female', x: '2:00', y: 45.6, time: 'morning' }, - { type: 'male', x: '2:15', y: 45.6, time: 'morning' }, - { type: 'female', x: '2:15', y: 36.480000000000004, time: 'morning' }, - { type: 'male', x: '2:30', y: 41, time: 'morning' }, - { type: 'female', x: '2:30', y: 32.800000000000004, time: 'morning' }, - { type: 'male', x: '2:45', y: 32.8, time: 'morning' }, - { type: 'female', x: '2:45', y: 26.24, time: 'morning' }, - { type: 'male', x: '3:00', y: 35, time: 'morning' }, - { type: 'female', x: '3:00', y: 28, time: 'morning' }, - { type: 'male', x: '3:15', y: 28, time: 'morning' }, - { type: 'female', x: '3:15', y: 22.400000000000002, time: 'morning' }, - { type: 'male', x: '3:30', y: 79, time: 'morning' }, - { type: 'female', x: '3:30', y: 63.2, time: 'morning' }, - { type: 'male', x: '3:45', y: 63.2, time: 'morning' }, - { type: 'female', x: '3:45', y: 50.56, time: 'morning' }, - { type: 'male', x: '4:00', y: 112, time: 'morning' }, - { type: 'female', x: '4:00', y: 89.60000000000001, time: 'morning' }, - { type: 'male', x: '4:15', y: 89.6, time: 'morning' }, - { type: 'female', x: '4:15', y: 71.67999999999999, time: 'morning' }, - { type: 'male', x: '4:30', y: 90, time: 'morning' }, - { type: 'female', x: '4:30', y: 72, time: 'morning' }, - { type: 'male', x: '4:45', y: 72, time: 'morning' }, - { type: 'female', x: '4:45', y: 57.6, time: 'morning' }, - { type: 'male', x: '5:00', y: 138, time: 'morning' }, - { type: 'female', x: '5:00', y: 110.4, time: 'morning' }, - { type: 'male', x: '5:15', y: 100.4, time: 'morning' }, - { type: 'female', x: '5:15', y: 80.32000000000001, time: 'morning' }, - { type: 'male', x: '5:30', y: 335, time: 'morning' }, - { type: 'female', x: '5:30', y: 268, time: 'morning' }, - { type: 'male', x: '5:45', y: 268, time: 'morning' }, - { type: 'female', x: '5:45', y: 214.4, time: 'morning' }, - { type: 'male', x: '6:00', y: 309, time: 'morning' }, - { type: 'female', x: '6:00', y: 247.20000000000002, time: 'morning' }, - { type: 'male', x: '6:15', y: 247.2, time: 'morning' }, - { type: 'female', x: '6:15', y: 197.76, time: 'morning' }, - { type: 'male', x: '6:30', y: 287, time: 'morning' }, - { type: 'female', x: '6:30', y: 229.60000000000002, time: 'morning' }, - { type: 'male', x: '6:45', y: 229.6, time: 'morning' }, - { type: 'female', x: '6:45', y: 183.68, time: 'morning' }, - { type: 'male', x: '7:00', y: 336, time: 'morning' }, - { type: 'female', x: '7:00', y: 268.8, time: 'morning' }, - { type: 'male', x: '7:15', y: 268.8, time: 'morning' }, - { type: 'female', x: '7:15', y: 215.04000000000002, time: 'morning' }, - { type: 'male', x: '7:30', y: 375, time: 'morning' }, - { type: 'female', x: '7:30', y: 300, time: 'morning' }, - { type: 'male', x: '7:45', y: 300, time: 'morning' }, - { type: 'female', x: '7:45', y: 240, time: 'morning' }, - { type: 'male', x: '8:00', y: 463, time: 'morning' }, - { type: 'female', x: '8:00', y: 370.40000000000003, time: 'morning' }, - { type: 'male', x: '8:15', y: 370.4, time: 'morning' }, - { type: 'female', x: '8:15', y: 296.32, time: 'morning' }, - { type: 'male', x: '8:30', y: 265, time: 'morning' }, - { type: 'female', x: '8:30', y: 212, time: 'morning' }, - { type: 'male', x: '8:45', y: 212, time: 'morning' }, - { type: 'female', x: '8:45', y: 169.60000000000002, time: 'morning' }, - { type: 'male', x: '9:00', y: 600, time: 'morning' }, - { type: 'female', x: '9:00', y: 480, time: 'morning' }, - { type: 'male', x: '9:15', y: 480, time: 'morning' }, - { type: 'female', x: '9:15', y: 384, time: 'morning' }, - { type: 'male', x: '9:30', y: 572, time: 'morning' }, - { type: 'female', x: '9:30', y: 457.6, time: 'morning' }, - { type: 'male', x: '9:45', y: 457.6, time: 'morning' }, - { type: 'female', x: '9:45', y: 366.08000000000004, time: 'morning' }, - { type: 'male', x: '10:00', y: 512, time: 'morning' }, - { type: 'female', x: '10:00', y: 409.6, time: 'morning' }, - { type: 'male', x: '10:15', y: 409.6, time: 'morning' }, - { type: 'female', x: '10:15', y: 327.68000000000006, time: 'morning' }, - { type: 'male', x: '10:30', y: 646, time: 'morning' }, - { type: 'female', x: '10:30', y: 516.8000000000001, time: 'morning' }, - { type: 'male', x: '10:45', y: 516.8, time: 'morning' }, - { type: 'female', x: '10:45', y: 413.44, time: 'morning' }, - { type: 'male', x: '11:00', y: 747, time: 'morning' }, - { type: 'female', x: '11:00', y: 597.6, time: 'morning' }, - { type: 'male', x: '11:15', y: 597.6, time: 'morning' }, - { type: 'female', x: '11:15', y: 478.08000000000004, time: 'morning' }, - { type: 'male', x: '11:30', y: 699, time: 'morning' }, - { type: 'female', x: '11:30', y: 559.2, time: 'morning' }, - { type: 'male', x: '11:45', y: 559.2, time: 'morning' }, - { type: 'female', x: '11:45', y: 447.36000000000007, time: 'morning' }, - { type: 'male', x: '12:00', y: 729, time: 'morning' }, - { type: 'female', x: '12:00', y: 583.2, time: 'morning' }, - { type: 'male', x: '12:15', y: 583.2, time: 'morning' }, - { type: 'female', x: '12:15', y: 466.56000000000006, time: 'morning' }, - { type: 'male', x: '12:30', y: 734, time: 'morning' }, - { type: 'female', x: '12:30', y: 587.2, time: 'morning' }, - { type: 'male', x: '12:45', y: 587.2, time: 'morning' }, - { type: 'female', x: '12:45', y: 469.76000000000005, time: 'morning' }, - { type: 'male', x: '13:00', y: 672, time: 'morning' }, - { type: 'female', x: '13:00', y: 537.6, time: 'morning' }, - { type: 'male', x: '13:15', y: 537.6, time: 'morning' }, - { type: 'female', x: '13:15', y: 430.08000000000004, time: 'morning' }, - { type: 'male', x: '13:30', y: 414, time: 'morning' }, - { type: 'female', x: '13:30', y: 331.20000000000005, time: 'morning' }, - { type: 'male', x: '13:45', y: 331.2, time: 'morning' }, - { type: 'female', x: '13:45', y: 264.96, time: 'morning' }, - { type: 'male', x: '14:00', y: 256.2, time: 'morning' }, - { type: 'female', x: '14:00', y: 204.96, time: 'morning' }, - { type: 'male', x: '14:15', y: 204.96, time: 'morning' }, - { type: 'female', x: '14:15', y: 163.96800000000002, time: 'morning' }, - { type: 'male', x: '14:30', y: 163.8, time: 'morning' }, - { type: 'female', x: '14:30', y: 131.04000000000002, time: 'morning' }, - { type: 'male', x: '14:45', y: 131.04, time: 'morning' }, - { type: 'female', x: '14:45', y: 104.832, time: 'morning' }, - { type: 'male', x: '15:00', y: 211.2, time: 'morning' }, - { type: 'female', x: '15:00', y: 168.96, time: 'morning' }, - { type: 'male', x: '15:15', y: 168.96, time: 'morning' }, - { type: 'female', x: '15:15', y: 135.168, time: 'morning' }, - { type: 'male', x: '15:30', y: 79.8, time: 'morning' }, - { type: 'female', x: '15:30', y: 63.84, time: 'morning' }, - { type: 'male', x: '15:45', y: 63.84, time: 'morning' }, - { type: 'female', x: '15:45', y: 51.072, time: 'morning' }, - { type: 'male', x: '16:00', y: 65, time: 'morning' }, - { type: 'female', x: '16:00', y: 52, time: 'morning' }, - { type: 'male', x: '16:15', y: 52, time: 'morning' }, - { type: 'female', x: '16:15', y: 41.6, time: 'morning' }, - { type: 'male', x: '16:30', y: 26, time: 'morning' }, - { type: 'female', x: '16:30', y: 20.8, time: 'morning' }, - { type: 'male', x: '16:45', y: 20.8, time: 'morning' }, - { type: 'female', x: '16:45', y: 16.64, time: 'morning' }, - { type: 'male', x: '17:00', y: 36, time: 'morning' }, - { type: 'female', x: '17:00', y: 28.8, time: 'morning' }, - { type: 'male', x: '17:15', y: 28.8, time: 'morning' }, - { type: 'female', x: '17:15', y: 23.040000000000003, time: 'morning' }, - { type: 'male', x: '17:30', y: 54.3, time: 'morning' }, - { type: 'female', x: '17:30', y: 43.44, time: 'morning' }, - { type: 'male', x: '17:45', y: 43.44, time: 'morning' }, - { type: 'female', x: '17:45', y: 34.752, time: 'morning' }, - { type: 'male', x: '18:00', y: 61.8, time: 'morning' }, - { type: 'female', x: '18:00', y: 49.44, time: 'morning' }, - { type: 'male', x: '18:15', y: 49.44, time: 'morning' }, - { type: 'female', x: '18:15', y: 39.552, time: 'morning' }, - { type: 'male', x: '18:30', y: 44.4, time: 'morning' }, - { type: 'female', x: '18:30', y: 35.52, time: 'morning' }, - { type: 'male', x: '18:45', y: 35.52, time: 'morning' }, - { type: 'female', x: '18:45', y: 28.416000000000004, time: 'morning' }, - { type: 'male', x: '19:00', y: 60.3, time: 'morning' }, - { type: 'female', x: '19:00', y: 48.24, time: 'morning' }, - { type: 'male', x: '19:15', y: 48.24, time: 'morning' }, - { type: 'female', x: '19:15', y: 38.592000000000006, time: 'morning' }, - { type: 'male', x: '19:30', y: 31.2, time: 'morning' }, - { type: 'female', x: '19:30', y: 24.96, time: 'morning' }, - { type: 'male', x: '19:45', y: 24.96, time: 'morning' }, - { type: 'female', x: '19:45', y: 19.968000000000004, time: 'morning' }, - { type: 'male', x: '20:00', y: 53.4, time: 'morning' }, - { type: 'female', x: '20:00', y: 42.72, time: 'morning' }, - { type: 'male', x: '20:15', y: 42.72, time: 'morning' }, - { type: 'female', x: '20:15', y: 34.176, time: 'morning' }, - { type: 'male', x: '20:30', y: 52.2, time: 'morning' }, - { type: 'female', x: '20:30', y: 41.760000000000005, time: 'morning' }, - { type: 'male', x: '20:45', y: 13.92, time: 'morning' }, - { type: 'female', x: '20:45', y: 11.136000000000001, time: 'morning' }, - { type: 'male', x: '21:00', y: 14.9, time: 'morning' }, - { type: 'female', x: '21:00', y: 11.920000000000002, time: 'morning' }, - { type: 'male', x: '21:15', y: 11.92, time: 'morning' }, - { type: 'female', x: '21:15', y: 9.536, time: 'morning' }, - { type: 'male', x: '21:30', y: 8.5, time: 'morning' }, - { type: 'female', x: '21:30', y: 6.800000000000001, time: 'morning' }, - { type: 'male', x: '21:45', y: 6.8, time: 'morning' }, - { type: 'female', x: '21:45', y: 5.44, time: 'morning' }, - { type: 'male', x: '22:00', y: 11.6, time: 'morning' }, - { type: 'female', x: '22:00', y: 9.28, time: 'morning' }, - { type: 'male', x: '22:15', y: 9.28, time: 'morning' }, - { type: 'female', x: '22:15', y: 7.4239999999999995, time: 'morning' }, - { type: 'male', x: '22:30', y: 15, time: 'morning' }, - { type: 'female', x: '22:30', y: 12, time: 'morning' }, - { type: 'male', x: '22:45', y: 12, time: 'morning' }, - { type: 'female', x: '22:45', y: 9.600000000000001, time: 'morning' }, - { type: 'male', x: '23:00', y: 24.5, time: 'morning' }, - { type: 'female', x: '23:00', y: 19.6, time: 'morning' }, - { type: 'male', x: '23:15', y: 19.6, time: 'morning' }, - { type: 'female', x: '23:15', y: 15.680000000000001, time: 'morning' }, - { type: 'male', x: '23:30', y: 16, time: 'morning' }, - { type: 'female', x: '23:30', y: 12.8, time: 'morning' }, - { type: 'male', x: '23:45', y: 12.8, time: 'morning' }, - { type: 'female', x: '23:45', y: 10.240000000000002, time: 'morning' }, - { type: 'male', x: 'x', y: null, time: 'morning' }, - { type: 'female', x: 'x', y: null, time: 'morning' }, - { type: 'male', x: '0:00', y: 99, time: 'morning' }, - { type: 'female', x: '0:00', y: 79.2, time: 'morning' }, - { type: 'male', x: '0:15', y: 59.2, time: 'morning' }, - { type: 'female', x: '0:15', y: 47.36000000000001, time: 'morning' }, - { type: 'male', x: '0:30', y: 94, time: 'morning' }, - { type: 'female', x: '0:30', y: 75.2, time: 'morning' }, - { type: 'male', x: '0:45', y: 75.2, time: 'morning' }, - { type: 'female', x: '0:45', y: 60.160000000000004, time: 'morning' }, - { type: 'male', x: '1:00', y: 120, time: 'morning' }, - { type: 'female', x: '1:00', y: 96, time: 'morning' }, - { type: 'male', x: '1:15', y: 38.2, time: 'morning' }, - { type: 'female', x: '1:15', y: 30.560000000000002, time: 'morning' }, -]; - -// DONE 👏 🎉 -export const AFTERNOON_DAILY_SCHEDULE = [ - { type: 'male', x: 'x', y: null, time: 'afternoon' }, - { type: 'female', x: 'x', y: null, time: 'afternoon' }, - { type: 'male', x: '0:00', y: 83.2, time: 'afternoon' }, - { type: 'female', x: '0:00', y: 66.56, time: 'afternoon' }, - { type: 'male', x: '0:15', y: 178, time: 'afternoon' }, - { type: 'female', x: '0:15', y: 142.4, time: 'afternoon' }, - { type: 'male', x: '0:30', y: 142.4, time: 'afternoon' }, - { type: 'female', x: '0:30', y: 113.92000000000002, time: 'afternoon' }, - { type: 'male', x: '0:45', y: 174, time: 'afternoon' }, - { type: 'female', x: '0:45', y: 139.20000000000002, time: 'afternoon' }, - { type: 'male', x: '1:00', y: 139.2, time: 'afternoon' }, - { type: 'female', x: '1:00', y: 111.36, time: 'afternoon' }, - { type: 'male', x: '1:15', y: 149, time: 'afternoon' }, - { type: 'female', x: '1:15', y: 119.2, time: 'afternoon' }, - { type: 'male', x: '1:30', y: 119.2, time: 'afternoon' }, - { type: 'female', x: '1:30', y: 95.36000000000001, time: 'afternoon' }, - { type: 'male', x: '1:45', y: 85, time: 'afternoon' }, - { type: 'female', x: '1:45', y: 68, time: 'afternoon' }, - { type: 'male', x: '2:00', y: 68, time: 'afternoon' }, - { type: 'female', x: '2:00', y: 54.400000000000006, time: 'afternoon' }, - { type: 'male', x: '2:15', y: 116, time: 'afternoon' }, - { type: 'female', x: '2:15', y: 92.80000000000001, time: 'afternoon' }, - { type: 'male', x: '2:30', y: 92.8, time: 'afternoon' }, - { type: 'female', x: '2:30', y: 74.24, time: 'afternoon' }, - { type: 'male', x: '2:45', y: 150, time: 'afternoon' }, - { type: 'female', x: '2:45', y: 120, time: 'afternoon' }, - { type: 'male', x: '3:00', y: 120, time: 'afternoon' }, - { type: 'female', x: '3:00', y: 96, time: 'afternoon' }, - { type: 'male', x: '3:15', y: 245, time: 'afternoon' }, - { type: 'female', x: '3:15', y: 196, time: 'afternoon' }, - { type: 'male', x: '3:30', y: 196, time: 'afternoon' }, - { type: 'female', x: '3:30', y: 156.8, time: 'afternoon' }, - { type: 'male', x: '3:45', y: 160, time: 'afternoon' }, - { type: 'female', x: '3:45', y: 128, time: 'afternoon' }, - { type: 'male', x: '4:00', y: 128, time: 'afternoon' }, - { type: 'female', x: '4:00', y: 102.4, time: 'afternoon' }, - { type: 'male', x: '4:15', y: 199, time: 'afternoon' }, - { type: 'female', x: '4:15', y: 159.20000000000002, time: 'afternoon' }, - { type: 'male', x: '4:30', y: 159.2, time: 'afternoon' }, - { type: 'female', x: '4:30', y: 127.36, time: 'afternoon' }, - { type: 'male', x: '4:45', y: 94, time: 'afternoon' }, - { type: 'female', x: '4:45', y: 75.2, time: 'afternoon' }, - { type: 'male', x: '5:00', y: 75.2, time: 'afternoon' }, - { type: 'female', x: '5:00', y: 60.160000000000004, time: 'afternoon' }, - { type: 'male', x: '5:15', y: 199, time: 'afternoon' }, - { type: 'female', x: '5:15', y: 159.20000000000002, time: 'afternoon' }, - { type: 'male', x: '5:30', y: 159.2, time: 'afternoon' }, - { type: 'female', x: '5:30', y: 127.36, time: 'afternoon' }, - { type: 'male', x: '5:45', y: 90, time: 'afternoon' }, - { type: 'female', x: '5:45', y: 72, time: 'afternoon' }, - { type: 'male', x: '6:00', y: 72, time: 'afternoon' }, - { type: 'female', x: '6:00', y: 57.6, time: 'afternoon' }, - { type: 'male', x: '6:15', y: 57, time: 'afternoon' }, - { type: 'female', x: '6:15', y: 45.6, time: 'afternoon' }, - { type: 'male', x: '6:30', y: 45.6, time: 'afternoon' }, - { type: 'female', x: '6:30', y: 36.480000000000004, time: 'afternoon' }, - { type: 'male', x: '6:45', y: 41, time: 'afternoon' }, - { type: 'female', x: '6:45', y: 32.800000000000004, time: 'afternoon' }, - { type: 'male', x: '7:00', y: 32.8, time: 'afternoon' }, - { type: 'female', x: '7:00', y: 26.24, time: 'afternoon' }, - { type: 'male', x: '7:15', y: 35, time: 'afternoon' }, - { type: 'female', x: '7:15', y: 28, time: 'afternoon' }, - { type: 'male', x: '7:30', y: 28, time: 'afternoon' }, - { type: 'female', x: '7:30', y: 22.400000000000002, time: 'afternoon' }, - { type: 'male', x: '7:45', y: 79, time: 'afternoon' }, - { type: 'female', x: '7:45', y: 63.2, time: 'afternoon' }, - { type: 'male', x: '8:00', y: 63.2, time: 'afternoon' }, - { type: 'female', x: '8:00', y: 50.56, time: 'afternoon' }, - { type: 'male', x: '8:15', y: 112, time: 'afternoon' }, - { type: 'female', x: '8:15', y: 89.60000000000001, time: 'afternoon' }, - { type: 'male', x: '8:30', y: 89.6, time: 'afternoon' }, - { type: 'female', x: '8:30', y: 71.67999999999999, time: 'afternoon' }, - { type: 'male', x: '8:45', y: 90, time: 'afternoon' }, - { type: 'female', x: '8:45', y: 72, time: 'afternoon' }, - { type: 'male', x: '9:00', y: 72, time: 'afternoon' }, - { type: 'female', x: '9:00', y: 57.6, time: 'afternoon' }, - { type: 'male', x: '9:15', y: 238, time: 'afternoon' }, - { type: 'female', x: '9:15', y: 190.4, time: 'afternoon' }, - { type: 'male', x: '9:30', y: 190.4, time: 'afternoon' }, - { type: 'female', x: '9:30', y: 152.32000000000002, time: 'afternoon' }, - { type: 'male', x: '9:45', y: 335, time: 'afternoon' }, - { type: 'female', x: '9:45', y: 268, time: 'afternoon' }, - { type: 'male', x: '10:00', y: 268, time: 'afternoon' }, - { type: 'female', x: '10:00', y: 214.4, time: 'afternoon' }, - { type: 'male', x: '10:15', y: 309, time: 'afternoon' }, - { type: 'female', x: '10:15', y: 247.20000000000002, time: 'afternoon' }, - { type: 'male', x: '10:30', y: 247.2, time: 'afternoon' }, - { type: 'female', x: '10:30', y: 197.76, time: 'afternoon' }, - { type: 'male', x: '10:45', y: 287, time: 'afternoon' }, - { type: 'female', x: '10:45', y: 229.60000000000002, time: 'afternoon' }, - { type: 'male', x: '11:00', y: 229.6, time: 'afternoon' }, - { type: 'female', x: '11:00', y: 183.68, time: 'afternoon' }, - { type: 'male', x: '11:15', y: 336, time: 'afternoon' }, - { type: 'female', x: '11:15', y: 268.8, time: 'afternoon' }, - { type: 'male', x: '11:30', y: 268.8, time: 'afternoon' }, - { type: 'female', x: '11:30', y: 215.04000000000002, time: 'afternoon' }, - { type: 'male', x: '11:45', y: 375, time: 'afternoon' }, - { type: 'female', x: '11:45', y: 300, time: 'afternoon' }, - { type: 'male', x: '12:00', y: 300, time: 'afternoon' }, - { type: 'female', x: '12:00', y: 240, time: 'afternoon' }, - { type: 'male', x: '12:15', y: 463, time: 'afternoon' }, - { type: 'female', x: '12:15', y: 370.40000000000003, time: 'afternoon' }, - { type: 'male', x: '12:30', y: 370.4, time: 'afternoon' }, - { type: 'female', x: '12:30', y: 296.32, time: 'afternoon' }, - { type: 'male', x: '12:45', y: 265, time: 'afternoon' }, - { type: 'female', x: '12:45', y: 212, time: 'afternoon' }, - { type: 'male', x: '13:00', y: 212, time: 'afternoon' }, - { type: 'female', x: '13:00', y: 169.60000000000002, time: 'afternoon' }, - { type: 'male', x: '13:15', y: 600, time: 'afternoon' }, - { type: 'female', x: '13:15', y: 480, time: 'afternoon' }, - { type: 'male', x: '13:30', y: 480, time: 'afternoon' }, - { type: 'female', x: '13:30', y: 384, time: 'afternoon' }, - { type: 'male', x: '13:45', y: 572, time: 'afternoon' }, - { type: 'female', x: '13:45', y: 457.6, time: 'afternoon' }, - { type: 'male', x: '14:00', y: 457.6, time: 'afternoon' }, - { type: 'female', x: '14:00', y: 366.08000000000004, time: 'afternoon' }, - { type: 'male', x: '14:15', y: 512, time: 'afternoon' }, - { type: 'female', x: '14:15', y: 409.6, time: 'afternoon' }, - { type: 'male', x: '14:30', y: 409.6, time: 'afternoon' }, - { type: 'female', x: '14:30', y: 327.68000000000006, time: 'afternoon' }, - { type: 'male', x: '14:45', y: 646, time: 'afternoon' }, - { type: 'female', x: '14:45', y: 516.8000000000001, time: 'afternoon' }, - { type: 'male', x: '15:00', y: 516.8, time: 'afternoon' }, - { type: 'female', x: '15:00', y: 413.44, time: 'afternoon' }, - { type: 'male', x: '15:15', y: 747, time: 'afternoon' }, - { type: 'female', x: '15:15', y: 597.6, time: 'afternoon' }, - { type: 'male', x: '15:30', y: 597.6, time: 'afternoon' }, - { type: 'female', x: '15:30', y: 478.08000000000004, time: 'afternoon' }, - { type: 'male', x: '15:45', y: 699, time: 'afternoon' }, - { type: 'female', x: '15:45', y: 559.2, time: 'afternoon' }, - { type: 'male', x: '16:00', y: 559.2, time: 'afternoon' }, - { type: 'female', x: '16:00', y: 447.36000000000007, time: 'afternoon' }, - { type: 'male', x: '16:15', y: 729, time: 'afternoon' }, - { type: 'female', x: '16:15', y: 583.2, time: 'afternoon' }, - { type: 'male', x: '16:30', y: 583.2, time: 'afternoon' }, - { type: 'female', x: '16:30', y: 466.56000000000006, time: 'afternoon' }, - { type: 'male', x: '16:45', y: 734, time: 'afternoon' }, - { type: 'female', x: '16:45', y: 587.2, time: 'afternoon' }, - { type: 'male', x: '17:00', y: 587.2, time: 'afternoon' }, - { type: 'female', x: '17:00', y: 469.76000000000005, time: 'afternoon' }, - { type: 'male', x: '17:15', y: 672, time: 'afternoon' }, - { type: 'female', x: '17:15', y: 537.6, time: 'afternoon' }, - { type: 'male', x: '17:30', y: 537.6, time: 'afternoon' }, - { type: 'female', x: '17:30', y: 430.08000000000004, time: 'afternoon' }, - { type: 'male', x: '17:45', y: 690, time: 'afternoon' }, - { type: 'female', x: '17:45', y: 552, time: 'afternoon' }, - { type: 'male', x: '18:00', y: 552, time: 'afternoon' }, - { type: 'female', x: '18:00', y: 441.6, time: 'afternoon' }, - { type: 'male', x: '18:15', y: 427, time: 'afternoon' }, - { type: 'female', x: '18:15', y: 341.6, time: 'afternoon' }, - { type: 'male', x: '18:30', y: 341.6, time: 'afternoon' }, - { type: 'female', x: '18:30', y: 273.28000000000003, time: 'afternoon' }, - { type: 'male', x: '18:45', y: 273, time: 'afternoon' }, - { type: 'female', x: '18:45', y: 218.4, time: 'afternoon' }, - { type: 'male', x: '19:00', y: 218.4, time: 'afternoon' }, - { type: 'female', x: '19:00', y: 174.72000000000003, time: 'afternoon' }, - { type: 'male', x: '19:15', y: 352, time: 'afternoon' }, - { type: 'female', x: '19:15', y: 281.6, time: 'afternoon' }, - { type: 'male', x: '19:30', y: 281.6, time: 'afternoon' }, - { type: 'female', x: '19:30', y: 225.28000000000003, time: 'afternoon' }, - { type: 'male', x: '19:45', y: 133, time: 'afternoon' }, - { type: 'female', x: '19:45', y: 106.4, time: 'afternoon' }, - { type: 'male', x: '20:00', y: 106.4, time: 'afternoon' }, - { type: 'female', x: '20:00', y: 85.12, time: 'afternoon' }, - { type: 'male', x: '20:15', y: 65, time: 'afternoon' }, - { type: 'female', x: '20:15', y: 52, time: 'afternoon' }, - { type: 'male', x: '20:30', y: 52, time: 'afternoon' }, - { type: 'female', x: '20:30', y: 41.6, time: 'afternoon' }, - { type: 'male', x: '20:45', y: 26, time: 'afternoon' }, - { type: 'female', x: '20:45', y: 20.8, time: 'afternoon' }, - { type: 'male', x: '21:00', y: 20.8, time: 'afternoon' }, - { type: 'female', x: '21:00', y: 16.64, time: 'afternoon' }, - { type: 'male', x: '21:15', y: 36, time: 'afternoon' }, - { type: 'female', x: '21:15', y: 28.8, time: 'afternoon' }, - { type: 'male', x: '21:30', y: 28.8, time: 'afternoon' }, - { type: 'female', x: '21:30', y: 23.040000000000003, time: 'afternoon' }, - { type: 'male', x: '21:45', y: 181, time: 'afternoon' }, - { type: 'female', x: '21:45', y: 144.8, time: 'afternoon' }, - { type: 'male', x: '22:00', y: 144.8, time: 'afternoon' }, - { type: 'female', x: '22:00', y: 115.84000000000002, time: 'afternoon' }, - { type: 'male', x: '22:15', y: 206, time: 'afternoon' }, - { type: 'female', x: '22:15', y: 164.8, time: 'afternoon' }, - { type: 'male', x: '22:30', y: 164.8, time: 'afternoon' }, - { type: 'female', x: '22:30', y: 131.84, time: 'afternoon' }, - { type: 'male', x: '22:45', y: 148, time: 'afternoon' }, - { type: 'female', x: '22:45', y: 118.4, time: 'afternoon' }, - { type: 'male', x: '23:00', y: 118.4, time: 'afternoon' }, - { type: 'female', x: '23:00', y: 94.72000000000001, time: 'afternoon' }, - { type: 'male', x: '23:15', y: 201, time: 'afternoon' }, - { type: 'female', x: '23:15', y: 160.8, time: 'afternoon' }, - { type: 'male', x: '23:30', y: 160.8, time: 'afternoon' }, - { type: 'female', x: '23:30', y: 128.64000000000001, time: 'afternoon' }, - { type: 'male', x: '23:45', y: 104, time: 'afternoon' }, - { type: 'female', x: '23:45', y: 83.2, time: 'afternoon' }, -]; diff --git a/site/components/D2Chart/datas/music.ts b/site/components/D2Chart/datas/music.ts deleted file mode 100644 index c120a06fb..000000000 --- a/site/components/D2Chart/datas/music.ts +++ /dev/null @@ -1,1294 +0,0 @@ -export const CLASSIC = [ - { x: '1 ', y: 936, type: 'Soprano' }, - { x: '1 ', y: 754, type: 'Alto' }, - { x: '1 ', y: 111, type: 'Tenor' }, - { x: '1 ', y: 46, type: 'Bass' }, - { x: '2 ', y: 957, type: 'Soprano' }, - { x: '2 ', y: 790, type: 'Alto' }, - { x: '2 ', y: 217, type: 'Tenor' }, - { x: '2 ', y: 86, type: 'Bass' }, - { x: '3 ', y: 897, type: 'Soprano' }, - { x: '3 ', y: 753, type: 'Alto' }, - { x: '3 ', y: 409, type: 'Tenor' }, - { x: '3 ', y: 119, type: 'Bass' }, - { x: '4 ', y: 900, type: 'Soprano' }, - { x: '4 ', y: 751, type: 'Alto' }, - { x: '4 ', y: 518, type: 'Tenor' }, - { x: '4 ', y: 361, type: 'Bass' }, - { x: '5 ', y: 894, type: 'Soprano' }, - { x: '5 ', y: 649, type: 'Alto' }, - { x: '5 ', y: 352, type: 'Tenor' }, - { x: '5 ', y: 161, type: 'Bass' }, - { x: '6 ', y: 800, type: 'Soprano' }, - { x: '6 ', y: 645, type: 'Alto' }, - { x: '6 ', y: 210, type: 'Tenor' }, - { x: '6 ', y: 40, type: 'Bass' }, - { x: '7 ', y: 863, type: 'Soprano' }, - { x: '7 ', y: 694, type: 'Alto' }, - { x: '7 ', y: 609, type: 'Tenor' }, - { x: '7 ', y: 234, type: 'Bass' }, - { x: '8 ', y: 909, type: 'Soprano' }, - { x: '8 ', y: 706, type: 'Alto' }, - { x: '8 ', y: 216, type: 'Tenor' }, - { x: '8 ', y: 62, type: 'Bass' }, - { x: '9 ', y: 891, type: 'Soprano' }, - { x: '9 ', y: 757, type: 'Alto' }, - { x: '9 ', y: 563, type: 'Tenor' }, - { x: '9 ', y: 216, type: 'Bass' }, - { x: '10 ', y: 951, type: 'Soprano' }, - { x: '10 ', y: 733, type: 'Alto' }, - { x: '10 ', y: 249, type: 'Tenor' }, - { x: '10 ', y: 49, type: 'Bass' }, - { x: '11 ', y: 854, type: 'Soprano' }, - { x: '11 ', y: 661, type: 'Alto' }, - { x: '11 ', y: 422, type: 'Tenor' }, - { x: '11 ', y: 279, type: 'Bass' }, - { x: '12 ', y: 842, type: 'Soprano' }, - { x: '12 ', y: 703, type: 'Alto' }, - { x: '12 ', y: 242, type: 'Tenor' }, - { x: '12 ', y: 107, type: 'Bass' }, - { x: '13 ', y: 903, type: 'Soprano' }, - { x: '13 ', y: 760, type: 'Alto' }, - { x: '13 ', y: 357, type: 'Tenor' }, - { x: '13 ', y: 192, type: 'Bass' }, - { x: '14 ', y: 954, type: 'Soprano' }, - { x: '14 ', y: 809, type: 'Alto' }, - { x: '14 ', y: 419, type: 'Tenor' }, - { x: '14 ', y: 258, type: 'Bass' }, - { x: '15 ', y: 875, type: 'Soprano' }, - { x: '15 ', y: 703, type: 'Alto' }, - { x: '15 ', y: 461, type: 'Tenor' }, - { x: '15 ', y: 309, type: 'Bass' }, - { x: '16 ', y: 978, type: 'Soprano' }, - { x: '16 ', y: 830, type: 'Alto' }, - { x: '16 ', y: 541, type: 'Tenor' }, - { x: '16 ', y: 376, type: 'Bass' }, - { x: '17 ', y: 888, type: 'Soprano' }, - { x: '17 ', y: 684, type: 'Alto' }, - { x: '17 ', y: 316, type: 'Tenor' }, - { x: '17 ', y: 222, type: 'Bass' }, - { x: '18 ', y: 888, type: 'Soprano' }, - { x: '18 ', y: 679, type: 'Alto' }, - { x: '18 ', y: 411, type: 'Tenor' }, - { x: '18 ', y: 319, type: 'Bass' }, - { x: '19 ', y: 875, type: 'Soprano' }, - { x: '19 ', y: 733, type: 'Alto' }, - { x: '19 ', y: 328, type: 'Tenor' }, - { x: '19 ', y: 222, type: 'Bass' }, - { x: '20 ', y: 897, type: 'Soprano' }, - { x: '20 ', y: 670, type: 'Alto' }, - { x: '20 ', y: 234, type: 'Tenor' }, - { x: '20 ', y: 146, type: 'Bass' }, - { x: '21 ', y: 954, type: 'Soprano' }, - { x: '21 ', y: 856, type: 'Alto' }, - { x: '21 ', y: 276, type: 'Tenor' }, - { x: '21 ', y: 174, type: 'Bass' }, - { x: '22 ', y: 918, type: 'Soprano' }, - { x: '22 ', y: 630, type: 'Alto' }, - { x: '22 ', y: 435, type: 'Tenor' }, - { x: '22 ', y: 340, type: 'Bass' }, - { x: '23 ', y: 936, type: 'Soprano' }, - { x: '23 ', y: 830, type: 'Alto' }, - { x: '23 ', y: 522, type: 'Tenor' }, - { x: '23 ', y: 207, type: 'Bass' }, - { x: '24 ', y: 900, type: 'Soprano' }, - { x: '24 ', y: 655, type: 'Alto' }, - { x: '24 ', y: 697, type: 'Tenor' }, - { x: '24 ', y: 476, type: 'Bass' }, - { x: '25 ', y: 972, type: 'Soprano' }, - { x: '25 ', y: 767, type: 'Alto' }, - { x: '25 ', y: 558, type: 'Tenor' }, - { x: '25 ', y: 273, type: 'Bass' }, - { x: '26 ', y: 888, type: 'Soprano' }, - { x: '26 ', y: 788, type: 'Alto' }, - { x: '26 ', y: 549, type: 'Tenor' }, - { x: '26 ', y: 397, type: 'Bass' }, - { x: '27 ', y: 863, type: 'Soprano' }, - { x: '27 ', y: 615, type: 'Alto' }, - { x: '27 ', y: 394, type: 'Tenor' }, - { x: '27 ', y: 175, type: 'Bass' }, - { x: '28 ', y: 960, type: 'Soprano' }, - { x: '28 ', y: 726, type: 'Alto' }, - { x: '28 ', y: 452, type: 'Tenor' }, - { x: '28 ', y: 322, type: 'Bass' }, - { x: '29 ', y: 885, type: 'Soprano' }, - { x: '29 ', y: 697, type: 'Alto' }, - { x: '29 ', y: 337, type: 'Tenor' }, - { x: '29 ', y: 237, type: 'Bass' }, - { x: '30 ', y: 966, type: 'Soprano' }, - { x: '30 ', y: 806, type: 'Alto' }, - { x: '30 ', y: 350, type: 'Tenor' }, - { x: '30 ', y: 222, type: 'Bass' }, - { x: '31 ', y: 885, type: 'Soprano' }, - { x: '31 ', y: 721, type: 'Alto' }, - { x: '31 ', y: 312, type: 'Tenor' }, - { x: '31 ', y: 251, type: 'Bass' }, - { x: '32 ', y: 833, type: 'Soprano' }, - { x: '32 ', y: 715, type: 'Alto' }, - { x: '32 ', y: 602, type: 'Tenor' }, - { x: '32 ', y: 264, type: 'Bass' }, - { x: '33 ', y: 900, type: 'Soprano' }, - { x: '33 ', y: 790, type: 'Alto' }, - { x: '33 ', y: 382, type: 'Tenor' }, - { x: '33 ', y: 240, type: 'Bass' }, - { x: '34 ', y: 906, type: 'Soprano' }, - { x: '34 ', y: 667, type: 'Alto' }, - { x: '34 ', y: 576, type: 'Tenor' }, - { x: '34 ', y: 428, type: 'Bass' }, - { x: '35 ', y: 966, type: 'Soprano' }, - { x: '35 ', y: 773, type: 'Alto' }, - { x: '35 ', y: 439, type: 'Tenor' }, - { x: '35 ', y: 264, type: 'Bass' }, - { x: '36 ', y: 894, type: 'Soprano' }, - { x: '36 ', y: 694, type: 'Alto' }, - { x: '36 ', y: 361, type: 'Tenor' }, - { x: '36 ', y: 267, type: 'Bass' }, - { x: '37 ', y: 939, type: 'Soprano' }, - { x: '37 ', y: 846, type: 'Alto' }, - { x: '37 ', y: 416, type: 'Tenor' }, - { x: '37 ', y: 198, type: 'Bass' }, - { x: '38 ', y: 915, type: 'Soprano' }, - { x: '38 ', y: 694, type: 'Alto' }, - { x: '38 ', y: 589, type: 'Tenor' }, - { x: '38 ', y: 394, type: 'Bass' }, - { x: '39 ', y: 996, type: 'Soprano' }, - { x: '39 ', y: 794, type: 'Alto' }, - { x: '39 ', y: 509, type: 'Tenor' }, - { x: '39 ', y: 388, type: 'Bass' }, - { x: '40 ', y: 921, type: 'Soprano' }, - { x: '40 ', y: 715, type: 'Alto' }, - { x: '40 ', y: 637, type: 'Tenor' }, - { x: '40 ', y: 218, type: 'Bass' }, - { x: '41 ', y: 952, type: 'Soprano' }, - { x: '41 ', y: 730, type: 'Alto' }, - { x: '41 ', y: 484, type: 'Tenor' }, - { x: '41 ', y: 340, type: 'Bass' }, - { x: '42 ', y: 912, type: 'Soprano' }, - { x: '42 ', y: 655, type: 'Alto' }, - { x: '42 ', y: 458, type: 'Tenor' }, - { x: '42 ', y: 222, type: 'Bass' }, - { x: '43 ', y: 954, type: 'Soprano' }, - { x: '43 ', y: 754, type: 'Alto' }, - { x: '43 ', y: 470, type: 'Tenor' }, - { x: '43 ', y: 337, type: 'Bass' }, - { x: '44 ', y: 972, type: 'Soprano' }, - { x: '44 ', y: 721, type: 'Alto' }, - { x: '44 ', y: 591, type: 'Tenor' }, - { x: '44 ', y: 473, type: 'Bass' }, - { x: '45 ', y: 906, type: 'Soprano' }, - { x: '45 ', y: 673, type: 'Alto' }, - { x: '45 ', y: 449, type: 'Tenor' }, - { x: '45 ', y: 358, type: 'Bass' }, - { x: '46 ', y: 951, type: 'Soprano' }, - { x: '46 ', y: 609, type: 'Alto' }, - { x: '46 ', y: 479, type: 'Tenor' }, - { x: '46 ', y: 295, type: 'Bass' }, - { x: '47 ', y: 881, type: 'Soprano' }, - { x: '47 ', y: 652, type: 'Alto' }, - { x: '47 ', y: 351, type: 'Tenor' }, - { x: '47 ', y: 195, type: 'Bass' }, - { x: '48', y: 942, type: 'Soprano' }, - { x: '48', y: 736, type: 'Alto' }, - { x: '48', y: 374, type: 'Tenor' }, - { x: '48', y: 261, type: 'Bass' }, -]; -/** - * 重金属 - */ -export const METAL = [ - { x: '1', type: 'Electric_guitar', y: 936 }, - { x: '1', type: 'Drum', y: 635 }, - { x: '1', type: 'Electri_bass', y: 712 }, - { x: '1', type: 'Keyboard', y: 290 }, - { x: '1', type: 'Amplifier', y: 100 }, - { x: '2', type: 'Electric_guitar', y: 897 }, - { x: '2', type: 'Drum', y: 681 }, - { x: '2', type: 'Electri_bass', y: 587 }, - { x: '2', type: 'Keyboard', y: 264 }, - { x: '2', type: 'Amplifier', y: 100 }, - { x: '3', type: 'Electric_guitar', y: 941 }, - { x: '3', type: 'Drum', y: 661 }, - { x: '3', type: 'Electri_bass', y: 570 }, - { x: '3', type: 'Keyboard', y: 161 }, - { x: '3', type: 'Amplifier', y: 800 }, - { x: '4', type: 'Electric_guitar', y: 876 }, - { x: '4', type: 'Drum', y: 694 }, - { x: '4', type: 'Electri_bass', y: 609 }, - { x: '4', type: 'Keyboard', y: 234 }, - { x: '4', type: 'Amplifier', y: 800 }, - { x: '5', type: 'Electric_guitar', y: 924 }, - { x: '5', type: 'Drum', y: 757 }, - { x: '5', type: 'Electri_bass', y: 563 }, - { x: '5', type: 'Keyboard', y: 216 }, - { x: '5', type: 'Amplifier', y: 200 }, - { x: '6', type: 'Electric_guitar', y: 873 }, - { x: '6', type: 'Drum', y: 661 }, - { x: '6', type: 'Electri_bass', y: 422 }, - { x: '6', type: 'Keyboard', y: 279 }, - { x: '6', type: 'Amplifier', y: 200 }, - { x: '7', type: 'Electric_guitar', y: 766 }, - { x: '7', type: 'Drum', y: 703 }, - { x: '7', type: 'Electri_bass', y: 357 }, - { x: '7', type: 'Keyboard', y: 192 }, - { x: '7', type: 'Amplifier', y: 600 }, - { x: '8', type: 'Electric_guitar', y: 875 }, - { x: '8', type: 'Drum', y: 703 }, - { x: '8', type: 'Electri_bass', y: 461 }, - { x: '8', type: 'Keyboard', y: 309 }, - { x: '8', type: 'Amplifier', y: 600 }, - { x: '9', type: 'Electric_guitar', y: 888 }, - { x: '9', type: 'Drum', y: 706 }, - { x: '9', type: 'Electri_bass', y: 316 }, - { x: '9', type: 'Keyboard', y: 222 }, - { x: '9', type: 'Amplifier', y: 300 }, - { x: '10', type: 'Electric_guitar', y: 875 }, - { x: '10', type: 'Drum', y: 733 }, - { x: '10', type: 'Electri_bass', y: 328 }, - { x: '10', type: 'Keyboard', y: 222 }, - { x: '10', type: 'Amplifier', y: 300 }, - { x: '11', type: 'Electric_guitar', y: 896 }, - { x: '11', type: 'Drum', y: 672 }, - { x: '11', type: 'Electri_bass', y: 276 }, - { x: '11', type: 'Keyboard', y: 174 }, - { x: '11', type: 'Amplifier', y: 500 }, - { x: '12', type: 'Electric_guitar', y: 865 }, - { x: '12', type: 'Drum', y: 672 }, - { x: '12', type: 'Electri_bass', y: 522 }, - { x: '12', type: 'Keyboard', y: 207 }, - { x: '12', type: 'Amplifier', y: 500 }, - { x: '13', type: 'Electric_guitar', y: 916 }, - { x: '13', type: 'Drum', y: 638 }, - { x: '13', type: 'Electri_bass', y: 558 }, - { x: '13', type: 'Keyboard', y: 273 }, - { x: '13', type: 'Amplifier', y: 400 }, - { x: '14', type: 'Electric_guitar', y: 947 }, - { x: '14', type: 'Drum', y: 678 }, - { x: '14', type: 'Electri_bass', y: 394 }, - { x: '14', type: 'Keyboard', y: 175 }, - { x: '14', type: 'Amplifier', y: 400 }, - { x: '15', type: 'Electric_guitar', y: 644 }, - { x: '15', type: 'Drum', y: 596 }, - { x: '15', type: 'Electri_bass', y: 337 }, - { x: '15', type: 'Keyboard', y: 237 }, - { x: '15', type: 'Amplifier', y: 500 }, - { x: '16', type: 'Electric_guitar', y: 834 }, - { x: '16', type: 'Drum', y: 635 }, - { x: '16', type: 'Electri_bass', y: 312 }, - { x: '16', type: 'Keyboard', y: 251 }, - { x: '16', type: 'Amplifier', y: 500 }, - { x: '17', type: 'Electric_guitar', y: 900 }, - { x: '17', type: 'Drum', y: 681 }, - { x: '17', type: 'Electri_bass', y: 382 }, - { x: '17', type: 'Keyboard', y: 240 }, - { x: '17', type: 'Amplifier', y: 300 }, - { x: '18', type: 'Electric_guitar', y: 966 }, - { x: '18', type: 'Drum', y: 703 }, - { x: '18', type: 'Electri_bass', y: 439 }, - { x: '18', type: 'Keyboard', y: 264 }, - { x: '18', type: 'Amplifier', y: 300 }, - { x: '19', type: 'Electric_guitar', y: 939 }, - { x: '19', type: 'Drum', y: 698 }, - { x: '19', type: 'Electri_bass', y: 416 }, - { x: '19', type: 'Keyboard', y: 198 }, - { x: '19', type: 'Amplifier', y: 600 }, - { x: '20', type: 'Electric_guitar', y: 996 }, - { x: '20', type: 'Drum', y: 715 }, - { x: '20', type: 'Electri_bass', y: 509 }, - { x: '20', type: 'Keyboard', y: 388 }, - { x: '20', type: 'Amplifier', y: 600 }, - { x: '21', type: 'Electric_guitar', y: 952 }, - { x: '21', type: 'Drum', y: 730 }, - { x: '21', type: 'Electri_bass', y: 484 }, - { x: '21', type: 'Keyboard', y: 340 }, - { x: '21', type: 'Amplifier', y: 200 }, - { x: '22', type: 'Electric_guitar', y: 954 }, - { x: '22', type: 'Drum', y: 754 }, - { x: '22', type: 'Electri_bass', y: 470 }, - { x: '22', type: 'Keyboard', y: 337 }, - { x: '22', type: 'Amplifier', y: 200 }, - { x: '23', type: 'Electric_guitar', y: 906 }, - { x: '23', type: 'Drum', y: 673 }, - { x: '23', type: 'Electri_bass', y: 449 }, - { x: '23', type: 'Keyboard', y: 358 }, - { x: '23', type: 'Amplifier', y: 800 }, - { x: '24', type: 'Electric_guitar', y: 970 }, - { x: '24', type: 'Drum', y: 652 }, - { x: '24', type: 'Electri_bass', y: 449 }, - { x: '24', type: 'Keyboard', y: 195 }, - { x: '24', type: 'Amplifier', y: 800 }, - { x: '25', type: 'Electric_guitar', y: 942 }, - { x: '25', type: 'Drum', y: 736 }, - { x: '25', type: 'Electri_bass', y: 434 }, - { x: '25', type: 'Keyboard', y: 261 }, - { x: '25', type: 'Amplifier', y: 100 }, - { x: '26', type: 'Electric_guitar', y: 464 }, - { x: '26', type: 'Drum', y: 625.5 }, - { x: '26', type: 'Electri_bass', y: 677 }, - { x: '26', type: 'Keyboard', y: 233 }, - { x: '26', type: 'Amplifier', y: 100 }, - { x: '27', type: 'Electric_guitar', y: 513 }, - { x: '27', type: 'Drum', y: 671.4 }, - { x: '27', type: 'Electri_bass', y: 435 }, - { x: '27', type: 'Keyboard', y: 325 }, - { x: '27', type: 'Amplifier', y: 800 }, - { x: '28', type: 'Electric_guitar', y: 332 }, - { x: '28', type: 'Drum', y: 580.5 }, - { x: '28', type: 'Electri_bass', y: 663 }, - { x: '28', type: 'Keyboard', y: 179 }, - { x: '28', type: 'Amplifier', y: 800 }, - { x: '29', type: 'Electric_guitar', y: 740 }, - { x: '29', type: 'Drum', y: 635.4 }, - { x: '29', type: 'Electri_bass', y: 424 }, - { x: '29', type: 'Keyboard', y: 133 }, - { x: '29', type: 'Amplifier', y: 200 }, - { x: '30', type: 'Electric_guitar', y: 149 }, - { x: '30', type: 'Drum', y: 659.7 }, - { x: '30', type: 'Electri_bass', y: 455 }, - { x: '30', type: 'Keyboard', y: 44 }, - { x: '30', type: 'Amplifier', y: 200 }, - { x: '31', type: 'Electric_guitar', y: 475 }, - { x: '31', type: 'Drum', y: 632.7 }, - { x: '31', type: 'Electri_bass', y: 374 }, - { x: '31', type: 'Keyboard', y: 59 }, - { x: '31', type: 'Amplifier', y: 600 }, - { x: '32', type: 'Electric_guitar', y: 577 }, - { x: '32', type: 'Drum', y: 536.4 }, - { x: '32', type: 'Electri_bass', y: 377 }, - { x: '32', type: 'Keyboard', y: 232 }, - { x: '32', type: 'Amplifier', y: 600 }, - { x: '33', type: 'Electric_guitar', y: 781 }, - { x: '33', type: 'Drum', y: 579.6 }, - { x: '33', type: 'Electri_bass', y: 487 }, - { x: '33', type: 'Keyboard', y: 338 }, - { x: '33', type: 'Amplifier', y: 300 }, - { x: '34', type: 'Electric_guitar', y: 862 }, - { x: '34', type: 'Drum', y: 611.1 }, - { x: '34', type: 'Electri_bass', y: 370 }, - { x: '34', type: 'Keyboard', y: 287 }, - { x: '34', type: 'Amplifier', y: 300 }, - { x: '35', type: 'Electric_guitar', y: 837 }, - { x: '35', type: 'Drum', y: 603 }, - { x: '35', type: 'Electri_bass', y: 353 }, - { x: '35', type: 'Keyboard', y: 131 }, - { x: '35', type: 'Amplifier', y: 500 }, - { x: '36', type: 'Electric_guitar', y: 868 }, - { x: '36', type: 'Drum', y: 567 }, - { x: '36', type: 'Electri_bass', y: 392 }, - { x: '36', type: 'Keyboard', y: 306 }, - { x: '36', type: 'Amplifier', y: 500 }, - { x: '37', type: 'Electric_guitar', y: 439 }, - { x: '37', type: 'Drum', y: 589.5 }, - { x: '37', type: 'Electri_bass', y: 627 }, - { x: '37', type: 'Keyboard', y: 428 }, - { x: '37', type: 'Amplifier', y: 400 }, - { x: '38', type: 'Electric_guitar', y: 631 }, - { x: '38', type: 'Drum', y: 574.2 }, - { x: '38', type: 'Electri_bass', y: 494 }, - { x: '38', type: 'Keyboard', y: 357 }, - { x: '38', type: 'Amplifier', y: 400 }, - { x: '39', type: 'Electric_guitar', y: 864 }, - { x: '39', type: 'Drum', y: 653.4 }, - { x: '39', type: 'Electri_bass', y: 407 }, - { x: '39', type: 'Keyboard', y: 290 }, - { x: '39', type: 'Amplifier', y: 500 }, - { x: '40', type: 'Electric_guitar', y: 869 }, - { x: '40', type: 'Drum', y: 602.1 }, - { x: '40', type: 'Electri_bass', y: 315 }, - { x: '40', type: 'Keyboard', y: 200 }, - { x: '40', type: 'Amplifier', y: 500 }, - { x: '41', type: 'Electric_guitar', y: 279 }, - { x: '41', type: 'Drum', y: 604.8 }, - { x: '41', type: 'Electri_bass', y: 542 }, - { x: '41', type: 'Keyboard', y: 238 }, - { x: '41', type: 'Amplifier', y: 300 }, - { x: '42', type: 'Electric_guitar', y: 383 }, - { x: '42', type: 'Drum', y: 600.3 }, - { x: '42', type: 'Electri_bass', y: 518 }, - { x: '42', type: 'Keyboard', y: 385 }, - { x: '42', type: 'Amplifier', y: 300 }, - { x: '43', type: 'Electric_guitar', y: 503 }, - { x: '43', type: 'Drum', y: 624.6 }, - { x: '43', type: 'Electri_bass', y: 325 }, - { x: '43', type: 'Keyboard', y: 240 }, - { x: '43', type: 'Amplifier', y: 600 }, - { x: '44', type: 'Electric_guitar', y: 570 }, - { x: '44', type: 'Drum', y: 624.6 }, - { x: '44', type: 'Electri_bass', y: 530 }, - { x: '44', type: 'Keyboard', y: 355 }, - { x: '44', type: 'Amplifier', y: 600 }, - { x: '45', type: 'Electric_guitar', y: 411 }, - { x: '45', type: 'Drum', y: 643.5 }, - { x: '45', type: 'Electri_bass', y: 573 }, - { x: '45', type: 'Keyboard', y: 196 }, - { x: '45', type: 'Amplifier', y: 200 }, - { x: '46', type: 'Electric_guitar', y: 495 }, - { x: '46', type: 'Drum', y: 686.7 }, - { x: '46', type: 'Electri_bass', y: 412 }, - { x: '46', type: 'Keyboard', y: 200 }, - { x: '46', type: 'Amplifier', y: 200 }, - { x: '47', type: 'Electric_guitar', y: 567 }, - { x: '47', type: 'Drum', y: 648.9 }, - { x: '47', type: 'Electri_bass', y: 532 }, - { x: '47', type: 'Keyboard', y: 426 }, - { x: '47', type: 'Amplifier', y: 800 }, - { x: '48', type: 'Electric_guitar', y: 455 }, - { x: '48', type: 'Drum', y: 628.2 }, - { x: '48', type: 'Electri_bass', y: 431 }, - { x: '48', type: 'Keyboard', y: 266 }, - { x: '48', type: 'Amplifier', y: 800 }, - { x: '49', type: 'Electric_guitar', y: 516 }, - { x: '49', type: 'Drum', y: 695 }, - { x: '49', type: 'Electri_bass', y: 752 }, - { x: '49', type: 'Keyboard', y: 259 }, - { x: '49', type: 'Amplifier', y: 100 }, - { x: '50', type: 'Electric_guitar', y: 570 }, - { x: '50', type: 'Drum', y: 746 }, - { x: '50', type: 'Electri_bass', y: 483 }, - { x: '50', type: 'Keyboard', y: 361 }, - { x: '50', type: 'Amplifier', y: 100 }, - { x: '51', type: 'Electric_guitar', y: 369 }, - { x: '51', type: 'Drum', y: 645 }, - { x: '51', type: 'Electri_bass', y: 737 }, - { x: '51', type: 'Keyboard', y: 199 }, - { x: '51', type: 'Amplifier', y: 800 }, - { x: '52', type: 'Electric_guitar', y: 822 }, - { x: '52', type: 'Drum', y: 706 }, - { x: '52', type: 'Electri_bass', y: 471 }, - { x: '52', type: 'Keyboard', y: 148 }, - { x: '52', type: 'Amplifier', y: 800 }, - { x: '53', type: 'Electric_guitar', y: 165 }, - { x: '53', type: 'Drum', y: 733 }, - { x: '53', type: 'Electri_bass', y: 505 }, - { x: '53', type: 'Keyboard', y: 49 }, - { x: '53', type: 'Amplifier', y: 200 }, - { x: '54', type: 'Electric_guitar', y: 528 }, - { x: '54', type: 'Drum', y: 703 }, - { x: '54', type: 'Electri_bass', y: 415 }, - { x: '54', type: 'Keyboard', y: 66 }, - { x: '54', type: 'Amplifier', y: 200 }, - { x: '55', type: 'Electric_guitar', y: 641 }, - { x: '55', type: 'Drum', y: 596 }, - { x: '55', type: 'Electri_bass', y: 419 }, - { x: '55', type: 'Keyboard', y: 258 }, - { x: '55', type: 'Amplifier', y: 600 }, - { x: '56', type: 'Electric_guitar', y: 868 }, - { x: '56', type: 'Drum', y: 644 }, - { x: '56', type: 'Electri_bass', y: 541 }, - { x: '56', type: 'Keyboard', y: 376 }, - { x: '56', type: 'Amplifier', y: 600 }, - { x: '57', type: 'Electric_guitar', y: 958 }, - { x: '57', type: 'Drum', y: 679 }, - { x: '57', type: 'Electri_bass', y: 411 }, - { x: '57', type: 'Keyboard', y: 319 }, - { x: '57', type: 'Amplifier', y: 300 }, - { x: '58', type: 'Electric_guitar', y: 930 }, - { x: '58', type: 'Drum', y: 670 }, - { x: '58', type: 'Electri_bass', y: 392 }, - { x: '58', type: 'Keyboard', y: 146 }, - { x: '58', type: 'Amplifier', y: 300 }, - { x: '59', type: 'Electric_guitar', y: 964 }, - { x: '59', type: 'Drum', y: 630 }, - { x: '59', type: 'Electri_bass', y: 435 }, - { x: '59', type: 'Keyboard', y: 340 }, - { x: '59', type: 'Amplifier', y: 500 }, - { x: '60', type: 'Electric_guitar', y: 488 }, - { x: '60', type: 'Drum', y: 655 }, - { x: '60', type: 'Electri_bass', y: 697 }, - { x: '60', type: 'Keyboard', y: 476 }, - { x: '60', type: 'Amplifier', y: 500 }, - { x: '61', type: 'Electric_guitar', y: 701 }, - { x: '61', type: 'Drum', y: 638 }, - { x: '61', type: 'Electri_bass', y: 549 }, - { x: '61', type: 'Keyboard', y: 397 }, - { x: '61', type: 'Amplifier', y: 400 }, - { x: '62', type: 'Electric_guitar', y: 960 }, - { x: '62', type: 'Drum', y: 726 }, - { x: '62', type: 'Electri_bass', y: 452 }, - { x: '62', type: 'Keyboard', y: 322 }, - { x: '62', type: 'Amplifier', y: 400 }, - { x: '63', type: 'Electric_guitar', y: 966 }, - { x: '63', type: 'Drum', y: 669 }, - { x: '63', type: 'Electri_bass', y: 350 }, - { x: '63', type: 'Keyboard', y: 222 }, - { x: '63', type: 'Amplifier', y: 500 }, -]; - -/** - * 迷幻电子音乐 - */ -export const ELECTRONIC = [ - { x: '1 ', type: 'Amplifier_1', y: 545 }, - { x: '1 ', type: 'Keyboard', y: 692 }, - { x: '1 ', type: 'Amplifier_2', y: 754 }, - { x: '1 ', type: 'Drum', y: 111 }, - { x: '2 ', type: 'Amplifier_1', y: 856 }, - { x: '2 ', type: 'Keyboard', y: 528 }, - { x: '2 ', type: 'Amplifier_2', y: 790 }, - { x: '2 ', type: 'Drum', y: 217 }, - { x: '3 ', type: 'Amplifier_1', y: 842 }, - { x: '3 ', type: 'Keyboard', y: 531 }, - { x: '3 ', type: 'Amplifier_2', y: 753 }, - { x: '3 ', type: 'Drum', y: 409 }, - { x: '4 ', type: 'Amplifier_1', y: 627 }, - { x: '4 ', type: 'Keyboard', y: 800 }, - { x: '4 ', type: 'Amplifier_2', y: 751 }, - { x: '4 ', type: 'Drum', y: 518 }, - { x: '5 ', type: 'Amplifier_1', y: 894 }, - { x: '5 ', type: 'Keyboard', y: 562 }, - { x: '5 ', type: 'Amplifier_2', y: 649 }, - { x: '5 ', type: 'Drum', y: 352 }, - { x: '6 ', type: 'Amplifier_1', y: 800 }, - { x: '6 ', type: 'Keyboard', y: 528 }, - { x: '6 ', type: 'Amplifier_2', y: 645 }, - { x: '6 ', type: 'Drum', y: 210 }, - { x: '7 ', type: 'Amplifier_1', y: 863 }, - { x: '7 ', type: 'Keyboard', y: 774 }, - { x: '7 ', type: 'Amplifier_2', y: 694 }, - { x: '7 ', type: 'Drum', y: 609 }, - { x: '8 ', type: 'Amplifier_1', y: 909 }, - { x: '8 ', type: 'Keyboard', y: 599 }, - { x: '8 ', type: 'Amplifier_2', y: 706 }, - { x: '8 ', type: 'Drum', y: 216 }, - { x: '9 ', type: 'Amplifier_1', y: 891 }, - { x: '9 ', type: 'Keyboard', y: 216 }, - { x: '9 ', type: 'Amplifier_2', y: 757 }, - { x: '9 ', type: 'Drum', y: 563 }, - { x: '10 ', type: 'Amplifier_1', y: 951 }, - { x: '10 ', type: 'Keyboard', y: 522 }, - { x: '10 ', type: 'Amplifier_2', y: 733 }, - { x: '10 ', type: 'Drum', y: 249 }, - { x: '11 ', type: 'Amplifier_1', y: 854 }, - { x: '11 ', type: 'Keyboard', y: 525 }, - { x: '11 ', type: 'Amplifier_2', y: 661 }, - { x: '11 ', type: 'Drum', y: 422 }, - { x: '12 ', type: 'Amplifier_1', y: 522 }, - { x: '12 ', type: 'Keyboard', y: 630 }, - { x: '12 ', type: 'Amplifier_2', y: 703 }, - { x: '12 ', type: 'Drum', y: 242 }, - { x: '13 ', type: 'Amplifier_1', y: 681 }, - { x: '13 ', type: 'Keyboard', y: 497 }, - { x: '13 ', type: 'Amplifier_2', y: 760 }, - { x: '13 ', type: 'Drum', y: 357 }, - { x: '14 ', type: 'Amplifier_1', y: 621 }, - { x: '14 ', type: 'Keyboard', y: 508 }, - { x: '14 ', type: 'Amplifier_2', y: 809 }, - { x: '14 ', type: 'Drum', y: 419 }, - { x: '15 ', type: 'Amplifier_1', y: 539 }, - { x: '15 ', type: 'Keyboard', y: 607 }, - { x: '15 ', type: 'Amplifier_2', y: 703 }, - { x: '15 ', type: 'Drum', y: 461 }, - { x: '16 ', type: 'Amplifier_1', y: 576 }, - { x: '16 ', type: 'Keyboard', y: 667 }, - { x: '16 ', type: 'Amplifier_2', y: 830 }, - { x: '16 ', type: 'Drum', y: 541 }, - { x: '17 ', type: 'Amplifier_1', y: 508 }, - { x: '17 ', type: 'Keyboard', y: 582 }, - { x: '17 ', type: 'Amplifier_2', y: 684 }, - { x: '17 ', type: 'Drum', y: 316 }, - { x: '18 ', type: 'Amplifier_1', y: 601 }, - { x: '18 ', type: 'Keyboard', y: 536 }, - { x: '18 ', type: 'Amplifier_2', y: 679 }, - { x: '18 ', type: 'Drum', y: 411 }, - { x: '19 ', type: 'Amplifier_1', y: 567 }, - { x: '19 ', type: 'Keyboard', y: 488 }, - { x: '19 ', type: 'Amplifier_2', y: 733 }, - { x: '19 ', type: 'Drum', y: 328 }, - { x: '20 ', type: 'Amplifier_1', y: 505 }, - { x: '20 ', type: 'Keyboard', y: 621 }, - { x: '20 ', type: 'Amplifier_2', y: 670 }, - { x: '20 ', type: 'Drum', y: 234 }, - { x: '21 ', type: 'Amplifier_1', y: 655 }, - { x: '21 ', type: 'Keyboard', y: 686 }, - { x: '21 ', type: 'Amplifier_2', y: 856 }, - { x: '21 ', type: 'Drum', y: 276 }, - { x: '22 ', type: 'Amplifier_1', y: 647 }, - { x: '22 ', type: 'Keyboard', y: 553 }, - { x: '22 ', type: 'Amplifier_2', y: 630 }, - { x: '22 ', type: 'Drum', y: 435 }, - { x: '23 ', type: 'Amplifier_1', y: 936 }, - { x: '23 ', type: 'Keyboard', y: 635 }, - { x: '23 ', type: 'Amplifier_2', y: 830 }, - { x: '23 ', type: 'Drum', y: 522 }, - { x: '24 ', type: 'Amplifier_1', y: 900 }, - { x: '24 ', type: 'Keyboard', y: 476 }, - { x: '24 ', type: 'Amplifier_2', y: 655 }, - { x: '24 ', type: 'Drum', y: 697 }, - { x: '25 ', type: 'Amplifier_1', y: 972 }, - { x: '25 ', type: 'Keyboard', y: 468 }, - { x: '25 ', type: 'Amplifier_2', y: 767 }, - { x: '25 ', type: 'Drum', y: 558 }, - { x: '26 ', type: 'Amplifier_1', y: 888 }, - { x: '26 ', type: 'Keyboard', y: 604 }, - { x: '26 ', type: 'Amplifier_2', y: 788 }, - { x: '26 ', type: 'Drum', y: 549 }, - { x: '27 ', type: 'Amplifier_1', y: 863 }, - { x: '27 ', type: 'Keyboard', y: 519 }, - { x: '27 ', type: 'Amplifier_2', y: 615 }, - { x: '27 ', type: 'Drum', y: 394 }, - { x: '28 ', type: 'Amplifier_1', y: 960 }, - { x: '28 ', type: 'Keyboard', y: 505 }, - { x: '28 ', type: 'Amplifier_2', y: 726 }, - { x: '28 ', type: 'Drum', y: 452 }, - { x: '29 ', type: 'Amplifier_1', y: 885 }, - { x: '29 ', type: 'Keyboard', y: 562 }, - { x: '29 ', type: 'Amplifier_2', y: 697 }, - { x: '29 ', type: 'Drum', y: 337 }, - { x: '30 ', type: 'Amplifier_1', y: 966 }, - { x: '30 ', type: 'Keyboard', y: 616 }, - { x: '30 ', type: 'Amplifier_2', y: 806 }, - { x: '30 ', type: 'Drum', y: 350 }, - { x: '31 ', type: 'Amplifier_1', y: 885 }, - { x: '31 ', type: 'Keyboard', y: 553 }, - { x: '31 ', type: 'Amplifier_2', y: 721 }, - { x: '31 ', type: 'Drum', y: 312 }, - { x: '32 ', type: 'Amplifier_1', y: 833 }, - { x: '32 ', type: 'Keyboard', y: 264 }, - { x: '32 ', type: 'Amplifier_2', y: 715 }, - { x: '32 ', type: 'Drum', y: 602 }, - { x: '33 ', type: 'Amplifier_1', y: 900 }, - { x: '33 ', type: 'Keyboard', y: 240 }, - { x: '33 ', type: 'Amplifier_2', y: 790 }, - { x: '33 ', type: 'Drum', y: 382 }, - { x: '34 ', type: 'Amplifier_1', y: 906 }, - { x: '34 ', type: 'Keyboard', y: 428 }, - { x: '34 ', type: 'Amplifier_2', y: 667 }, - { x: '34 ', type: 'Drum', y: 576 }, - { x: '35 ', type: 'Amplifier_1', y: 966 }, - { x: '35 ', type: 'Keyboard', y: 264 }, - { x: '35 ', type: 'Amplifier_2', y: 773 }, - { x: '35 ', type: 'Drum', y: 439 }, - { x: '36 ', type: 'Amplifier_1', y: 894 }, - { x: '36 ', type: 'Keyboard', y: 267 }, - { x: '36 ', type: 'Amplifier_2', y: 694 }, - { x: '36 ', type: 'Drum', y: 361 }, - { x: '37 ', type: 'Amplifier_1', y: 939 }, - { x: '37 ', type: 'Keyboard', y: 273 }, - { x: '37 ', type: 'Amplifier_2', y: 846 }, - { x: '37 ', type: 'Drum', y: 416 }, - { x: '38 ', type: 'Amplifier_1', y: 915 }, - { x: '38 ', type: 'Keyboard', y: 327 }, - { x: '38 ', type: 'Amplifier_2', y: 694 }, - { x: '38 ', type: 'Drum', y: 589 }, - { x: '39 ', type: 'Amplifier_1', y: 996 }, - { x: '39 ', type: 'Keyboard', y: 293 }, - { x: '39 ', type: 'Amplifier_2', y: 794 }, - { x: '39 ', type: 'Drum', y: 509 }, - { x: '40 ', type: 'Amplifier_1', y: 921 }, - { x: '40 ', type: 'Keyboard', y: 324 }, - { x: '40 ', type: 'Amplifier_2', y: 715 }, - { x: '40 ', type: 'Drum', y: 637 }, - { x: '41 ', type: 'Amplifier_1', y: 952 }, - { x: '41 ', type: 'Keyboard', y: 267 }, - { x: '41 ', type: 'Amplifier_2', y: 730 }, - { x: '41 ', type: 'Drum', y: 484 }, - { x: '42 ', type: 'Amplifier_1', y: 912 }, - { x: '42 ', type: 'Keyboard', y: 321 }, - { x: '42 ', type: 'Amplifier_2', y: 655 }, - { x: '42 ', type: 'Drum', y: 458 }, - { x: '43 ', type: 'Amplifier_1', y: 658 }, - { x: '43 ', type: 'Keyboard', y: 361 }, - { x: '43 ', type: 'Amplifier_2', y: 754 }, - { x: '43 ', type: 'Drum', y: 470 }, - { x: '44 ', type: 'Amplifier_1', y: 664 }, - { x: '44 ', type: 'Keyboard', y: 389 }, - { x: '44 ', type: 'Amplifier_2', y: 721 }, - { x: '44 ', type: 'Drum', y: 591 }, - { x: '45 ', type: 'Amplifier_1', y: 906 }, - { x: '45 ', type: 'Keyboard', y: 264 }, - { x: '45 ', type: 'Amplifier_2', y: 673 }, - { x: '45 ', type: 'Drum', y: 449 }, - { x: '46 ', type: 'Amplifier_1', y: 951 }, - { x: '46 ', type: 'Keyboard', y: 182 }, - { x: '46 ', type: 'Amplifier_2', y: 609 }, - { x: '46 ', type: 'Drum', y: 479 }, - { x: '47 ', type: 'Amplifier_1', y: 881 }, - { x: '47 ', type: 'Keyboard', y: 253 }, - { x: '47 ', type: 'Amplifier_2', y: 652 }, - { x: '47 ', type: 'Drum', y: 351 }, - { x: '48', type: 'Amplifier_1', y: 516 }, - { x: '48', type: 'Keyboard', y: 582 }, - { x: '48', type: 'Amplifier_2', y: 736 }, - { x: '48', type: 'Drum', y: 374 }, -]; - -/** - * 流行音乐 pop - */ -export const POP = [ - { x: '1 ', type: 'Lead_guitar', y: 936 }, - { x: '1 ', type: 'Drum', y: 635 }, - { x: '1 ', type: 'Electri_bass', y: 712 }, - { x: '1 ', type: 'Keyboard', y: 290 }, - { x: '1 ', type: 'Amplifier', y: 100 }, - { x: '1 ', type: 'Rhythm_guitar', y: 130 }, - { x: '2 ', type: 'Lead_guitar', y: 897 }, - { x: '2 ', type: 'Drum', y: 681 }, - { x: '2 ', type: 'Electri_bass', y: 587 }, - { x: '2 ', type: 'Keyboard', y: 264 }, - { x: '2 ', type: 'Amplifier', y: 100 }, - { x: '2 ', type: 'Rhythm_guitar', y: 130 }, - { x: '3 ', type: 'Lead_guitar', y: 941 }, - { x: '3 ', type: 'Drum', y: 661 }, - { x: '3 ', type: 'Electri_bass', y: 570 }, - { x: '3 ', type: 'Keyboard', y: 161 }, - { x: '3 ', type: 'Amplifier', y: 800 }, - { x: '3 ', type: 'Rhythm_guitar', y: 1040 }, - { x: '4 ', type: 'Lead_guitar', y: 876 }, - { x: '4 ', type: 'Drum', y: 694 }, - { x: '4 ', type: 'Electri_bass', y: 609 }, - { x: '4 ', type: 'Keyboard', y: 234 }, - { x: '4 ', type: 'Amplifier', y: 800 }, - { x: '4 ', type: 'Rhythm_guitar', y: 1040 }, - { x: '5 ', type: 'Lead_guitar', y: 924 }, - { x: '5 ', type: 'Drum', y: 757 }, - { x: '5 ', type: 'Electri_bass', y: 563 }, - { x: '5 ', type: 'Keyboard', y: 216 }, - { x: '5 ', type: 'Amplifier', y: 200 }, - { x: '5 ', type: 'Rhythm_guitar', y: 260 }, - { x: '6 ', type: 'Lead_guitar', y: 873 }, - { x: '6 ', type: 'Drum', y: 661 }, - { x: '6 ', type: 'Electri_bass', y: 422 }, - { x: '6 ', type: 'Keyboard', y: 279 }, - { x: '6 ', type: 'Amplifier', y: 200 }, - { x: '6 ', type: 'Rhythm_guitar', y: 260 }, - { x: '7 ', type: 'Lead_guitar', y: 766 }, - { x: '7 ', type: 'Drum', y: 703 }, - { x: '7 ', type: 'Electri_bass', y: 357 }, - { x: '7 ', type: 'Keyboard', y: 192 }, - { x: '7 ', type: 'Amplifier', y: 600 }, - { x: '7 ', type: 'Rhythm_guitar', y: 780 }, - { x: '8 ', type: 'Lead_guitar', y: 875 }, - { x: '8 ', type: 'Drum', y: 703 }, - { x: '8 ', type: 'Electri_bass', y: 461 }, - { x: '8 ', type: 'Keyboard', y: 309 }, - { x: '8 ', type: 'Amplifier', y: 600 }, - { x: '8 ', type: 'Rhythm_guitar', y: 780 }, - { x: '9 ', type: 'Lead_guitar', y: 888 }, - { x: '9 ', type: 'Drum', y: 706 }, - { x: '9 ', type: 'Electri_bass', y: 316 }, - { x: '9 ', type: 'Keyboard', y: 222 }, - { x: '9 ', type: 'Amplifier', y: 300 }, - { x: '9 ', type: 'Rhythm_guitar', y: 390 }, - { x: '10 ', type: 'Lead_guitar', y: 875 }, - { x: '10 ', type: 'Drum', y: 733 }, - { x: '10 ', type: 'Electri_bass', y: 328 }, - { x: '10 ', type: 'Keyboard', y: 222 }, - { x: '10 ', type: 'Amplifier', y: 300 }, - { x: '10 ', type: 'Rhythm_guitar', y: 390 }, - { x: '11 ', type: 'Lead_guitar', y: 896 }, - { x: '11 ', type: 'Drum', y: 672 }, - { x: '11 ', type: 'Electri_bass', y: 276 }, - { x: '11 ', type: 'Keyboard', y: 174 }, - { x: '11 ', type: 'Amplifier', y: 500 }, - { x: '11 ', type: 'Rhythm_guitar', y: 650 }, - { x: '12 ', type: 'Lead_guitar', y: 865 }, - { x: '12 ', type: 'Drum', y: 672 }, - { x: '12 ', type: 'Electri_bass', y: 522 }, - { x: '12 ', type: 'Keyboard', y: 207 }, - { x: '12 ', type: 'Amplifier', y: 500 }, - { x: '12 ', type: 'Rhythm_guitar', y: 650 }, - { x: '13 ', type: 'Lead_guitar', y: 916 }, - { x: '13 ', type: 'Drum', y: 638 }, - { x: '13 ', type: 'Electri_bass', y: 558 }, - { x: '13 ', type: 'Keyboard', y: 273 }, - { x: '13 ', type: 'Amplifier', y: 400 }, - { x: '13 ', type: 'Rhythm_guitar', y: 520 }, - { x: '14 ', type: 'Lead_guitar', y: 947 }, - { x: '14 ', type: 'Drum', y: 678 }, - { x: '14 ', type: 'Electri_bass', y: 394 }, - { x: '14 ', type: 'Keyboard', y: 175 }, - { x: '14 ', type: 'Amplifier', y: 400 }, - { x: '14 ', type: 'Rhythm_guitar', y: 520 }, - { x: '15 ', type: 'Lead_guitar', y: 644 }, - { x: '15 ', type: 'Drum', y: 596 }, - { x: '15 ', type: 'Electri_bass', y: 337 }, - { x: '15 ', type: 'Keyboard', y: 237 }, - { x: '15 ', type: 'Amplifier', y: 500 }, - { x: '15 ', type: 'Rhythm_guitar', y: 650 }, - { x: '16 ', type: 'Lead_guitar', y: 834 }, - { x: '16 ', type: 'Drum', y: 635 }, - { x: '16 ', type: 'Electri_bass', y: 312 }, - { x: '16 ', type: 'Keyboard', y: 251 }, - { x: '16 ', type: 'Amplifier', y: 500 }, - { x: '16 ', type: 'Rhythm_guitar', y: 650 }, - { x: '17 ', type: 'Lead_guitar', y: 900 }, - { x: '17 ', type: 'Drum', y: 681 }, - { x: '17 ', type: 'Electri_bass', y: 382 }, - { x: '17 ', type: 'Keyboard', y: 240 }, - { x: '17 ', type: 'Amplifier', y: 300 }, - { x: '17 ', type: 'Rhythm_guitar', y: 390 }, - { x: '18 ', type: 'Lead_guitar', y: 966 }, - { x: '18 ', type: 'Drum', y: 703 }, - { x: '18 ', type: 'Electri_bass', y: 439 }, - { x: '18 ', type: 'Keyboard', y: 264 }, - { x: '18 ', type: 'Amplifier', y: 300 }, - { x: '18 ', type: 'Rhythm_guitar', y: 390 }, - { x: '19 ', type: 'Lead_guitar', y: 939 }, - { x: '19 ', type: 'Drum', y: 698 }, - { x: '19 ', type: 'Electri_bass', y: 416 }, - { x: '19 ', type: 'Keyboard', y: 198 }, - { x: '19 ', type: 'Amplifier', y: 600 }, - { x: '19 ', type: 'Rhythm_guitar', y: 780 }, - { x: '20 ', type: 'Lead_guitar', y: 996 }, - { x: '20 ', type: 'Drum', y: 715 }, - { x: '20 ', type: 'Electri_bass', y: 509 }, - { x: '20 ', type: 'Keyboard', y: 388 }, - { x: '20 ', type: 'Amplifier', y: 600 }, - { x: '20 ', type: 'Rhythm_guitar', y: 780 }, - { x: '21 ', type: 'Lead_guitar', y: 952 }, - { x: '21 ', type: 'Drum', y: 730 }, - { x: '21 ', type: 'Electri_bass', y: 484 }, - { x: '21 ', type: 'Keyboard', y: 340 }, - { x: '21 ', type: 'Amplifier', y: 200 }, - { x: '21 ', type: 'Rhythm_guitar', y: 260 }, - { x: '22 ', type: 'Lead_guitar', y: 954 }, - { x: '22 ', type: 'Drum', y: 754 }, - { x: '22 ', type: 'Electri_bass', y: 470 }, - { x: '22 ', type: 'Keyboard', y: 337 }, - { x: '22 ', type: 'Amplifier', y: 200 }, - { x: '22 ', type: 'Rhythm_guitar', y: 260 }, - { x: '23 ', type: 'Lead_guitar', y: 906 }, - { x: '23 ', type: 'Drum', y: 673 }, - { x: '23 ', type: 'Electri_bass', y: 449 }, - { x: '23 ', type: 'Keyboard', y: 358 }, - { x: '23 ', type: 'Amplifier', y: 800 }, - { x: '23 ', type: 'Rhythm_guitar', y: 1040 }, - { x: '24 ', type: 'Lead_guitar', y: 970 }, - { x: '24 ', type: 'Drum', y: 652 }, - { x: '24 ', type: 'Electri_bass', y: 449 }, - { x: '24 ', type: 'Keyboard', y: 195 }, - { x: '24 ', type: 'Amplifier', y: 800 }, - { x: '24 ', type: 'Rhythm_guitar', y: 1040 }, - { x: '25 ', type: 'Lead_guitar', y: 942 }, - { x: '25 ', type: 'Drum', y: 736 }, - { x: '25 ', type: 'Electri_bass', y: 434 }, - { x: '25 ', type: 'Keyboard', y: 261 }, - { x: '25 ', type: 'Amplifier', y: 100 }, - { x: '25 ', type: 'Rhythm_guitar', y: 130 }, - { x: '26 ', type: 'Lead_guitar', y: 464 }, - { x: '26 ', type: 'Drum', y: 625.5 }, - { x: '26 ', type: 'Electri_bass', y: 677 }, - { x: '26 ', type: 'Keyboard', y: 233 }, - { x: '26 ', type: 'Amplifier', y: 100 }, - { x: '26 ', type: 'Rhythm_guitar', y: 130 }, - { x: '27 ', type: 'Lead_guitar', y: 513 }, - { x: '27 ', type: 'Drum', y: 671.4 }, - { x: '27 ', type: 'Electri_bass', y: 435 }, - { x: '27 ', type: 'Keyboard', y: 325 }, - { x: '27 ', type: 'Amplifier', y: 800 }, - { x: '27 ', type: 'Rhythm_guitar', y: 1040 }, - { x: '28 ', type: 'Lead_guitar', y: 332 }, - { x: '28 ', type: 'Drum', y: 580.5 }, - { x: '28 ', type: 'Electri_bass', y: 663 }, - { x: '28 ', type: 'Keyboard', y: 179 }, - { x: '28 ', type: 'Amplifier', y: 800 }, - { x: '28 ', type: 'Rhythm_guitar', y: 1040 }, - { x: '29 ', type: 'Lead_guitar', y: 740 }, - { x: '29 ', type: 'Drum', y: 635.4 }, - { x: '29 ', type: 'Electri_bass', y: 424 }, - { x: '29 ', type: 'Keyboard', y: 133 }, - { x: '29 ', type: 'Amplifier', y: 200 }, - { x: '29 ', type: 'Rhythm_guitar', y: 260 }, - { x: '30 ', type: 'Lead_guitar', y: 149 }, - { x: '30 ', type: 'Drum', y: 659.7 }, - { x: '30 ', type: 'Electri_bass', y: 455 }, - { x: '30 ', type: 'Keyboard', y: 44 }, - { x: '30 ', type: 'Amplifier', y: 200 }, - { x: '30 ', type: 'Rhythm_guitar', y: 260 }, - { x: '31 ', type: 'Lead_guitar', y: 475 }, - { x: '31 ', type: 'Drum', y: 632.7 }, - { x: '31 ', type: 'Electri_bass', y: 374 }, - { x: '31 ', type: 'Keyboard', y: 59 }, - { x: '31 ', type: 'Amplifier', y: 600 }, - { x: '31 ', type: 'Rhythm_guitar', y: 780 }, - { x: '32 ', type: 'Lead_guitar', y: 577 }, - { x: '32 ', type: 'Drum', y: 536.4 }, - { x: '32 ', type: 'Electri_bass', y: 377 }, - { x: '32 ', type: 'Keyboard', y: 232 }, - { x: '32 ', type: 'Amplifier', y: 600 }, - { x: '32 ', type: 'Rhythm_guitar', y: 780 }, - { x: '33 ', type: 'Lead_guitar', y: 781 }, - { x: '33 ', type: 'Drum', y: 579.6 }, - { x: '33 ', type: 'Electri_bass', y: 487 }, - { x: '33 ', type: 'Keyboard', y: 338 }, - { x: '33 ', type: 'Amplifier', y: 300 }, - { x: '33 ', type: 'Rhythm_guitar', y: 390 }, - { x: '34 ', type: 'Lead_guitar', y: 862 }, - { x: '34 ', type: 'Drum', y: 611.1 }, - { x: '34 ', type: 'Electri_bass', y: 370 }, - { x: '34 ', type: 'Keyboard', y: 287 }, - { x: '34 ', type: 'Amplifier', y: 300 }, - { x: '34 ', type: 'Rhythm_guitar', y: 390 }, - { x: '35 ', type: 'Lead_guitar', y: 837 }, - { x: '35 ', type: 'Drum', y: 603 }, - { x: '35 ', type: 'Electri_bass', y: 353 }, - { x: '35 ', type: 'Keyboard', y: 131 }, - { x: '35 ', type: 'Amplifier', y: 500 }, - { x: '35 ', type: 'Rhythm_guitar', y: 650 }, - { x: '36 ', type: 'Lead_guitar', y: 868 }, - { x: '36 ', type: 'Drum', y: 567 }, - { x: '36 ', type: 'Electri_bass', y: 392 }, - { x: '36 ', type: 'Keyboard', y: 306 }, - { x: '36 ', type: 'Amplifier', y: 500 }, - { x: '36 ', type: 'Rhythm_guitar', y: 650 }, - { x: '37 ', type: 'Lead_guitar', y: 439 }, - { x: '37 ', type: 'Drum', y: 589.5 }, - { x: '37 ', type: 'Electri_bass', y: 627 }, - { x: '37 ', type: 'Keyboard', y: 428 }, - { x: '37 ', type: 'Amplifier', y: 400 }, - { x: '37 ', type: 'Rhythm_guitar', y: 520 }, - { x: '38 ', type: 'Lead_guitar', y: 631 }, - { x: '38 ', type: 'Drum', y: 574.2 }, - { x: '38 ', type: 'Electri_bass', y: 494 }, - { x: '38 ', type: 'Keyboard', y: 357 }, - { x: '38 ', type: 'Amplifier', y: 400 }, - { x: '38 ', type: 'Rhythm_guitar', y: 520 }, - { x: '39 ', type: 'Lead_guitar', y: 864 }, - { x: '39 ', type: 'Drum', y: 653.4 }, - { x: '39 ', type: 'Electri_bass', y: 407 }, - { x: '39 ', type: 'Keyboard', y: 290 }, - { x: '39 ', type: 'Amplifier', y: 500 }, - { x: '39 ', type: 'Rhythm_guitar', y: 650 }, - { x: '40 ', type: 'Lead_guitar', y: 869 }, - { x: '40 ', type: 'Drum', y: 602.1 }, - { x: '40 ', type: 'Electri_bass', y: 315 }, - { x: '40 ', type: 'Keyboard', y: 200 }, - { x: '40 ', type: 'Amplifier', y: 500 }, - { x: '40 ', type: 'Rhythm_guitar', y: 650 }, - { x: '41 ', type: 'Lead_guitar', y: 279 }, - { x: '41 ', type: 'Drum', y: 604.8 }, - { x: '41 ', type: 'Electri_bass', y: 542 }, - { x: '41 ', type: 'Keyboard', y: 238 }, - { x: '41 ', type: 'Amplifier', y: 300 }, - { x: '41 ', type: 'Rhythm_guitar', y: 390 }, - { x: '42 ', type: 'Lead_guitar', y: 383 }, - { x: '42 ', type: 'Drum', y: 600.3 }, - { x: '42 ', type: 'Electri_bass', y: 518 }, - { x: '42 ', type: 'Keyboard', y: 385 }, - { x: '42 ', type: 'Amplifier', y: 300 }, - { x: '42 ', type: 'Rhythm_guitar', y: 390 }, - { x: '43 ', type: 'Lead_guitar', y: 503 }, - { x: '43 ', type: 'Drum', y: 624.6 }, - { x: '43 ', type: 'Electri_bass', y: 325 }, - { x: '43 ', type: 'Keyboard', y: 240 }, - { x: '43 ', type: 'Amplifier', y: 600 }, - { x: '43 ', type: 'Rhythm_guitar', y: 780 }, - { x: '44 ', type: 'Lead_guitar', y: 570 }, - { x: '44 ', type: 'Drum', y: 624.6 }, - { x: '44 ', type: 'Electri_bass', y: 530 }, - { x: '44 ', type: 'Keyboard', y: 355 }, - { x: '44 ', type: 'Amplifier', y: 600 }, - { x: '44 ', type: 'Rhythm_guitar', y: 780 }, - { x: '45 ', type: 'Lead_guitar', y: 411 }, - { x: '45 ', type: 'Drum', y: 643.5 }, - { x: '45 ', type: 'Electri_bass', y: 573 }, - { x: '45 ', type: 'Keyboard', y: 196 }, - { x: '45 ', type: 'Amplifier', y: 200 }, - { x: '45 ', type: 'Rhythm_guitar', y: 260 }, - { x: '46 ', type: 'Lead_guitar', y: 495 }, - { x: '46 ', type: 'Drum', y: 686.7 }, - { x: '46 ', type: 'Electri_bass', y: 412 }, - { x: '46 ', type: 'Keyboard', y: 200 }, - { x: '46 ', type: 'Amplifier', y: 200 }, - { x: '46 ', type: 'Rhythm_guitar', y: 260 }, - { x: '47 ', type: 'Lead_guitar', y: 567 }, - { x: '47 ', type: 'Drum', y: 648.9 }, - { x: '47 ', type: 'Electri_bass', y: 532 }, - { x: '47 ', type: 'Keyboard', y: 426 }, - { x: '47 ', type: 'Amplifier', y: 800 }, - { x: '47 ', type: 'Rhythm_guitar', y: 1040 }, - { x: '48 ', type: 'Lead_guitar', y: 455 }, - { x: '48 ', type: 'Drum', y: 628.2 }, - { x: '48 ', type: 'Electri_bass', y: 431 }, - { x: '48 ', type: 'Keyboard', y: 266 }, - { x: '48 ', type: 'Amplifier', y: 800 }, - { x: '48 ', type: 'Rhythm_guitar', y: 1040 }, - { x: '49 ', type: 'Lead_guitar', y: 516 }, - { x: '49 ', type: 'Drum', y: 695 }, - { x: '49 ', type: 'Electri_bass', y: 752 }, - { x: '49 ', type: 'Keyboard', y: 259 }, - { x: '49 ', type: 'Amplifier', y: 100 }, - { x: '49 ', type: 'Rhythm_guitar', y: 130 }, - { x: '50 ', type: 'Lead_guitar', y: 570 }, - { x: '50 ', type: 'Drum', y: 746 }, - { x: '50 ', type: 'Electri_bass', y: 483 }, - { x: '50 ', type: 'Keyboard', y: 361 }, - { x: '50 ', type: 'Amplifier', y: 100 }, - { x: '50 ', type: 'Rhythm_guitar', y: 130 }, - { x: '51 ', type: 'Lead_guitar', y: 369 }, - { x: '51 ', type: 'Drum', y: 645 }, - { x: '51 ', type: 'Electri_bass', y: 737 }, - { x: '51 ', type: 'Keyboard', y: 199 }, - { x: '51 ', type: 'Amplifier', y: 800 }, - { x: '51 ', type: 'Rhythm_guitar', y: 1040 }, - { x: '52 ', type: 'Lead_guitar', y: 822 }, - { x: '52 ', type: 'Drum', y: 706 }, - { x: '52 ', type: 'Electri_bass', y: 471 }, - { x: '52 ', type: 'Keyboard', y: 148 }, - { x: '52 ', type: 'Amplifier', y: 800 }, - { x: '52 ', type: 'Rhythm_guitar', y: 1040 }, - { x: '53 ', type: 'Lead_guitar', y: 165 }, - { x: '53 ', type: 'Drum', y: 733 }, - { x: '53 ', type: 'Electri_bass', y: 505 }, - { x: '53 ', type: 'Keyboard', y: 49 }, - { x: '53 ', type: 'Amplifier', y: 200 }, - { x: '53 ', type: 'Rhythm_guitar', y: 260 }, - { x: '54 ', type: 'Lead_guitar', y: 528 }, - { x: '54 ', type: 'Drum', y: 703 }, - { x: '54 ', type: 'Electri_bass', y: 415 }, - { x: '54 ', type: 'Keyboard', y: 66 }, - { x: '54 ', type: 'Amplifier', y: 200 }, - { x: '54 ', type: 'Rhythm_guitar', y: 260 }, - { x: '55 ', type: 'Lead_guitar', y: 641 }, - { x: '55 ', type: 'Drum', y: 596 }, - { x: '55 ', type: 'Electri_bass', y: 419 }, - { x: '55 ', type: 'Keyboard', y: 258 }, - { x: '55 ', type: 'Amplifier', y: 600 }, - { x: '55 ', type: 'Rhythm_guitar', y: 780 }, - { x: '56 ', type: 'Lead_guitar', y: 868 }, - { x: '56 ', type: 'Drum', y: 644 }, - { x: '56 ', type: 'Electri_bass', y: 541 }, - { x: '56 ', type: 'Keyboard', y: 376 }, - { x: '56 ', type: 'Amplifier', y: 600 }, - { x: '56 ', type: 'Rhythm_guitar', y: 780 }, - { x: '57 ', type: 'Lead_guitar', y: 958 }, - { x: '57 ', type: 'Drum', y: 679 }, - { x: '57 ', type: 'Electri_bass', y: 411 }, - { x: '57 ', type: 'Keyboard', y: 319 }, - { x: '57 ', type: 'Amplifier', y: 300 }, - { x: '57 ', type: 'Rhythm_guitar', y: 390 }, - { x: '58 ', type: 'Lead_guitar', y: 930 }, - { x: '58 ', type: 'Drum', y: 670 }, - { x: '58 ', type: 'Electri_bass', y: 392 }, - { x: '58 ', type: 'Keyboard', y: 146 }, - { x: '58 ', type: 'Amplifier', y: 300 }, - { x: '58 ', type: 'Rhythm_guitar', y: 390 }, - { x: '59 ', type: 'Lead_guitar', y: 964 }, - { x: '59 ', type: 'Drum', y: 630 }, - { x: '59 ', type: 'Electri_bass', y: 435 }, - { x: '59 ', type: 'Keyboard', y: 340 }, - { x: '59 ', type: 'Amplifier', y: 500 }, - { x: '59 ', type: 'Rhythm_guitar', y: 650 }, - { x: '60 ', type: 'Lead_guitar', y: 488 }, - { x: '60 ', type: 'Drum', y: 655 }, - { x: '60 ', type: 'Electri_bass', y: 697 }, - { x: '60 ', type: 'Keyboard', y: 476 }, - { x: '60 ', type: 'Amplifier', y: 500 }, - { x: '60 ', type: 'Rhythm_guitar', y: 650 }, - { x: '61 ', type: 'Lead_guitar', y: 701 }, - { x: '61 ', type: 'Drum', y: 638 }, - { x: '61 ', type: 'Electri_bass', y: 549 }, - { x: '61 ', type: 'Keyboard', y: 397 }, - { x: '61 ', type: 'Amplifier', y: 400 }, - { x: '61 ', type: 'Rhythm_guitar', y: 520 }, - { x: '62 ', type: 'Lead_guitar', y: 960 }, - { x: '62 ', type: 'Drum', y: 726 }, - { x: '62 ', type: 'Electri_bass', y: 452 }, - { x: '62 ', type: 'Keyboard', y: 322 }, - { x: '62 ', type: 'Amplifier', y: 400 }, - { x: '62 ', type: 'Rhythm_guitar', y: 520 }, - { x: '63 ', type: 'Lead_guitar', y: 966 }, - { x: '63 ', type: 'Drum', y: 669 }, - { x: '63 ', type: 'Electri_bass', y: 350 }, - { x: '63 ', type: 'Keyboard', y: 222 }, - { x: '63 ', type: 'Amplifier', y: 500 }, - { x: '63 ', type: 'Rhythm_guitar', y: 650 }, - { x: '64 ', type: 'Lead_guitar', y: 310 }, - { x: '64 ', type: 'Drum', y: 672 }, - { x: '64 ', type: 'Electri_bass', y: 602 }, - { x: '64 ', type: 'Keyboard', y: 264 }, - { x: '64 ', type: 'Amplifier', y: 500 }, - { x: '64 ', type: 'Rhythm_guitar', y: 650 }, - { x: '65 ', type: 'Lead_guitar', y: 426 }, - { x: '65 ', type: 'Drum', y: 667 }, - { x: '65 ', type: 'Electri_bass', y: 576 }, - { x: '65 ', type: 'Keyboard', y: 428 }, - { x: '65 ', type: 'Amplifier', y: 300 }, - { x: '65 ', type: 'Rhythm_guitar', y: 390 }, - { x: '66 ', type: 'Lead_guitar', y: 559 }, - { x: '66 ', type: 'Drum', y: 694 }, - { x: '66 ', type: 'Electri_bass', y: 361 }, - { x: '66 ', type: 'Keyboard', y: 267 }, - { x: '66 ', type: 'Amplifier', y: 300 }, - { x: '66 ', type: 'Rhythm_guitar', y: 390 }, - { x: '67 ', type: 'Lead_guitar', y: 633 }, - { x: '67 ', type: 'Drum', y: 694 }, - { x: '67 ', type: 'Electri_bass', y: 589 }, - { x: '67 ', type: 'Keyboard', y: 394 }, - { x: '67 ', type: 'Amplifier', y: 600 }, - { x: '67 ', type: 'Rhythm_guitar', y: 780 }, - { x: '68 ', type: 'Lead_guitar', y: 457 }, - { x: '68 ', type: 'Drum', y: 715 }, - { x: '68 ', type: 'Electri_bass', y: 637 }, - { x: '68 ', type: 'Keyboard', y: 218 }, - { x: '68 ', type: 'Amplifier', y: 600 }, - { x: '68 ', type: 'Rhythm_guitar', y: 780 }, - { x: '69 ', type: 'Lead_guitar', y: 550 }, - { x: '69 ', type: 'Drum', y: 763 }, - { x: '69 ', type: 'Electri_bass', y: 458 }, - { x: '69 ', type: 'Keyboard', y: 222 }, - { x: '69 ', type: 'Amplifier', y: 200 }, - { x: '69 ', type: 'Rhythm_guitar', y: 260 }, - { x: '70 ', type: 'Lead_guitar', y: 630 }, - { x: '70 ', type: 'Drum', y: 721 }, - { x: '70 ', type: 'Electri_bass', y: 591 }, - { x: '70 ', type: 'Keyboard', y: 473 }, - { x: '70 ', type: 'Amplifier', y: 200 }, - { x: '70 ', type: 'Rhythm_guitar', y: 260 }, - { x: '71 ', type: 'Lead_guitar', y: 505 }, - { x: '71 ', type: 'Drum', y: 698 }, - { x: '71 ', type: 'Electri_bass', y: 479 }, - { x: '71 ', type: 'Keyboard', y: 295 }, - { x: '71 ', type: 'Amplifier', y: 800 }, - { x: '71 ', type: 'Rhythm_guitar', y: 1040 }, - { x: '72 ', type: 'Lead_guitar', y: 842 }, - { x: '72 ', type: 'Drum', y: 571.5 }, - { x: '72 ', type: 'Electri_bass', y: 641 }, - { x: '72 ', type: 'Keyboard', y: 261 }, - { x: '72 ', type: 'Amplifier', y: 800 }, - { x: '72 ', type: 'Rhythm_guitar', y: 1040 }, - { x: '73 ', type: 'Lead_guitar', y: 807 }, - { x: '73 ', type: 'Drum', y: 612.9 }, - { x: '73 ', type: 'Electri_bass', y: 528 }, - { x: '73 ', type: 'Keyboard', y: 238 }, - { x: '73 ', type: 'Amplifier', y: 100 }, - { x: '73 ', type: 'Rhythm_guitar', y: 130 }, - { x: '74 ', type: 'Lead_guitar', y: 847 }, - { x: '74 ', type: 'Drum', y: 594.9 }, - { x: '74 ', type: 'Electri_bass', y: 513 }, - { x: '74 ', type: 'Keyboard', y: 145 }, - { x: '74 ', type: 'Amplifier', y: 100 }, - { x: '74 ', type: 'Rhythm_guitar', y: 130 }, - { x: '75 ', type: 'Lead_guitar', y: 788 }, - { x: '75 ', type: 'Drum', y: 624.6 }, - { x: '75 ', type: 'Electri_bass', y: 548 }, - { x: '75 ', type: 'Keyboard', y: 211 }, - { x: '75 ', type: 'Amplifier', y: 800 }, - { x: '75 ', type: 'Rhythm_guitar', y: 1040 }, - { x: '76 ', type: 'Lead_guitar', y: 832 }, - { x: '76 ', type: 'Drum', y: 681.3 }, - { x: '76 ', type: 'Electri_bass', y: 507 }, - { x: '76 ', type: 'Keyboard', y: 194 }, - { x: '76 ', type: 'Amplifier', y: 800 }, - { x: '76 ', type: 'Rhythm_guitar', y: 1040 }, - { x: '77 ', type: 'Lead_guitar', y: 786 }, - { x: '77 ', type: 'Drum', y: 594.9 }, - { x: '77 ', type: 'Electri_bass', y: 380 }, - { x: '77 ', type: 'Keyboard', y: 251 }, - { x: '77 ', type: 'Amplifier', y: 200 }, - { x: '77 ', type: 'Rhythm_guitar', y: 260 }, - { x: '78 ', type: 'Lead_guitar', y: 689 }, - { x: '78 ', type: 'Drum', y: 632.7 }, - { x: '78 ', type: 'Electri_bass', y: 321 }, - { x: '78 ', type: 'Keyboard', y: 173 }, - { x: '78 ', type: 'Amplifier', y: 200 }, - { x: '78 ', type: 'Rhythm_guitar', y: 260 }, - { x: '79 ', type: 'Lead_guitar', y: 788 }, - { x: '79 ', type: 'Drum', y: 632.7 }, - { x: '79 ', type: 'Electri_bass', y: 415 }, - { x: '79 ', type: 'Keyboard', y: 278 }, - { x: '79 ', type: 'Amplifier', y: 600 }, - { x: '79 ', type: 'Rhythm_guitar', y: 780 }, - { x: '80 ', type: 'Lead_guitar', y: 799 }, - { x: '80 ', type: 'Drum', y: 635.4 }, - { x: '80 ', type: 'Electri_bass', y: 284 }, - { x: '80 ', type: 'Keyboard', y: 200 }, - { x: '80 ', type: 'Amplifier', y: 600 }, - { x: '80 ', type: 'Rhythm_guitar', y: 780 }, - { x: '81 ', type: 'Lead_guitar', y: 788 }, - { x: '81 ', type: 'Drum', y: 659.7 }, - { x: '81 ', type: 'Electri_bass', y: 295 }, - { x: '81 ', type: 'Keyboard', y: 200 }, - { x: '81 ', type: 'Amplifier', y: 300 }, - { x: '81 ', type: 'Rhythm_guitar', y: 390 }, - { x: '82 ', type: 'Lead_guitar', y: 806 }, - { x: '82 ', type: 'Drum', y: 604.8 }, - { x: '82 ', type: 'Electri_bass', y: 248 }, - { x: '82 ', type: 'Keyboard', y: 157 }, - { x: '82 ', type: 'Amplifier', y: 300 }, - { x: '82 ', type: 'Rhythm_guitar', y: 390 }, - { x: '83 ', type: 'Lead_guitar', y: 779 }, - { x: '83 ', type: 'Drum', y: 604.8 }, - { x: '83 ', type: 'Electri_bass', y: 470 }, - { x: '83 ', type: 'Keyboard', y: 186 }, - { x: '83 ', type: 'Amplifier', y: 500 }, - { x: '83 ', type: 'Rhythm_guitar', y: 650 }, - { x: '84 ', type: 'Lead_guitar', y: 824 }, - { x: '84 ', type: 'Drum', y: 574.2 }, - { x: '84 ', type: 'Electri_bass', y: 502 }, - { x: '84 ', type: 'Keyboard', y: 246 }, - { x: '84 ', type: 'Amplifier', y: 500 }, - { x: '84 ', type: 'Rhythm_guitar', y: 650 }, - { x: '85 ', type: 'Lead_guitar', y: 852 }, - { x: '85 ', type: 'Drum', y: 610.2 }, - { x: '85 ', type: 'Electri_bass', y: 355 }, - { x: '85 ', type: 'Keyboard', y: 158 }, - { x: '85 ', type: 'Amplifier', y: 400 }, - { x: '85 ', type: 'Rhythm_guitar', y: 520 }, - { x: '86 ', type: 'Lead_guitar', y: 580 }, - { x: '86 ', type: 'Drum', y: 536.4 }, - { x: '86 ', type: 'Electri_bass', y: 303 }, - { x: '86 ', type: 'Keyboard', y: 213 }, - { x: '86 ', type: 'Amplifier', y: 400 }, - { x: '86 ', type: 'Rhythm_guitar', y: 520 }, - { x: '87 ', type: 'Lead_guitar', y: 751 }, - { x: '87 ', type: 'Drum', y: 571.5 }, - { x: '87 ', type: 'Electri_bass', y: 281 }, - { x: '87 ', type: 'Keyboard', y: 226 }, - { x: '87 ', type: 'Amplifier', y: 500 }, - { x: '87 ', type: 'Rhythm_guitar', y: 650 }, - { x: '88 ', type: 'Lead_guitar', y: 810 }, - { x: '88 ', type: 'Drum', y: 612.9 }, - { x: '88 ', type: 'Electri_bass', y: 344 }, - { x: '88 ', type: 'Keyboard', y: 216 }, - { x: '88 ', type: 'Amplifier', y: 500 }, - { x: '88 ', type: 'Rhythm_guitar', y: 650 }, - { x: '89 ', type: 'Lead_guitar', y: 869 }, - { x: '89 ', type: 'Drum', y: 632.7 }, - { x: '89 ', type: 'Electri_bass', y: 395 }, - { x: '89 ', type: 'Keyboard', y: 238 }, - { x: '89 ', type: 'Amplifier', y: 300 }, - { x: '89 ', type: 'Rhythm_guitar', y: 390 }, - { x: '90 ', type: 'Lead_guitar', y: 845 }, - { x: '90 ', type: 'Drum', y: 628.2 }, - { x: '90 ', type: 'Electri_bass', y: 374 }, - { x: '90 ', type: 'Keyboard', y: 178 }, - { x: '90 ', type: 'Amplifier', y: 300 }, - { x: '90 ', type: 'Rhythm_guitar', y: 390 }, - { x: '91 ', type: 'Lead_guitar', y: 896 }, - { x: '91 ', type: 'Drum', y: 643.5 }, - { x: '91 ', type: 'Electri_bass', y: 458 }, - { x: '91 ', type: 'Keyboard', y: 349 }, - { x: '91 ', type: 'Amplifier', y: 600 }, - { x: '91 ', type: 'Rhythm_guitar', y: 780 }, - { x: '92 ', type: 'Lead_guitar', y: 857 }, - { x: '92 ', type: 'Drum', y: 657 }, - { x: '92 ', type: 'Electri_bass', y: 436 }, - { x: '92 ', type: 'Keyboard', y: 306 }, - { x: '92 ', type: 'Amplifier', y: 600 }, - { x: '92 ', type: 'Rhythm_guitar', y: 780 }, - { x: '93 ', type: 'Lead_guitar', y: 859 }, - { x: '93 ', type: 'Drum', y: 678.6 }, - { x: '93 ', type: 'Electri_bass', y: 423 }, - { x: '93 ', type: 'Keyboard', y: 303 }, - { x: '93 ', type: 'Amplifier', y: 200 }, - { x: '93 ', type: 'Rhythm_guitar', y: 260 }, - { x: '94 ', type: 'Lead_guitar', y: 815 }, - { x: '94 ', type: 'Drum', y: 605.7 }, - { x: '94 ', type: 'Electri_bass', y: 404 }, - { x: '94 ', type: 'Keyboard', y: 322 }, - { x: '94 ', type: 'Amplifier', y: 200 }, - { x: '94 ', type: 'Rhythm_guitar', y: 260 }, - { x: '95 ', type: 'Lead_guitar', y: 873 }, - { x: '95 ', type: 'Drum', y: 586.8 }, - { x: '95 ', type: 'Electri_bass', y: 404 }, - { x: '95 ', type: 'Keyboard', y: 176 }, - { x: '95 ', type: 'Amplifier', y: 800 }, - { x: '95 ', type: 'Rhythm_guitar', y: 1040 }, - { x: '96', type: 'Lead_guitar', y: 848 }, - { x: '96', type: 'Drum', y: 662.4 }, - { x: '96', type: 'Electri_bass', y: 391 }, - { x: '96', type: 'Keyboard', y: 235 }, - { x: '96', type: 'Amplifier', y: 800 }, - { x: '96', type: 'Rhythm_guitar', y: 1040 }, -]; diff --git a/site/components/D2Chart/shapes/breath-point.ts b/site/components/D2Chart/shapes/breath-point.ts deleted file mode 100644 index d200f3af6..000000000 --- a/site/components/D2Chart/shapes/breath-point.ts +++ /dev/null @@ -1,81 +0,0 @@ -// @ts-ignore -const { G2 } = require('@antv/g2plot/dist/g2plot.min.js'); - -G2.registerShape('point', 'breath-point', { - draw(shapeInfo: any, container: any) { - const point = { x: shapeInfo.x, y: shapeInfo.y }; - const group = container.addGroup(); - const r = shapeInfo.style?.r || 0; - const r1 = r * 0.8; - const r2 = r1 * 0.9; - const opacity = shapeInfo.style?.fillOpacity || 0.5; - const fill = shapeInfo.fill || shapeInfo.color; - try { - const point1 = group.addShape('circle', { - attrs: { - x: point.x, - y: point.y, - r, - fill, - opacity, - }, - }); - point1.animate( - { - r: r * 1.2, - opacity: 0, - }, - { - duration: 4500, - easing: 'easeLinear', - repeat: true, - }, - ); - const point2 = group.addShape('circle', { - attrs: { - x: point.x, - y: point.y, - r: r1, - fill, - opacity, - }, - }); - point2.animate( - { - r: r1 * 1.2, - opacity: 0.1, - }, - { - duration: 4500, - easing: 'easeLinear', - repeat: true, - delay: 600, - }, - ); - const point3 = group.addShape('circle', { - attrs: { - x: point.x, - y: point.y, - r: r2, - fill, - opacity, - }, - }); - point3.animate( - { - r: r2 * 1.2, - opacity: 0.1, - }, - { - duration: 4500, - easing: 'easeLinear', - repeat: true, - delay: 1200, - }, - ); - } catch (e) { - console.error(e); - } - return group; - }, -}); diff --git a/site/components/D2Chart/shapes/waterdrop.ts b/site/components/D2Chart/shapes/waterdrop.ts deleted file mode 100644 index aa64193b7..000000000 --- a/site/components/D2Chart/shapes/waterdrop.ts +++ /dev/null @@ -1,69 +0,0 @@ -// @ts-ignore -const { G2 } = require('@antv/g2plot/dist/g2plot.min.js'); - -type Point = { x: number; y: number }; - -G2.registerShape('interval', 'waterdrop', { - draw(shapeInfo: any, container: any) { - const getDistance = (p1: Point, p2: Point) => { - const pow = (x: number) => x * x; - return Math.sqrt(pow(p1.x - p2.x) + pow(p1.y - p2.y)); - }; - const center = (this as any).coordinate.getCenter(); - const points = shapeInfo.points.map((p: Point) => - (this as any).parsePoint(p), - ); - const distance = getDistance(points[1], points[2]); - const strokeWidth = shapeInfo.style?.lineWidth; - const fillOpacity = shapeInfo.style?.fillOpacity || 0.75; - const inleft = points[0].x < points[1].x; - const inbottom = points[0].y < points[1].y; - let startColor = shapeInfo.color; - let endColor = '#fff'; - if (inleft) { - startColor = '#fff'; - endColor = shapeInfo.color; - } - - const offsetX = (strokeWidth / 2) * (inleft ? -1 : 1); - const offsetY = (strokeWidth / 2) * (inbottom ? 1 : -1); - const waterdrop = container.addShape({ - type: 'path', - attrs: { - path: [ - ['M', points[2].x + offsetX, points[2].y + offsetY], - ['L', center.x, center.y], - ['L', points[1].x + offsetX, points[1].y + offsetY], - [ - 'A', - distance / 2, - distance / 2, - 0, - 1, - 1, - points[2].x + offsetX, - points[2].y + offsetY, - ], - ['L', points[2].x + offsetX, points[2].y + offsetY], - ['Z'], - ], - fill: `l(0): 0:${startColor} 1:${endColor}`, - stroke: shapeInfo.style?.stroke, - lineWidth: strokeWidth, - fillOpacity, - }, - }); - waterdrop.animate( - { - strokeOpacity: 0.8, - fillOpacity: fillOpacity * 0.75, - }, - { - duration: 1500, - easing: 'easeLinear', - repeat: true, - }, - ); - return container; - }, -}); diff --git a/site/components/Demos/Demos.module.less b/site/components/Demos/Demos.module.less deleted file mode 100644 index 1cd114d6d..000000000 --- a/site/components/Demos/Demos.module.less +++ /dev/null @@ -1,95 +0,0 @@ -.demos { - width: calc(100vw-360px); - height: 100%; - display: flex; - .col { - display: block; - a { - cursor: pointer; - width: 100%; - position: relative; - display: block; - background-color: #fff; - - &::after { - content: ''; - display: block; - clear: both; - } - .cover { - width: 100%; - height: 100%; - display: block; - position: absolute; - top: 0px; - z-index: 2; - } - .img { - width: 100%; - height: 100%; - background-repeat: no-repeat; - background-position: center center; - } - .title { - background-color: rgba(132, 57, 238, 0.8); - color: #fff; - display: block; - position: absolute; - bottom: 0px; - z-index: 10; - width: 100%; - font-size: 14px; - overflow: hidden; - white-space: nowrap; - padding: 6px 8px; - height: 30px; - opacity: 0; - box-sizing: border-box; - text-overflow: ellipsis; - -o-text-overflow: ellipsis; - } - - &:hover { - .cover { - animation: slidOut 1.4s; - -webkit-animation: slidOut 1.4s; - animation-fill-mode: forwards; - } - .title { - animation: showUp 0.5s; - -webkit-animation: showUp 0.3s; - animation-fill-mode: forwards; - } - } - } - } -} - -@keyframes showUp { - 0% { - opacity: 0; - bottom: -30px; - } - 100% { - opacity: 1; - bottom: 0px; - } -} - -@keyframes slidOut { - 0% { - opacity: 1; - } - 100% { - opacity: 0; - } -} - -@keyframes zoomIn { - 0% { - opacity: 0; - } - 100% { - opacity: 1; - } -} diff --git a/site/components/Demos/Demos.tsx b/site/components/Demos/Demos.tsx deleted file mode 100644 index 3cc1a32af..000000000 --- a/site/components/Demos/Demos.tsx +++ /dev/null @@ -1,163 +0,0 @@ -import chroma from 'chroma-js'; -import classNames from 'classnames'; -import { assign, debounce } from 'lodash'; -import React, { useEffect, useState } from 'react'; - -import { getLang } from '../../utils'; -import styles from './Demos.module.less'; - -interface DemoProps { - imgurl: string; - title_zh: string; - title_en: string; - host?: string; - path?: string; - ratio: number; //图片比例 - width?: number; - height?: number; - location?: string; -} -interface DemosProps { - list?: DemoProps[]; - active: number; - type: string; // demo类型 -} - -export default (props: DemosProps) => { - // 根据实际效果调整最大最小列数 - const MAX_COLS = 5; - const MIN_COLS = 2; - let list = props.list || []; - const { active, type } = props; - const [imgs, updateImgs] = useState([]); - const [totalImgs, updateTotalImgs] = useState(0); - const lang = getLang(); - const getRandomNum = (min: number, max: number) => { - return Math.floor(Math.random() * (max - min + 1) + min); - }; - - const colorScale = chroma.scale(['E0C1FF', '5900C9']); - - const getCols = (totalNum: number, ratio: number) => { - let total = 0; - let maxCols = 0; - let randomCols = 0; - for (let i = 1; total <= totalNum; i++) { - total += i; - if (total <= totalNum) { - maxCols += 1; - } - } - - // 比例阀值看实际情况调整 - if (ratio === 1.3) { - randomCols = 3; // g2 g2plot只适合3列 - } else { - randomCols = getRandomNum(MIN_COLS, MAX_COLS); - } - - return randomCols > maxCols ? maxCols : randomCols; - }; - - const getSum = (num: number) => { - let res = 0; - for (let i = 0; i <= num; i += 1) { - res += i; - } - return res; - }; - - const getColWidh = (cols: number, index: number, width: number) => { - return width * ((cols - index) / getSum(cols)); - }; - - const getRowHeight = (rows: number, height: number) => { - return height / rows; - }; - - /* 布局规则: 排序靠前的列宽大 */ - const layout = () => { - if (!list || list.length <= 0 || !active) { - return; - } - let res: number[][] = []; - const maxWidth = document.body.clientWidth - 360; - const height = document.body.clientHeight - 396; - const maxHeight = height > 480 ? height : 480; - const ratio = list[0].ratio; - const cols = getCols(list.length, ratio); - const totalImgNum = getSum(cols); - updateTotalImgs(totalImgNum); - let index = getRandomNum(0, list.length - totalImgNum - 1); // list索引,随机截取 - let firtColNum = getRandomNum(1, 2); - for (let i = 0; i < cols; i += 1) { - let rows = i + 1; // 每列的图片个数 - let rowIndex = []; - for (let j = 0; j < rows; j += 1) { - assign(list[index], { width: getColWidh(cols, i, maxWidth) }); - assign(list[index], { height: getRowHeight(rows, maxHeight) }); - rowIndex.push(index); - index += 1; - } - res.push(rowIndex); - firtColNum += 1; - } - updateImgs([...res]); - }; - - useEffect(() => { - const debounceLayout = debounce(layout, 200); - window.addEventListener('resize', debounceLayout); - layout(); - return () => { - window.removeEventListener('resize', debounceLayout); - }; - }, [list, active]); - - return ( -
- {imgs.map((rows: number[], key: number) => ( -
- {rows.map((item: number, index: number) => ( - - {key + index !== 0 && ( - - ); -}; diff --git a/site/components/Describe/Describe.module.less b/site/components/Describe/Describe.module.less deleted file mode 100644 index b496b6a1b..000000000 --- a/site/components/Describe/Describe.module.less +++ /dev/null @@ -1,88 +0,0 @@ -.wrapper { - height: auto; - display: flex; - margin: auto; - position: relative; - flex-direction: column; - padding: 0; - - .content { - width: 91.94%; - height: 100%; - padding-left: 4.06%; - margin-bottom: 5%; - position: relative; - width: 1440px; - max-width: calc(100% - 120px); - margin-left: auto; - margin-right: auto; - .title { - font-size: 2.8em; - font-weight: 500; - margin: 144px 0 0 0; - position: relative; - height: min-content; - color: rgba(0, 0, 0, 1); - } - .slicer { - width: 32px; - height: 6px; - background: linear-gradient(45deg, #c65aff, #248dff); - margin-top: 36px; - } - .descriptionWrapper { - margin-top: 32px; - left: 0; - position: relative; - width: 70%; - margin-bottom: 70px; - .description { - color: rgba(49, 70, 89, 1); - opacity: 0.6; - font-size: 1.25em; - line-height: 2em; - } - } - .gridback { - position: absolute; - width: 150px; - right: 8.06%; - bottom: 70px; - } - } -} - -@media (max-width: 768px) { - .wrapper { - .content { - margin-left: 4.27%; - width: 91.46%; - padding-bottom: 150px; - max-width: 100%; - .title { - font-size: 2.14em; - margin: 102px 0 0 0; - } - .slicer { - width: 25px; - height: 6px; - margin: 60px 0 65px 0; - } - .descriptionWrapper { - width: 100%; - margin-top: 70px; - margin-bottom: 0px; - z-index: 10; - .description { - font-size: 1em; - } - } - .gridback { - width: 40%; - right: 4.27%; - bottom: 63px; - z-index: 1; - } - } - } -} diff --git a/site/components/Describe/Describe.tsx b/site/components/Describe/Describe.tsx deleted file mode 100644 index 857fc7b27..000000000 --- a/site/components/Describe/Describe.tsx +++ /dev/null @@ -1,38 +0,0 @@ -import { useIntl } from 'dumi'; -import React from 'react'; -import styles from './Describe.module.less'; - -const gridBackgroundImg = - 'https://gw.alipayobjects.com/zos/basement_prod/31366ec3-a932-4e29-9e84-44ae0d6e6815.svg'; - -const Describe = () => { - const intl = useIntl(); - - const useT = (transformedMessage: string) => { - return intl.formatMessage({ - id: transformedMessage, - }); - }; - let title = 'AntV 企业级可视化解决方案'; - let description = - 'AntV 3.0 已全新升级,主要包含 G2、G6、F2、L7 以及一套完整的图表使用和设计规范。得益于丰富的业务场景和用户需求挑战,AntV 经历多年积累与不断打磨,已支撑阿里集团内外 20000+ 业务系统,通过了日均千万级 UV 产品的严苛考验后方敢与君见。'; - return ( -
-
-

{useT(title)}

-
-
-

- {useT(description)} -

-
- gird-background -
-
- ); -}; -export default Describe; diff --git a/site/components/FamousPersons/index.module.less b/site/components/FamousPersons/index.module.less deleted file mode 100644 index 138faeaac..000000000 --- a/site/components/FamousPersons/index.module.less +++ /dev/null @@ -1,101 +0,0 @@ -.commonFlexConfig { - display: flex; - align-items: center; - justify-content: center; -} - -.famousPersons { - &:extend(.commonFlexConfig); - padding: 80px 0 120px; - flex-direction: column; - overflow: hidden; - - .famousAuctions { - &:extend(.commonFlexConfig); - margin-bottom: 28px; - padding: 8px 0; - font-family: PingFangSC; - - .famousAuction { - &:extend(.commonFlexConfig); - flex-direction: column; - justify-content: space-between; - height: calc((1680px - 100vw) / 10 + 370px); - max-height: 377px; - min-height: 350px; - width: calc((100vw - 380px - 84px) / 4); - min-width: 239px; - max-width: 399px; - padding: 29px 20px 20px; - position: relative; - margin: 0 14px; - letter-spacing: 0; - transition: all 0.2s; - background-color: #fff; - border: 1px solid #e5e8ef; - box-shadow: 0 8px 28px 0 rgba(0, 0, 0, 0.05); - border-radius: 16px; - - &:hover { - transform: translateY(-8px); - box-shadow: 0 8px 20px 0 rgba(0, 0, 0, 0.1); - } - - .image { - position: relative; - overflow: hidden; - - > img { - height: 60px; - width: 60px; - } - - .icon { - width: 14px; - height: 14px; - position: absolute; - top: -2px; - left: -80px; - } - } - - .name { - margin: 4px 0; - font-size: 20px; - color: #1d2129; - font-weight: 500; - font-family: PingFangSC; - } - - .text { - line-height: 28px; - height: 56px; - font-size: 14px; - color: #424e66; - overflow: hidden; - text-overflow: ellipsis; - -webkit-line-clamp: 2; - display: -webkit-box; - -webkit-box-orient: vertical; - } - - .hr { - width: 100%; - border-top: 1px solid #f5f5f5; - margin: 14px 0; - } - - .msg { - color: #86909c; - flex: 1; - overflow: hidden; - } - } - } - - &.en { - .famousAuction { - height: 377px; - } - } -} diff --git a/site/components/FamousPersons/index.tsx b/site/components/FamousPersons/index.tsx deleted file mode 100644 index 5f0c0d298..000000000 --- a/site/components/FamousPersons/index.tsx +++ /dev/null @@ -1,98 +0,0 @@ -import classNames from 'classnames'; -import { useIntl, useLocale } from 'dumi'; -import { debounce } from 'lodash'; -import React, { useEffect, useRef, useState } from 'react'; -import FAMOUS_PERSONS_DATAS from '../../data/famous-persons.json'; -import { OverflowedText, ModuleTitle as Title } from '../common'; - -import styles from './index.module.less'; - -// 专家之声 -export function FamousPersons() { - const locale = useLocale(); - - const language: 'zh' | 'en' = locale.id.includes('zh') ? 'zh' : 'en'; - - const intl = useIntl(); - const useT = (transformedMessage: string) => { - return intl.formatMessage({ - id: transformedMessage, - }); - }; - - const textRef = useRef(null); - const msgRef = useRef(null); - - const [textSize, setTextSize] = useState({ maxWidth: 237, maxHeight: 53 }); - const [msgSize, setMsgSize] = useState({ maxWidth: 237, maxHeight: 143 }); - - useEffect(() => { - const changeSize = debounce(() => { - if (textRef?.current) { - setTextSize({ - maxWidth: textRef?.current.clientWidth, - maxHeight: textRef?.current.clientHeight, - }); - } - if (msgRef?.current) { - setMsgSize({ - maxWidth: msgRef?.current.clientWidth, - maxHeight: msgRef?.current.clientHeight, - }); - } - }, 200); - - window.addEventListener('resize', changeSize); - - return () => { - window.removeEventListener('resize', changeSize); - }; - }, []); - - return ( -
- - <div className={styles.famousAuctions}> - {FAMOUS_PERSONS_DATAS.map((data) => { - const filter = `drop-shadow(${data.color} 80px 0)`; - return ( - <div className={styles.famousAuction}> - <div className={styles.image}> - <img src={data.image} alt="image" /> - <img - src="https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*XGF5T7Atc7kAAAAAAAAAAAAADmJ7AQ/original" - className={styles.icon} - style={{ filter }} - alt="icon" - /> - </div> - <div className={styles.name}>{useT(data.name)}</div> - <div className={styles.text} ref={textRef}> - <OverflowedText - text={useT(data.text)} - {...textSize} - style={{ fontSize: 14, lineHeight: 2 }} - /> - </div> - <div className={styles.hr} /> - <div className={styles.msg} ref={msgRef}> - <OverflowedText - text={useT(data.msg)} - {...msgSize} - style={{ fontSize: 14, lineHeight: 2 }} - /> - </div> - </div> - ); - })} - </div> - </div> - ); -} diff --git a/site/components/LinkCharts/index.module.less b/site/components/LinkCharts/index.module.less deleted file mode 100644 index 311b4fc4f..000000000 --- a/site/components/LinkCharts/index.module.less +++ /dev/null @@ -1,125 +0,0 @@ -.commonFlexConfig { - display: flex; - align-items: center; - justify-content: center; -} - -.linkCharts { - &:extend(.commonFlexConfig); - padding: 100px 0 80px 0; - flex-direction: column; - font-family: PingFangSC; - - .charts { - width: 100%; - margin-bottom: 28px; - padding: 8px 0; - overflow: hidden; - - .box { - transition: all 1s; - display: flex; - justify-content: center; - transform: translateX(-1227px); - - &.center { - transition: all 0s; - } - - &.left { - transform: translateX(0); - } - - &.right { - transform: translateX(-2454px); - } - - .chart { - &:extend(.commonFlexConfig); - flex-direction: column; - height: 361px; - padding: 0 20px; - background-color: #f7f8fd; - border-radius: 16px; - letter-spacing: 0; - position: relative; - margin: 0 14px; - transition: all 0.2s; - cursor: pointer; - - &:hover { - transform: translateY(-8px); - box-shadow: 0 8px 20px 0 rgba(0, 0, 0, 0.05); - } - - .title { - height: 32px; - font-size: 24px; - color: #1d2129; - line-height: 32px; - margin: 18px 0 8px 0; - font-family: AlibabaPuHuiTiB; - } - - .subTitle { - font-size: 14px; - color: #424e66; - line-height: 22px; - margin-bottom: 18px; - overflow: hidden; - text-overflow: ellipsis; - -webkit-line-clamp: 2; - display: -webkit-box; - -webkit-box-orient: vertical; - } - - .antv { - height: 20px; - padding: 0 6px; - line-height: 20px; - position: absolute; - font-size: 14px; - top: 0; - right: 0; - border-radius: 0 8px 0 8px; - color: #fff; - } - - .image { - height: 231px; - width: 341px; - background-color: #ffffff; - border-radius: 12px; - background-position: center; - background-repeat: no-repeat; - background-size: contain; - box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.05); - } - } - } - } - - .buttons { - &:extend(.commonFlexConfig); - - .left, - .right { - &:extend(.commonFlexConfig); - height: 44px; - width: 44px; - border-radius: 50%; - background-color: #f2f3f5; - margin: 0 8px; - color: #424e66; - cursor: pointer; - - &:hover { - background-color: #e5e8ef; - } - } - - > .left { - transform: rotate(180deg); - } - } -} diff --git a/site/components/LinkCharts/index.tsx b/site/components/LinkCharts/index.tsx deleted file mode 100644 index 4ef9ead6d..000000000 --- a/site/components/LinkCharts/index.tsx +++ /dev/null @@ -1,109 +0,0 @@ -import { useChinaMirrorHost } from '@antv/dumi-theme-antv/dist/slots/hooks'; -import classNames from 'classnames'; -import { useIntl, useLocale } from 'dumi'; -import React, { useCallback, useState } from 'react'; -import CHARTS_DATAS from '../../data/link-charts.json'; -import { transformUrl } from '../Products/getProducts'; -import { OverflowedText, ModuleTitle as Title } from '../common'; - -import styles from './index.module.less'; - -// 丰富图表,选用自如 -export function LinkCharts() { - const [position, setPosition] = useState('center'); - const [loading, setLoading] = useState(false); - const [data, setData] = useState(CHARTS_DATAS); - - const locale = useLocale(); - const [isChinaMirrorHost] = useChinaMirrorHost(); - - const intl = useIntl(); - const useT = (transformedMessage: string) => { - return intl.formatMessage({ - id: transformedMessage, - }); - }; - - const language: 'zh' | 'en' = locale.id.includes('zh') ? 'zh' : 'en'; - - // 滑动 - const onClick = useCallback( - (position) => { - if (loading) return; - setPosition(position); - setLoading(true); - const length = data.length; - setTimeout(() => { - setData((data) => { - return position === 'left' - ? [...data.slice(length - 3), ...data.slice(0, length - 3)] - : [...data.slice(3), ...data.slice(0, 3)]; - }); - setPosition('center'); - setLoading(false); - }, 1000); - }, - [loading], - ); - - return ( - <div className={styles.linkCharts}> - <Title - title={useT('丰富图表,选用自如')} - subTitle={useT( - '柱形图、饼图、关系图、地图、多维表格等260+丰富图表随心选用', - )} - /> - <div className={styles.charts}> - <div - className={classNames(styles.box, { - [styles.left]: position === 'left', - [styles.right]: position === 'right', - [styles.center]: position === 'center', - })} - style={{ width: data.length * 409 + 'px' }} - > - {data.map((data) => { - return ( - <a - className={styles.chart} - href={transformUrl({ - url: data.link, - language, - isChinaMirrorHost, - })} - target="_blank" - > - <div className={styles.title}>{useT(data.title)}</div> - <div className={styles.subTitle}> - <OverflowedText text={useT(data.subTitle)} maxWidth={341} /> - </div> - <div className={styles.antv} style={{ background: data.color }}> - {data.antv} - </div> - <div - className={styles.image} - style={{ backgroundImage: `url(${data.image})` }} - /> - </a> - ); - })} - </div> - </div> - <div className={styles.buttons}> - <div className={styles.left} onClick={() => onClick('left')}> - <img - alt="left_icon" - src="https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*Q4WbQ5DCXEAAAAAAAAAAAAAADmJ7AQ/original" - /> - </div> - <div className={styles.right} onClick={() => onClick('right')}> - <img - alt="right_icon" - src="https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*Q4WbQ5DCXEAAAAAAAAAAAAAADmJ7AQ/original" - /> - </div> - </div> - </div> - ); -} diff --git a/site/components/Products/Products.module.less b/site/components/Products/Products.module.less deleted file mode 100644 index 45f14e4ad..000000000 --- a/site/components/Products/Products.module.less +++ /dev/null @@ -1,459 +0,0 @@ -@import '~antd/es/style/themes/default.less'; - -.wrapper { - height: auto; - background: #f0f5fa; - display: flex; - margin: auto; - position: relative; - flex-direction: column; - padding: 0; - overflow: hidden; - .lefttop { - width: 100%; - height: 74.5%; - top: 0; - position: absolute; - display: flex; - flex-direction: row; - .ltblock1 { - width: 100%; - background: linear-gradient(130deg, #aa6aff, #706dff); - position: relative; - height: 100%; - } - } - .rightbottom { - position: absolute; - height: 900px; - background: #fff; - box-shadow: -5px 0px 15px rgba(0, 0, 0, 0.1); - width: 95.94%; - left: 4.06%; - top: 154px; - } - .slicerbarh { - width: 104.06%; - height: 1px; - position: absolute; - width: 95.94%; - left: 4.06%; - z-index: 2; - background-color: #f2f4f5; - } - .slicerbarh1 { - margin-top: 234px; - } - .slicerbarh2 { - margin-top: 426px; - } - .slicerbarh3 { - margin-top: 618px; - } - .slicerbarh4 { - margin-top: 810px; - } - .slicerbarh5 { - margin-top: 1002px; - } - .slicerbarh6 { - margin-top: 1780px; - display: none; - } - .slicerbarh7 { - margin-top: 2150px; - display: none; - } - .slicerbarh8 { - margin-top: 2520px; - display: none; - } - .slicerbarh9 { - margin-top: 2890px; - display: none; - } - .content { - height: 100%; - margin-bottom: 5%; - position: relative; - width: 1440px; - max-width: calc(100% - 120px); - margin-left: auto; - margin-right: auto; - .title { - padding-left: 4.06%; - position: relative; - font-size: 2.8em; - font-weight: 500; - margin: 48px 0 48px 0; - color: #fff; - } - .productsContainer { - width: 100%; - height: inherit; - position: relative; - padding-bottom: 80px; - .subTitleContainer { - display: block; - position: absolute; - padding-left: 4.06%; - display: flex; - margin-top: 30px; - .subTitleText { - color: rgba(106, 123, 140, 1); - font-weight: 300; - width: 200px; - font-size: 1.14em; - margin-left: 20px; - } - .subTitleBar { - background: linear-gradient( - 135deg, - rgb(157, 113, 247) 40%, - rgb(116, 113, 246) - ); - height: 18px; - width: 4px; - } - } - .extensionSubTitle { - margin-left: 45.86%; - } - .slicerbar { - position: absolute; - background-color: #f2f4f5; - } - .slicerbarv { - width: 1px; - height: 97%; - margin-left: 4.06%; - } - .slicerbarv2 { - margin-left: 49.9%; - // height: 100%; - } - .slicerbarv3 { - margin-left: 96%; - } - .products { - margin-left: 4.06%; - width: 91.88%; - padding-top: 77px; - display: flex; - .extensionsWrapper { - width: 50%; - } - .basicsWrapper { - width: 50%; - } - .col { - width: 100%; - height: 192px; - .product { - width: 100%; - height: 100%; - padding: 28px 4.64% 0 4.64%; - transition: all 0.3s; - &:hover { - box-shadow: 5px 20px 30px rgba(0, 0, 0, 0.1); - } - } - .imgHolder { - position: absolute; - } - .imgHolder1 { - left: 0; - top: 0; - width: 30%; - } - .imgHolder2 { - right: 0; - bottom: 0; - width: 45%; - } - } - .ptitle { - font-size: 1.714em; - color: #000; - font-weight: 440; - margin-bottom: 0; - } - .pdescription { - margin-top: 2%; - margin-bottom: 0; - opacity: 0.5; - font-size: 1.14em; - color: rgba(106, 123, 140, 1); - max-height: 30px; - } - .pbottom { - width: 91.84%; - display: flex; - position: absolute; - bottom: 28px; - .plinks { - width: -webkit-fill-available; - font-size: 1.14em; - position: absolute; - bottom: 0; - width: 100%; - .plink { - color: #597ef7; - } - .apilink { - margin-left: 6%; - } - } - .productimg { - width: 80px; - position: absolute; - right: 15px; - bottom: -22px; - } - } - } - } - } -} -.dot { - position: absolute; - width: 3px; - height: 3px; - border-radius: 50%; - background: #d8d8d8; - z-index: 3; -} -.mediumDot { - display: none; -} -.smallDot { - display: none; -} - -@media (max-width: 950px) { - .wrapper { - .rightbottom { - height: 1120px; - } - .slicerbarh2 { - transition: all 0.1s; - margin-top: 473px; - } - .slicerbarh3 { - transition: all 0.1s; - margin-top: 713px; - } - .slicerbarh4 { - transition: all 0.1s; - margin-top: 953px; - } - .slicerbarh5 { - transition: all 0.1s; - margin-top: 1193px; - } - .content { - .productsContainer { - .products { - .col { - transition: all 0.1s; - height: 240px; - .imgHolder1 { - left: 0; - top: 0; - width: 50%; - } - .imgHolder2 { - right: 0; - bottom: 0; - width: 60%; - } - } - } - - .slicerbarv { - height: 100%; - } - } - } - } - .largeDot { - display: none; - } - .mediumDot { - display: block; - } - .smallDot { - display: none; - } -} - -@media (max-width: 768px) { - .wrapper { - min-height: 0; - .lefttop { - height: 100%; - width: 100%; - .ltblock1 { - width: 100%; - } - } - .rightbottom { - top: 190px; - height: 2313px; - } - .slicerbarh { - margin-top: 270px; - height: 1px; - z-index: 2; - } - .slicerbarh2 { - margin-top: 480px; - } - .slicerbarh3 { - margin-top: 690px; - } - .slicerbarh4 { - margin-top: 900px; - } - .slicerbarh5 { - width: 100%; - margin-top: 1330px; - left: 4%; - } - .slicerbarh6 { - margin-top: 1114px; - display: block; - } - .slicerbarh7 { - margin-top: 1400px; - display: block; - } - .slicerbarh8 { - margin-top: 1610px; - display: block; - } - .slicerbarh9 { - margin-top: 1820px; - display: block; - } - .slicerbarh10 { - margin-top: 2032px; - display: block; - } - .slicerbarh11 { - margin-top: 2243px; - display: block; - } - .slicerbarh12 { - margin-top: 2453px; - display: block; - } - .content { - margin-left: 4.27%; - width: 95.73%; - margin-bottom: 85px; - max-width: 95.73%; - margin-right: 0; - .title { - font-size: 2.14rem; - margin: 80px 0 60px 0; - padding-left: 0; - } - .productsContainer { - padding-bottom: 50px; - .subTitleContainer { - position: absolute; - padding-left: 3%; - display: flex; - .subTitleBar { - background: linear-gradient( - 135deg, - rgb(157, 113, 247) 40%, - rgb(116, 113, 246) - ); - height: 18px; - width: 4px; - } - .subTitleText { - width: 200px; - font-size: 1em; - margin-left: 20px; - } - } - .basicSubTitle { - margin-top: 30px; - } - .extensionSubTitle { - margin-top: 1165px; - margin-left: 0; - } - .slicerbarv { - width: 1px; - margin-left: 3%; - } - .slicerbarv2 { - display: none; - } - .slicerbarv3 { - margin-left: 92.2%; - } - .products { - width: 88.86%; // 0.04 * 0.96 + 0.03 * 2 - margin-left: 3.34%; - padding-top: 80px; - flex-flow: column; - .subProducts { - width: 100%; - } - .extensionsWrapper { - margin-top: 80px; - width: 100%; - } - .basicsWrapper { - width: 100%; - } - .col { - width: 100%; - height: 210px; - .product { - padding: 7.5% 5.05% 5.05% 5.05%; - .ptitle { - margin-bottom: 0; - font-size: 1.29em; - font-weight: 450; - } - .pdescription { - margin-top: 8px; - margin-bottom: 0; - font-size: 1em; - } - .pbottom { - width: 92%; - .plinks { - font-size: 1em; - } - } - } - &:hover { - .product { - box-shadow: 0px 0px 0px rgba(0, 0, 0, 0); - } - } - } - .imgHolderWrapper { - display: none; - } - } - } - } - } - .largeDot { - display: none; - } - .mediumDot { - display: none; - } - .smallDot { - display: block; - } -} diff --git a/site/components/Products/Products.tsx b/site/components/Products/Products.tsx deleted file mode 100644 index e452b4e54..000000000 --- a/site/components/Products/Products.tsx +++ /dev/null @@ -1,341 +0,0 @@ -import { useChinaMirrorHost } from '@antv/dumi-theme-antv/dist/slots/hooks'; -import { Col, Row } from 'antd'; -import classNames from 'classnames'; -import { useIntl, useLocale } from 'dumi'; -import React from 'react'; -import { CATEGORIES, ProductType, getProducts } from './getProducts'; -import styles from './Products.module.less'; - -const Products = () => { - const locale = useLocale(); - const intl = useIntl(); - - const useT = (transformedMessage: string) => { - return intl.formatMessage({ - id: transformedMessage, - }); - }; - const [isChinaMirrorHost] = useChinaMirrorHost(); - const [products, setProducts] = React.useState<ProductType[]>([]); - - const lang: 'zh' | 'en' = locale.id.includes('zh') ? 'zh' : 'en'; - React.useEffect(() => { - getProducts({ language: lang, isChinaMirrorHost }).then((data) => { - setProducts(data.slice(0, 10)); - }); - }, [lang, isChinaMirrorHost]); - - const filterProducts = (type: string) => - products.filter((item) => item.category === type); - const getProductCols = (type: string) => { - const renderData = filterProducts(type); - const cols = []; - renderData.forEach((product: any) => { - cols.push( - <Col key={product.title} className={styles.col} span={24}> - <a href={product.links[Object.keys(product.links)[0]].url}> - <div className={styles.product} key="product"> - <p key="product-title" className={styles.ptitle}> - {`${product.title} ${product.slogan || ''}`} - </p> - <p key="product-description" className={styles.pdescription}> - {product.description} - </p> - <div key="product-bottom" className={styles.pbottom}> - <div className={styles.plinks}> - <object> - {product.links.home && ( - <a className={styles.plink} href={product.links.home.url}> - {product.links.home.title - ? product.links.home.title - : useT('产品首页')} - </a> - )} - </object> - <object> - {product.links.example && ( - <a - className={classNames(styles.plink, styles.apilink)} - href={product.links.example.url} - > - {product.links.example.title - ? product.links.example.title - : useT('图表示例')} - </a> - )} - </object> - </div> - <img - key="product" - className={styles.productimg} - src={product.icon} - alt={`${product.title}`} - /> - </div> - </div> - </a> - </Col>, - ); - }); - if ( - type === 'extension' && - filterProducts('extension').length < filterProducts('basic').length - ) { - cols.push( - <Col - key="imgholder" - className={classNames(styles.imgHolderWrapper, styles.col)} - span={24} - > - <img - src="https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*_trNQ5C2pHIAAAAAAAAAAABkARQnAQ" - alt="holderback1" - className={classNames(styles.imgHolder1, styles.imgHolder)} - /> - <img - src="https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*frvoQat_YsUAAAAAAAAAAABkARQnAQ" - alt="holderback2" - className={classNames(styles.imgHolder2, styles.imgHolder)} - /> - </Col>, - ); - } - return cols; - }; - - const getDots = () => { - let dots: Array<React.ReactNode> = []; - const length = products.length; - const cols = 3; - const rows = Math.ceil(length / 2) + 1; - const lefts = [0.0398, 0.4983, 0.9591]; - let startTop = 81; - const circleRadius = 1.5; - let cardHeight = 192; - for (let i = 0; i < rows; i++) { - for (let j = 0; j < cols; j++) { - const top = `${startTop + cardHeight * i - circleRadius}px`; - const left = `${lefts[j] * 100}%`; - dots.push( - <div - key={`dot-${i}-${j}`} - className={classNames(styles.dot, styles.largeDot)} - style={{ marginLeft: left, marginTop: top }} - />, - ); - } - } - - // for medium screen - cardHeight = 239.5; - const mlefts = [0.0398, 0.4978, 0.958]; - const mtops = [79, 318, 558, 798, 1038]; - for (let i = 0; i < rows; i++) { - for (let j = 0; j < cols; j++) { - const top = `${mtops[i]}px`; - const left = `${mlefts[j] * 100}%`; - dots.push( - <div - key={`dot-${i}-${j}-medium`} - className={classNames(styles.dot, styles.mediumDot)} - style={{ left: left, top: top }} - />, - ); - } - } - - // for small screen - const smallStartLeftPercent = 0.028; - const srows = length + 1; - let sStartTop = 79.5; - const sCardHeight = 210; - const sCircleRadius = 1.5; - const sLeftColLeft = `${smallStartLeftPercent * 100}%`; - const sRigthColLeft = `${(smallStartLeftPercent + 0.891) * 100}%`; - for (let i = 0; i < srows; i++) { - let top; - if (i === Math.ceil(srows / 2)) { - top = `${sStartTop + sCardHeight * i - sCircleRadius}px`; - dots.push( - <div - key={`${i}-0`} - className={classNames(styles.dot, styles.smallDot)} - style={{ marginLeft: sLeftColLeft, marginTop: top }} - />, - ); - dots.push( - <div - key={`${i}-1`} - className={classNames(styles.dot, styles.smallDot)} - style={{ marginLeft: sRigthColLeft, marginTop: top }} - />, - ); - sStartTop = sStartTop * 2 + 0.5; - } - top = `${sStartTop + sCardHeight * i - sCircleRadius}px`; - dots.push( - <div - key={`${i}-2`} - className={classNames(styles.dot, styles.smallDot)} - style={{ marginLeft: sLeftColLeft, marginTop: top }} - />, - ); - dots.push( - <div - key={`${i}-3`} - className={classNames(styles.dot, styles.smallDot)} - style={{ marginLeft: sRigthColLeft, marginTop: top }} - />, - ); - } - - return dots; - }; - - let titleStr = '我们的产品'; - let subTitleStr1 = '基础产品'; - let subTitleStr2 = '扩展产品'; - - return ( - <div id="products" className={styles.wrapper}> - <div className={styles.lefttop}> - <div className={styles.ltblock1} /> - </div> - <div className={styles.rightbottom} /> - <div - className={classNames( - styles.slicerbar, - styles.slicerbarh, - styles.slicerbarh1, - )} - /> - <div - className={classNames( - styles.slicerbar, - styles.slicerbarh, - styles.slicerbarh2, - )} - /> - <div - className={classNames( - styles.slicerbar, - styles.slicerbarh, - styles.slicerbarh3, - )} - /> - <div - className={classNames( - styles.slicerbar, - styles.slicerbarh, - styles.slicerbarh4, - )} - /> - <div - className={classNames( - styles.slicerbar, - styles.slicerbarh, - styles.slicerbarh5, - )} - /> - <div - className={classNames( - styles.slicerbar, - styles.slicerbarh, - styles.slicerbarh6, - )} - /> - <div - className={classNames( - styles.slicerbar, - styles.slicerbarh, - styles.slicerbarh7, - )} - /> - <div - className={classNames( - styles.slicerbar, - styles.slicerbarh, - styles.slicerbarh8, - )} - /> - <div - className={classNames( - styles.slicerbar, - styles.slicerbarh, - styles.slicerbarh9, - )} - /> - <div - className={classNames( - styles.slicerbar, - styles.slicerbarh, - styles.slicerbarh10, - )} - /> - <div - className={classNames( - styles.slicerbar, - styles.slicerbarh, - styles.slicerbarh11, - )} - /> - <div - className={classNames( - styles.slicerbar, - styles.slicerbarh, - styles.slicerbarh12, - )} - /> - <div className={styles.content}> - <p className={styles.title}>{useT(titleStr)}</p> - <div className={styles.productsContainer}> - <div - className={classNames( - styles.slicerbar, - styles.slicerbarv, - styles.slicerbarv1, - )} - /> - <div - className={classNames( - styles.slicerbar, - styles.slicerbarv, - styles.slicerbarv2, - )} - /> - <div - className={classNames( - styles.slicerbar, - styles.slicerbarv, - styles.slicerbarv3, - )} - /> - {getDots()} - {CATEGORIES.map(({ name }) => { - return ( - <div - className={classNames( - styles.subTitleContainer, - styles.basicSubTitle, - )} - > - <div className={styles.subTitleBar} /> - <div className={styles.subTitleText}>{useT(name)}</div> - </div> - ); - })} - <div className={styles.products}> - {CATEGORIES.map(({ type }) => { - return ( - <Row key="products-basic" className={styles.basics}> - {getProductCols(type)} - </Row> - ); - })} - </div> - </div> - </div> - </div> - ); -}; -export default Products; diff --git a/site/components/Products/getProducts.tsx b/site/components/Products/getProducts.tsx deleted file mode 100644 index 8345b017d..000000000 --- a/site/components/Products/getProducts.tsx +++ /dev/null @@ -1,91 +0,0 @@ -import { each } from 'lodash'; -import React from 'react'; -import { getActualUrl } from '../Banner/helper'; - -const tuple = <T extends string[]>(...args: T) => args; -const CATEGORY_TYPE = tuple('basic', 'extension', 'mobile', 'ecology'); - -export const CATEGORIES: Array<{ - type: (typeof CATEGORY_TYPE)[number]; - name: string; -}> = [ - { type: 'basic', name: '标准版基础产品' }, - { type: 'extension', name: '标准版扩展产品' }, - { type: 'mobile', name: '移动定制(F版)产品' }, - { type: 'ecology', name: '周边生态' }, -]; - -export interface ProductItem { - title: string; - icon?: React.ReactNode; - slogan?: string; - description: string; - category: (typeof CATEGORY_TYPE)[number]; - links?: Array<{ - icon?: React.ReactNode; - title: React.ReactNode; - url?: string; - openExternal?: boolean; - }>; -} - -export type ValuesOf<T extends any[]> = T[number]; - -export type ProductType = { - links: { - /** 产品首页 */ - readonly home?: { url: string; title?: string }; - /** 图表示例 */ - readonly example?: { url: string; title?: string }; - /** 使用文档 */ - readonly api?: { url: string; title?: string }; - }; - [k: string]: any; -}; - -export function getProducts({ - language, - isChinaMirrorHost, -}: { - language: 'zh' | 'en'; - isChinaMirrorHost: boolean; -}): Promise<ProductType[]> { - // 如需要修改产品信息,请到 https://yuyan.antfin-inc.com/datavprod/antv-site-datas/schemas/site-products-h5data/console 修改区块内容 - return fetch( - 'https://render.alipay.com/p/h5data/antv-site-datas_site-products-h5data.json', - ) - .then((res) => res.json()) - .then((products: ProductType[]) => { - return products - .filter((d) => d.lang === language) - .map((d) => { - const links = - typeof d.links === 'string' ? JSON.parse(d.links) : { ...d.links }; - const newLinks: any = {}; - - each(links, (value, k: string) => { - newLinks[k] = { - ...value, - url: value?.url && getActualUrl(value.url, isChinaMirrorHost), - }; - }); - return { ...d, links: newLinks }; - }); - }); -} - -// 转化跳转,更具当前 镜像、中英文 进行修改。 -export function transformUrl({ - url, - language, - isChinaMirrorHost, -}: { - url: string; - language: 'zh' | 'en'; - isChinaMirrorHost: boolean; -}) { - const languageUrl = url - .replace(/\/(zh|en)/, '') - .replace(/([http|https]\:\/\/).+?\//, (v) => `${v}${language}/`); - return getActualUrl(languageUrl, isChinaMirrorHost); -} diff --git a/site/components/ProjectCard/index.module.less b/site/components/ProjectCard/index.module.less deleted file mode 100644 index 130d47140..000000000 --- a/site/components/ProjectCard/index.module.less +++ /dev/null @@ -1,187 +0,0 @@ -.commonFlexConfig { - display: flex; - align-items: center; - justify-content: center; -} - -.projectCard { - &:extend(.commonFlexConfig); - padding: 80px 0 40px; - flex-direction: column; - height: 782px; - overflow: hidden; - font-family: PingFangSC; - - .cards { - height: 520px; - width: calc(100vw - 360px); - max-width: 1680px; - min-width: 1040px; - background-image: linear-gradient(114deg, #332f4f 0%, #28243f 100%); - box-shadow: 0 8px 28px 0 rgba(0, 0, 0, 0.2); - border-radius: 16px; - padding: 24px; - letter-spacing: 0; - - .box { - .card { - &:extend(.commonFlexConfig); - height: 70px; - border-radius: 8px; - margin-bottom: 16px; - color: #ffffff; - position: relative; - - .cardTitle { - height: 28px; - font-weight: 600; - font-size: 20px; - line-height: 28px; - margin: 0 8px; - } - - .cardSubTitle { - font-family: AlibabaPuHuiTiR; - height: 24px; - opacity: 0.65; - font-size: 16px; - line-height: 24px; - white-space: nowrap; - } - - &.AVA { - background-color: rgba(36, 134, 255, 0.15); - - &:hover { - background-color: rgba(36, 134, 255, 0.25); - } - } - - &.antd, - &.holophylyF { - background-color: rgba(0, 167, 167, 0.15); - - &:hover { - background-color: rgba(0, 167, 167, 0.25); - } - } - - &.chartEngine { - height: 92px; - flex: 1; - background-color: rgba(245, 140, 88, 0.15); - flex-direction: column; - margin-bottom: 12px; - - &:hover { - background-color: rgba(245, 140, 88, 0.25); - border-color: rgba(245, 140, 88); - } - - &.f7 { - box-sizing: border-box; - border: 1px dashed rgba(245, 140, 88, 0.5); - } - } - - &.sort { - height: 24px; - padding: 0; - cursor: default; - - .divider { - border-color: rgba(255, 255, 255, 0.2); - - :global(.ant-divider-inner-text) { - padding: 0; - } - } - - .cardTitle { - font-family: AlibabaPuHuiTiR; - margin: 0 6px; - font-size: 16px; - color: #ffffff; - opacity: 0.45; - font-size: 16px; - } - } - - &.antv { - background-color: rgba(213, 128, 255, 0.15); - - &:hover { - background-color: rgba(213, 128, 255, 0.25); - } - } - - &.g { - background-color: rgba(148, 112, 255, 0.15); - margin-bottom: 0; - - &:hover { - background-color: rgba(148, 112, 255, 0.25); - } - } - } - } - } -} - -.content { - font-family: PingFangSC; - padding: 0 8px; - - .msg { - display: flex; - align-items: center; - letter-spacing: 0; - - .msgTitle { - font-weight: 600; - font-size: 20px; - color: #1d2129; - margin-right: 6px; - } - - .msgSubTitle { - font-size: 14px; - color: #86909c; - } - } - - .msgChart { - height: 125px; - width: 274px; - border: 1px solid #d8d8d8; - background-color: #fff; - border-radius: 4px; - margin: 12px 0; - background-position: center; - background-repeat: no-repeat; - background-size: contain; - } - - .links { - &:extend(.commonFlexConfig); - justify-content: space-between; - width: 274px; - - > a { - &:extend(.commonFlexConfig); - font-size: 14px; - color: #1d2129; - - .link { - > img { - width: 16px; - height: 16px; - } - } - - &:hover { - color: #691eff; - } - } - } -} diff --git a/site/components/ProjectCard/index.tsx b/site/components/ProjectCard/index.tsx deleted file mode 100644 index 3d777820b..000000000 --- a/site/components/ProjectCard/index.tsx +++ /dev/null @@ -1,311 +0,0 @@ -import { useChinaMirrorHost } from '@antv/dumi-theme-antv/dist/slots/hooks'; -import { Col, ConfigProvider, Divider, Popover, Row } from 'antd'; -import classNames from 'classnames'; -import { useIntl, useLocale } from 'dumi'; -import React, { useCallback, useState } from 'react'; -import ANTV_LINKS from '../../data/project-card-popover.json'; -import { ActiveIcon, ModuleTitle as Title } from '../common'; -import { - ProductType, - getProducts, - transformUrl, -} from '../Products/getProducts'; - -import styles from './index.module.less'; - -// 锚点, 用于 banner 中的 开始使用跳转 -export const ANCHORNAME = 'linkChartsAnchorName'; - -type PrejectData = { - // 标题 - title: string; - // 二级表图 - subTitle?: string; - // 占宽 - span: number; - // 类名 - classNames: any; - // 是否为分类 - isSort?: boolean; - // 弹出框 展开图 - img?: string; - // 大图标 - icon?: string; - // 跳转链接 - url?: string; - hash?: { - // 弹出框 图表示例跳转链接 - examples: string; - // 弹出框 使用文档 跳转到 api - manual: string; - }; -}[][]; - -// 不放入 data 变为 json 是因为 占比需要 styles 进行修改。 -const PROJECT_DATAS: PrejectData = [ - [ - { - title: 'AVA', - subTitle: '智能洞察', - span: 24, - classNames: styles.AVA, - icon: 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*L58VTIXV8MwAAAAAAAAAAAAADmJ7AQ/original', - img: 'https://gw.alipayobjects.com/mdn/rms_fabca5/afts/img/A*TOjFQ6PQwyEAAAAAAAAAAAAAARQnAQ', - url: 'https://ava.antv.antgroup.com', - }, - ], - [ - { - title: 'Ant Design Charts', - subTitle: '图表库', - span: 15, - classNames: styles.antd, - icon: 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*OWM6RLft2VIAAAAAAAAAAAAADmJ7AQ/original', - url: 'https://ant-design-charts-next.antgroup.com', - img: 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*IJE_TYeUtEUAAAAAAAAAAAAADmJ7AQ/original', - }, - { - title: '267 全系 F 版', - span: 9, - classNames: styles.holophylyF, - icon: 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*S8gOQJHfS8QAAAAAAAAAAAAADmJ7AQ/original', - }, - ], - [ - { - title: 'G2', - subTitle: '统计图表', - span: 3, - classNames: styles.chartEngine, - url: 'https://g2.antv.antgroup.com', - img: 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*oj5gRqZMxZQAAAAAAAAAAAAADmJ7AQ/original', - }, - { - title: 'S2', - subTitle: '多维表格', - span: 3, - classNames: styles.chartEngine, - url: 'https://s2.antv.antgroup.com', - img: 'https://gw.alipayobjects.com/zos/antfincdn/YxskohI92J/c17971dd-6dd9-4a62-85f8-c69dff908aec.png', - }, - { - title: 'G6', - subTitle: '关系图', - span: 3, - classNames: styles.chartEngine, - url: 'https://g6.antv.antgroup.com', - img: 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*_JGLQZl-PcQAAAAAAAAAAAAADmJ7AQ/original', - }, - { - title: 'X6', - subTitle: '流程图', - span: 3, - classNames: styles.chartEngine, - url: 'https://x6.antv.antgroup.com', - img: 'https://gw.alipayobjects.com/mdn/rms_43231b/afts/img/A*JSr-RbwCgmcAAAAAAAAAAAAAARQnAQ', - }, - { - title: 'L7', - subTitle: '地图', - span: 3, - classNames: styles.chartEngine, - url: 'https://L7.antv.antgroup.com', - img: 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*H0KDRaIpfIUAAAAAAAAAAAAADmJ7AQ/original', - }, - { - title: 'F2', - subTitle: '移动统计图', - span: 3, - classNames: styles.chartEngine, - url: 'https://f2.antv.antgroup.com', - img: 'https://mdn.alipayobjects.com/huamei_khb4xj/afts/img/A*q7bQT4mlz7kAAAAAAAAAAAAADq2NAQ/original', - }, - { - title: 'F6', - subTitle: '移动关系图', - span: 3, - classNames: styles.chartEngine, - url: 'https://f6.antv.vision', - img: 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*q3muQq70-dUAAAAAAAAAAAAADmJ7AQ/original', - }, - { - title: 'F7', - subTitle: '移动地图', - span: 3, - classNames: classNames(styles.chartEngine, styles.f7), - }, - ], - [ - { title: '常用统计数据', span: 6, classNames: styles.sort, isSort: true }, - { title: '关系数据', span: 6, classNames: styles.sort, isSort: true }, - { title: '地理空间数据', span: 3, classNames: styles.sort, isSort: true }, - { title: '极致移动定制', span: 9, classNames: styles.sort, isSort: true }, - ], - [ - { - title: 'AntV Design', - subTitle: '设计语言', - url: '/specification/principles/basic', - span: 24, - classNames: styles.antv, - icon: 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*U3AfQq_cQMYAAAAAAAAAAAAADmJ7AQ/original', - }, - ], - [ - { - title: 'G', - subTitle: '图表引擎', - span: 24, - classNames: styles.g, - img: 'https://gw.alipayobjects.com/mdn/rms_6ae20b/afts/img/A*nk1YSrbkQPMAAAAAAAAAAAAAARQnAQ', - icon: 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*YIbER7wNuLMAAAAAAAAAAAAADmJ7AQ/original', - url: 'https://g.antv.antgroup.com', - }, - ], -]; - -// 设计语言与研发框架 -export function ProjectCard() { - const locale = useLocale(); - const [isChinaMirrorHost] = useChinaMirrorHost(); - const [products, setProducts] = useState<ProductType[]>([]); - - const language: 'zh' | 'en' = locale.id.includes('zh') ? 'zh' : 'en'; - - const intl = useIntl(); - const useT = (transformedMessage: string) => { - return intl.formatMessage({ - id: transformedMessage, - }); - }; - - // 旧的跳转 json 获取 - React.useEffect(() => { - getProducts({ language, isChinaMirrorHost }).then((data) => { - setProducts(data.slice(0, 14)); - }); - }, [language, isChinaMirrorHost]); - - // 弹出框内容 - const getContent = useCallback(({ title, subTitle, img, links, url }) => { - return ( - <div className={styles.content}> - <div className={styles.msg}> - <div className={styles.msgTitle}>{title}</div> - <div className={styles.msgSubTitle}>{subTitle}</div> - </div> - <div - className={styles.msgChart} - style={{ backgroundImage: `url(${img})` }} - /> - <div className={styles.links}> - {ANTV_LINKS.map((link) => { - let href = links[link.href]?.url.replace( - /https:\/\/.+?\//, - `${url}/`, - ); - - // Ant Design Charts 本身跳转 https://charts.ant.design/example 为 404, 修改为 https://ant-design-charts.antgroup.com/examples - if (title === 'Ant Design Charts') { - href = - link.href === 'home' - ? url - : `${url}/${language}/${ - { - example: 'examples', - api: 'options/plots/overview', - }[link.href] - }`; - } - if (title === 'F6' && link.href === 'api') { - href = href + '/Graph'; - } - - return ( - <a href={href} target="_blank"> - <ActiveIcon - className={styles.link} - img={link.img} - text={useT(link.text)} - activeImg={link.activeImg} - /> - </a> - ); - })} - </div> - </div> - ); - }, []); - - return ( - <div className={styles.projectCard} id={ANCHORNAME}> - <Title - title={useT('设计语言与研发框架')} - subTitle={useT('资产一览,让你快速搭建网站应用')} - /> - <div className={styles.cards}> - <div className={styles.box}> - {PROJECT_DATAS.map((cols) => ( - <Row gutter={16}> - {cols.map((col) => { - const { span, img, title, subTitle, isSort, icon, url } = col; - - const product = products.find( - (product) => product.title === title, - ); - - const links = product?.links; - const newTitle = useT(title); - const newSubTitle = subTitle && useT(subTitle); - const children = ( - <a - className={classNames(col.classNames, styles.card)} - href={ - url && transformUrl({ url, language, isChinaMirrorHost }) - } - style={{ cursor: url ? 'pointer' : 'default' }} - target="_blank" - > - {icon && <img src={icon} alt={newTitle} />} - {isSort ? ( - <Divider dashed={true} className={styles.divider}> - <div className={styles.cardTitle}>{newTitle}</div> - </Divider> - ) : ( - <div className={styles.cardTitle}>{newTitle}</div> - )} - {subTitle && ( - <div className={styles.cardSubTitle}>{newSubTitle}</div> - )} - </a> - ); - - return ( - <Col key={title} span={span}> - {links ? ( - <ConfigProvider prefixCls="antd5"> - <Popover - content={getContent({ - url, - img, - links, - title: newTitle, - subTitle: newSubTitle, - })} - > - {children} - </Popover> - </ConfigProvider> - ) : ( - children - )} - </Col> - ); - })} - </Row> - ))} - </div> - </div> - </div> - ); -} diff --git a/site/components/Quotes/Quotes.module.less b/site/components/Quotes/Quotes.module.less deleted file mode 100644 index 9f62d73b5..000000000 --- a/site/components/Quotes/Quotes.module.less +++ /dev/null @@ -1,129 +0,0 @@ -.wrapper { - display: flex; - margin: auto; - position: relative; - flex-direction: column; - padding: 0; - height: auto; - background: #f8fafe; - overflow: hidden; - .subWrapper { - width: 1440px; - max-width: calc(100% - 120px); - margin-left: auto; - margin-right: auto; - } - .quotesWrapper { - position: relative; - z-index: 10; - } - .rows { - width: fit-content; - position: relative; - margin-top: 10.8%; - margin-bottom: 120px; - margin-left: 4.05%; - width: 91.89%; - .cardWrapper { - height: 600px; - transition: all 0.3s; - } - } - .triangleback { - position: absolute; - width: 50%; - max-width: 638px; - top: -80px; - right: -150px; - z-index: 1; - } - .rectback { - position: absolute; - width: 30%; - max-width: 620px; - left: 0; - bottom: -150px; - z-index: 1; - } - .circleback1 { - position: absolute; - width: 80%; - left: -100px; - top: -130px; - z-index: 1; - display: none; - } - .circleback2 { - position: absolute; - top: 60%; - width: 80%; - left: -30%; - z-index: 1; - display: none; - } -} - -@media (max-width: 1350px) { - .wrapper { - .rows { - .cardWrapper { - height: 610px; - } - } - } -} - -@media (max-width: 1200px) { - .wrapper { - .rows { - .cardWrapper { - height: 690px; - } - } - } -} - -@media (max-width: 1014px) { - .wrapper { - .subWrapper { - width: 100%; - max-width: 100%; - margin-left: 0; - margin-right: 0; - } - .rows { - box-shadow: -0px 0px 0px rgba(0, 0, 0, 0.1); - margin-top: 150px; - margin-left: 4.27%; - width: 91.46%; - margin-bottom: 0px; - .cardWrapper { - height: auto; - margin-bottom: 135px; - width: 100%; - box-shadow: -5px 5px 15px rgba(0, 0, 0, 0.1); - background-color: #fff; - } - } - .triangleback { - position: absolute; - width: 65%; - top: 90%; - right: -20%; - z-index: 1; - } - .rectback { - position: absolute; - width: 50%; - left: 0%; - top: 31%; - z-index: 1; - } - .circleback1 { - display: block; - } - .circleback2 { - display: block; - } - } -} diff --git a/site/components/Quotes/Quotes.tsx b/site/components/Quotes/Quotes.tsx deleted file mode 100644 index eea415690..000000000 --- a/site/components/Quotes/Quotes.tsx +++ /dev/null @@ -1,112 +0,0 @@ -import { Col, Row } from 'antd'; -import React from 'react'; -import QuoteCard from '../quoteCard/quoteCard'; -import styles from './Quotes.module.less'; - -const triangleBackImg = - 'https://gw.alipayobjects.com/zos/basement_prod/19b3ca21-8814-4f6c-ac1f-48de7fef9c1e.svg'; -const rectBackImg = - 'https://gw.alipayobjects.com/zos/basement_prod/fcb07699-6159-4f9a-b473-73ad0e049203.svg'; -const circleBackImg = - 'https://gw.alipayobjects.com/zos/basement_prod/5615f534-8d29-40bb-91c8-ac6ff18d075e.svg'; -const circleBack2Img = - 'https://gw.alipayobjects.com/zos/basement_prod/5615f534-8d29-40bb-91c8-ac6ff18d075e.svg'; - -const Quotes = () => { - const quotes = [ - { - index: 0, - avatar: - 'https://gw.alipayobjects.com/zos/rmsportal/fSPDqijMJrYFdODpgEBV.png', - name: 'Leland Wilkinson', - from: '伊利诺伊大学计算机科学客座教授,H2O.ai 首席科学家,G2 项目顾问', - quote: - 'I am thrill with G2. It is amazingly faithful to the GG system and has the potential to generate more graphics.', - - nameEn: 'Leland Wilkinson', - fromEn: - 'Visiting professor of Computer Science College, University of Illinois. Chief Scientist of H2O.ai. Project Consultant of G2', - quoteEn: - 'I am thrill with G2. It is amazingly faithful to the GG system and has the potential to generate more graphics.', - }, - { - index: 1, - avatar: 'https://os.alipayobjects.com/rmsportal/CcFeLxXurbQmwrT.jpg', - name: '陈为', - from: '浙江大学计算机学院 CAD & CG 国家重点实验室教授', - quote: - '在多年可视化设计与开发的积累基础上,蚂蚁金服团队推出了 AntV 产品,这是工业界在基础可视化语法与实践方面发出的最强声音,也是工业界与学术界一道推进可视化研发进展的最佳利器。', - - nameEn: 'Wei Chen', - fromEn: 'Professor of State Key Lab of CAD & CG, Zhejiang University', - quoteEn: - 'Based on years of visualization design and development, Ant Financial launched AntV. ' + - 'It is the strongest voice on basic visualization syntax and practice in industry, ' + - 'and it is also the best tool for advancing the visualization development collaboration between industry and academia.', - }, - { - index: 2, - avatar: - 'https://zos.alipayobjects.com/rmsportal/wtkIALmYDSmOIiAalkdv.jpg', - name: '林峰', - from: '爱烹饪的可视化攻城狮', - quote: - 'G2 是面粉,Echarts 是面条,皆微小而美好,因小食材怀大梦想,助力共筹东方巨龙崛起之盛宴,迎四海饕客。', - nameEn: 'Feng Lin', - fromEn: 'Visualization Developer Who Loves Cooking', - quoteEn: - 'G2 is the flour, Echarts is the noodle. They are both tiny but beautiful. ' + - 'Tiny ingredients have big dreams, helping to co-sponser the feast of the rise of the Eastern Dragon, ' + - 'and welcoming the guests from all over the world.', - }, - ]; - - const getCards = () => { - const length = quotes.length; - const children = quotes.map((quote, i) => { - let hasBorder = true; - if (i === 0 || i === length - 1) { - hasBorder = false; - } - return ( - <Col className={styles.cardWrapper} key={i} md={8} xs={24}> - <QuoteCard key={i} cardContent={quote} hasBorder={hasBorder} /> - </Col> - ); - }); - return children; - }; - return ( - <div className={styles.wrapper}> - <div className={styles.subWrapper}> - <div key="quotes" className={styles.quotesWrapper}> - <Row className={styles.rows} key="cards"> - {getCards()} - </Row> - </div> - <img - src={triangleBackImg} - className={styles.triangleback} - alt="triangle-background" - /> - <img - src={rectBackImg} - className={styles.rectback} - alt="rect-background" - /> - <img - src={circleBackImg} - className={styles.circleback1} - alt="circle-background" - /> - <img - src={circleBack2Img} - className={styles.circleback2} - alt="circle-background" - /> - </div> - </div> - ); -}; - -export default Quotes; diff --git a/site/components/ResourceCard/ResourceCard.module.less b/site/components/ResourceCard/ResourceCard.module.less deleted file mode 100644 index 2a7192cc5..000000000 --- a/site/components/ResourceCard/ResourceCard.module.less +++ /dev/null @@ -1,89 +0,0 @@ -.card { - background-color: #fff; - margin-top: 0px; - height: 400px; - transition: all 0.3s; - &:hover { - margin-top: -25px; - height: 450px; - border-bottom: 4px solid; - border-image: linear-gradient(to right, #aa6aff, #706dff) 30 30; - border-color: #aa6aff; - .detail { - display: block; - } - } - .detail { - margin-top: 14.2%; - color: rgb(71, 118, 232); - display: none; - font-size: 1.14em; - } - .content { - padding: 69px 10% 96px 10%; - .icon { - transition: all 0.3s; - height: 96px; - } - .title { - font-size: 1.71em; - color: #000; - margin-top: 40px; - margin-bottom: 0; - } - .description { - margin-top: 16px; - opacity: 0.6; - width: 100%; - font-size: 1em; - font-weight: 350; - line-height: 1.7em; - color: rgba(105, 123, 140, 1); - } - } -} - -@media (max-width: 1000px) { - .card { - .content { - .icon { - height: 70px; - } - } - } -} - -@media (max-width: 768px) { - .card { - margin-left: 0; - margin-right: 0; - &:hover { - margin-top: 0px; - height: auto; - border: 0px solid; - } - &:not(:hover) { - height: auto; - } - .content { - padding: 80px 32px 60px 32px; - .icon { - width: 80px; - } - .title { - font-size: 1.286em; - margin-top: 66px; - font-weight: 500; - } - .description { - font-size: 1em; - margin-top: 8px; - } - .detail { - font-size: 1em; - margin-top: 28px; - display: block; - } - } - } -} diff --git a/site/components/ResourceCard/ResourceCard.tsx b/site/components/ResourceCard/ResourceCard.tsx deleted file mode 100644 index d8fd366a7..000000000 --- a/site/components/ResourceCard/ResourceCard.tsx +++ /dev/null @@ -1,47 +0,0 @@ -import classNames from 'classnames'; -import { useIntl } from 'dumi'; -import React from 'react'; -import styles from './ResourceCard.module.less'; - -interface Props { - cardContent: { - icon: string; - title: string; - description: string; - index: number; - link: string; - }; -} - -const ResourceCard = (props: Props) => { - const intl = useIntl(); - - const useT = (transformedMessage: string) => { - return intl.formatMessage({ - id: transformedMessage, - }); - }; - let detailLinkStr = '查看详情'; - return ( - <div className={styles.card}> - <div className={styles.content}> - <img - className={styles.icon} - src={props.cardContent.icon} - alt="resource" - /> - <p className={styles.title}>{props.cardContent.title}</p> - <p className={styles.description}>{props.cardContent.description}</p> - <a - className={classNames(styles.detail, 'detail')} - href={props.cardContent.link} - target="newtab" - > - {useT(detailLinkStr)} - </a> - </div> - </div> - ); -}; - -export default ResourceCard; diff --git a/site/components/Resources/Resources.module.less b/site/components/Resources/Resources.module.less deleted file mode 100644 index 18ea02140..000000000 --- a/site/components/Resources/Resources.module.less +++ /dev/null @@ -1,107 +0,0 @@ -@import '~antd/lib/style/themes/default.less'; -.wrapper { - background: rgb(250, 251, 253); - height: calc(9.375% + 450px); - display: flex; - margin: auto; - position: relative; - flex-direction: column; - padding: 0; - overflow: hidden; - .content { - width: 91.95%; - height: 100%; - padding-bottom: 9.375%; - position: relative; - width: 1440px; - max-width: calc(100% - 120px); - margin-left: auto; - margin-right: auto; - .title { - font-size: 2.714em; - font-weight: 500; - margin: 100px 0 0 0; - position: relative; - height: min-content; - color: #000; - z-index: 10; - margin-left: 4.06%; - } - .slicer { - width: 32px; - height: 6px; - margin-top: 36px; - background-color: #597ef7; - margin-left: 4.06%; - } - .rowsWrapper { - position: relative; - margin-top: 57px; - height: 400px; - z-index: 10; - margin-left: 4.06%; - width: 91.88%; - .rows { - position: absolute; - width: 100%; - text-align: center; - display: flex; - .cardWrapper { - height: fit-content; - > div { - box-shadow: 0px 8px 10px rgba(49, 70, 89, 0.05); - } - } - } - } - .circleback { - position: absolute; - width: 40%; - top: -100px; - right: -15%; - z-index: 1; - } - .diamandback { - position: absolute; - width: 30%; - left: -10%; - bottom: -8%; - z-index: 1; - } - } -} - -@media (max-width: 768px) { - .wrapper { - .content { - padding-left: 4.27%; - padding-bottom: 23.47%; - width: 95.73%; - max-width: 95.73%; - margin-left: 0; - margin-right: 0; - .title { - font-size: 2.143rem; - margin: 80px 0 44px 0; - } - .slicer { - display: none; - } - .rowsWrapper { - margin-left: 0; - width: 100%; - height: auto; - .rows { - position: relative; - flex-direction: column; - .cardWrapper { - width: 100%; - margin-bottom: 20px; - margin-right: 0px; - margin-left: 0px; - } - } - } - } - } -} diff --git a/site/components/Resources/Resources.tsx b/site/components/Resources/Resources.tsx deleted file mode 100644 index a913e6545..000000000 --- a/site/components/Resources/Resources.tsx +++ /dev/null @@ -1,85 +0,0 @@ -import { Col, Row } from 'antd'; -import { useIntl } from 'dumi'; -import React from 'react'; -import { getLang } from '../../utils'; -import ResourceCard from '../ResourceCard/ResourceCard'; -import styles from './Resources.module.less'; - -const circleBackImg = - 'https://gw.alipayobjects.com/zos/basement_prod/e63aad85-573e-484b-94dd-dc8ea2334c09.svg'; -const diamandBackImg = - 'https://gw.alipayobjects.com/zos/basement_prod/bd846fce-bf9b-47f0-abba-87bb9bbd2982.svg'; - -const ResourcesPage = () => { - const lang = getLang(); - const intl = useIntl(); - - const useT = (transformedMessage: string) => { - return intl.formatMessage({ - id: transformedMessage, - }); - }; - const cards = [ - { - index: 0, - icon: 'https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*icqYSbEiNxIAAAAAAAAAAABkARQnAQ', - title: useT('图表用法'), - description: useT( - '从数据出发,从功能角度对常见图表进行分类,提供规范使用指引。', - ), - link: 'https://antv-2018.alipay.com/zh-cn/vis/chart/index.html', - }, - { - index: 1, - icon: 'https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*mt47RKxGy8kAAAAAAAAAAABkARQnAQ', - title: useT('设计价值观'), - description: useT( - '对数据图形进行拆解、提炼,抽象出一套数据图形可视化交互视觉规范。', - ), - link: `/${lang}/docs/specification/principles/basic`, - }, - { - index: 2, - icon: 'https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*zBDKTaSg-7AAAAAAAAAAAABkARQnAQ', - title: useT('工具资源'), - description: useT( - '在进行模式、组件和语言的整理过程中发现的优秀书籍和资源。', - ), - link: `/${lang}/docs/specification/resources`, - }, - ]; - - const cardCols = cards.map((card, i) => ( - <Col className={styles.cardWrapper} key={i} md={8} xs={24}> - <ResourceCard key={i} cardContent={card} /> - </Col> - )); - - let titleStr = '工具和资源'; - return ( - <div className={styles.wrapper}> - <div className={styles.content}> - <p key="title" className={styles.title}> - {useT(titleStr)} - </p> - <div key="slicer" className={styles.slicer} /> - <div key="cards" className={styles.rowsWrapper}> - <Row key="rows" className={styles.rows} gutter={12}> - {cardCols} - </Row> - </div> - <img - src={circleBackImg} - className={styles.circleback} - alt="circle-background" - /> - <img - src={diamandBackImg} - className={styles.diamandback} - alt="diamand-background" - /> - </div> - </div> - ); -}; -export default ResourcesPage; diff --git a/site/components/ThemeCharts/Charts/Column/index.tsx b/site/components/ThemeCharts/Charts/Column/index.tsx deleted file mode 100644 index 1f1244423..000000000 --- a/site/components/ThemeCharts/Charts/Column/index.tsx +++ /dev/null @@ -1,200 +0,0 @@ -import { Column } from '@antv/g2plot'; -import React, { useEffect, useMemo, useRef } from 'react'; - -import styles from '../index.module.less'; - -export const DARK_THEME_CONFIG = { - legend: { - itemName: { - style: { - fill: '#fff', - }, - }, - radio: false, - }, - yAxis: { - tickCount: 4, - grid: { - line: { - style: { - lineDash: [3, 4], - stroke: '#fff', - strokeOpacity: 0.2, - }, - }, - }, - label: { - style: { - fill: '#fff', - fillOpacity: 0.45, - }, - }, - }, - xAxis: { - line: { - style: { - stroke: '#A8B7C1', - }, - }, - label: { - style: { - fill: '#fff', - fillOpacity: 0.45, - }, - }, - }, -} as any; - -export const LIGHT_THEME_CONFIG = { - legend: { - itemName: { - style: { - fill: '#424E66', - }, - }, - radio: false, - }, - yAxis: { - tickCount: 4, - grid: { - line: { - style: { - lineDash: [3, 4], - stroke: '#86909C', - strokeOpacity: 0.2, - }, - }, - }, - label: { - style: { - fill: '#86909C', - fillOpacity: 0.45, - }, - }, - }, - xAxis: { - line: { - style: { - stroke: '#A4AEBA', - }, - }, - label: { - style: { - fill: '#86909C', - fillOpacity: 0.45, - }, - }, - }, -} as any; - -type ColumnProps = { - theme?: any; -}; - -const DATA = [ - { - x: '10-13', - y: 590, - type: 'PD', - }, - { - x: '10-13', - y: 500, - type: 'FE', - }, - { - x: '10-13', - y: 300, - type: 'UX', - }, - { - x: '10-14', - y: 220, - type: 'PD', - }, - { - x: '10-14', - y: 400, - type: 'FE', - }, - { - x: '10-14', - y: 580, - type: 'UX', - }, - { - x: '10-15', - y: 344, - type: 'PD', - }, - { - x: '10-15', - y: 133, - type: 'FE', - }, - { - x: '10-15', - y: 222, - type: 'UX', - }, - { - x: '10-16', - y: 455, - type: 'PD', - }, - { - x: '10-16', - y: 600, - type: 'FE', - }, - { - x: '10-16', - y: 120, - type: 'UX', - }, -]; - -// 柱状图 -export function ColumnChart(props: ColumnProps) { - const { theme = {} } = props; - const { value, categorical } = theme; - const colors10 = categorical.colors; - const isDark = useMemo(() => value === 'dark', [value]); - - const containerRef = useRef<HTMLDivElement>(null); - const plotRef = React.useRef<any>(null); - - useEffect(() => { - if (containerRef.current) { - const themeConfig = { - theme: { - colors10, - }, - ...(isDark ? DARK_THEME_CONFIG : LIGHT_THEME_CONFIG), - }; - - if (!plotRef.current) { - plotRef.current = new Column(containerRef.current, { - data: DATA, - isGroup: true, - xField: 'x', - yField: 'y', - seriesField: 'type', - // 分组柱状图 组内柱子间的间距 (像素级别) - dodgePadding: 2, - ...themeConfig, - }); - - plotRef.current?.render(); - } else { - plotRef.current.update(themeConfig); - } - } - }, [containerRef, isDark, colors10]); - - return ( - <div className={styles.container}> - <div ref={containerRef} /> - </div> - ); -} diff --git a/site/components/ThemeCharts/Charts/Gauge/index.tsx b/site/components/ThemeCharts/Charts/Gauge/index.tsx deleted file mode 100644 index 3a67f0443..000000000 --- a/site/components/ThemeCharts/Charts/Gauge/index.tsx +++ /dev/null @@ -1,83 +0,0 @@ -import { Gauge } from '@antv/g2plot'; -import { useIntl } from 'dumi'; -import { get } from 'lodash'; -import React, { useEffect, useMemo, useRef } from 'react'; - -import styles from '../index.module.less'; - -type GaugeProps = { - theme?: any; -}; - -// 仪表盘 -export function GaugeChart(props: GaugeProps) { - const { theme = {} } = props; - const { value, sequential } = theme; - const colors10 = get(sequential, ['colors', '0'], []); - const isDark = useMemo(() => value === 'dark', [value]); - - const intl = useIntl(); - const useT = (transformedMessage: string) => { - return intl.formatMessage({ - id: transformedMessage, - }); - }; - - const containerRef = useRef<HTMLDivElement>(null); - const plotRef = React.useRef<any>(null); - - useEffect(() => { - if (containerRef.current) { - const themeConfig = { - range: { - ticks: [0, 1 / 3, 3 / 5, 4 / 5, 1], - color: colors10, - }, - statistic: { - content: { - offsetY: -80, - customHtml: () => { - return ` - <div> - <img alt="icon" style="width: 36px; height: 36px;margin-bottom: 12px;" src="${ - isDark - ? 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*hINPQYnKaIAAAAAAAAAAAAAADmJ7AQ/original' - : 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*BjKVTp2kKSQAAAAAAAAAAAAADmJ7AQ/original' - }" /> - <div style="font-size: 12px;color: ${ - isDark ? 'rgba(255,255,255,0.65)' : '#424E66' - };" >${useT('用户总量')}</div> - <div style="font-size: 32px;color: ${ - isDark ? '#fff' : '#1D2129' - }; line-height: 45px;font-family: AlibabaPuHuiTiB;" >1,320</div> - </div> - `; - }, - }, - }, - }; - - if (!plotRef.current) { - plotRef.current = new Gauge(containerRef.current, { - percent: 0, - appendPadding: [0, 0, 10, 0], - startAngle: -Math.PI, - endAngle: 0, - indicator: false, - animation: {}, - ...themeConfig, - }); - - plotRef.current?.render(); - } else { - plotRef.current.update(themeConfig); - } - } - }, [containerRef, isDark, colors10]); - - return ( - <div className={styles.container}> - <div ref={containerRef} /> - </div> - ); -} diff --git a/site/components/ThemeCharts/Charts/Graph/index.tsx b/site/components/ThemeCharts/Charts/Graph/index.tsx deleted file mode 100644 index c690f8e7c..000000000 --- a/site/components/ThemeCharts/Charts/Graph/index.tsx +++ /dev/null @@ -1,218 +0,0 @@ -import { Graph } from '@antv/g6'; -import { debounce } from 'lodash'; -import React, { useCallback, useEffect, useMemo, useRef } from 'react'; - -import styles from '../index.module.less'; - -type GraphProps = { - theme?: any; -}; - -const DATA = { - nodes: [ - { - id: 'node0', - size: 32, - style: { fill: '#2486FF' }, - label: 'host', - type: 0, - x: 150, - y: 150, - }, - { - id: 'node1', - size: 32, - style: { fill: '#00C7C7' }, - label: 'item', - type: 1, - x: 400, - y: 0, - }, - { - id: 'node2', - size: 32, - style: { fill: '#00C7C7' }, - label: 'item ', - type: 1, - x: 400, - y: 150, - }, - { - id: 'node3', - size: 32, - style: { fill: '#00C7C7' }, - label: 'item', - type: 1, - x: 400, - y: 300, - }, - { - id: 'node4', - size: 32, - style: { fill: '#F58C58' }, - label: 'file', - type: 2, - x: 0, - y: 0, - }, - { - id: 'node5', - size: 32, - style: { fill: '#F58C58' }, - label: 'file', - type: 2, - x: 0, - y: 150, - }, - { - id: 'node6', - size: 32, - style: { fill: '#F58C58' }, - label: 'file', - type: 2, - x: 0, - y: 300, - }, - ], - edges: [ - { source: 'node0', target: 'node1' }, - { source: 'node0', target: 'node2' }, - { source: 'node0', target: 'node3' }, - { source: 'node0', target: 'node4' }, - { source: 'node0', target: 'node5' }, - { source: 'node0', target: 'node6' }, - ], -}; - -// 力导向图布局 -export function GraphChart(props: GraphProps) { - const { theme = {} } = props; - const { value, categorical } = theme; - const colors10 = categorical.colors; - const isDark = useMemo(() => value === 'dark', [value]); - - const containerRef = useRef<HTMLDivElement>(null); - const plotRef = React.useRef<any>(null); - - const data = useMemo( - () => ({ - ...DATA, - nodes: DATA.nodes.map((item) => ({ - ...item, - style: { - fill: colors10[item.type], - }, - icon: { - show: true, - img: [ - 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*Q2piT7W5HCMAAAAAAAAAAAAADmJ7AQ/original', - 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*I-Q8Ta_r9T4AAAAAAAAAAAAADmJ7AQ/original', - 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*mNDaSa5JIuQAAAAAAAAAAAAADmJ7AQ/original', - ][item.type], - }, - })), - }), - [colors10], - ); - - const defaultNode = useMemo( - () => ({ - color: '#fff', - labelCfg: { - position: 'bottom', - style: { - fill: isDark ? 'rgba(255,255,255,0.45)' : '#86909C', - }, - }, - }), - [isDark], - ); - - const create = useCallback( - (container: HTMLDivElement | null) => { - if (!container) return; - const width = container.clientWidth; - const height = container.clientHeight; - - // 限制范围 - const onTick = () => { - data.nodes.forEach((node) => { - node.x = Math.min(Math.max(5, node.x), width - 10); - node.y = Math.min(Math.max(18, node.y), height - 36); - }); - }; - - plotRef.current = new Graph({ - container, - width, - height, - defaultNode, - layout: { - type: 'force', - linkDistance: (d: any) => { - if (['node2', 'node5'].includes(d.target.id)) return 130; - return 100; - }, - onTick, - }, - }); - - plotRef.current.data(data); - - plotRef.current.render(); - - function refreshDragedNodePosition(e: any) { - const model = e.item.get('model'); - model.fx = e.x; - model.fy = e.y; - } - - plotRef.current.on('node:dragstart', (e: any) => { - plotRef.current.layout(); - refreshDragedNodePosition(e); - }); - plotRef.current.on('node:drag', (e: any) => { - refreshDragedNodePosition(e); - }); - plotRef.current.on('node:dragend', (e: any) => { - e.item.get('model').fx = null; - e.item.get('model').fy = null; - }); - }, - [data, defaultNode], - ); - - useEffect(() => { - if (containerRef.current) { - const container = containerRef.current; - if (!plotRef.current) { - create(container); - } else { - plotRef.current.set('defaultNode', defaultNode); - plotRef.current.changeData(data); - } - } - }, [containerRef, data, defaultNode]); - - // g6 不能自动更新以及手动更新而更新图的位置在最中心。 重新进行创建 - useEffect(() => { - const container = containerRef?.current; - const onResize = debounce(() => { - plotRef.current.destroy(); - create(container); - }, 100); - - if (container) { - window.addEventListener('resize', onResize); - } - return () => { - window.removeEventListener('resize', onResize); - }; - }, [containerRef]); - - return ( - <div className={styles.container}> - <div ref={containerRef} /> - </div> - ); -} diff --git a/site/components/ThemeCharts/Charts/Line/index.tsx b/site/components/ThemeCharts/Charts/Line/index.tsx deleted file mode 100644 index e493dbe28..000000000 --- a/site/components/ThemeCharts/Charts/Line/index.tsx +++ /dev/null @@ -1,96 +0,0 @@ -import { Line } from '@antv/g2plot'; -import React, { useEffect, useMemo, useRef } from 'react'; -import { DARK_THEME_CONFIG, LIGHT_THEME_CONFIG } from '../Column'; - -import styles from '../index.module.less'; - -type LineProps = { - theme?: any; -}; - -const DATA = [ - { - x: '10-13', - y: 590, - type: 'PD', - }, - { - x: '10-13', - y: 500, - type: 'FE', - }, - { - x: '10-14', - y: 220, - type: 'PD', - }, - { - x: '10-14', - y: 400, - type: 'FE', - }, - { - x: '10-15', - y: 344, - type: 'PD', - }, - { - x: '10-15', - y: 133, - type: 'FE', - }, - { - x: '10-16', - y: 455, - type: 'PD', - }, - { - x: '10-16', - y: 600, - type: 'FE', - }, -]; - -// 折线图 -export function LineChart(props: LineProps) { - const { theme = {} } = props; - const { value, categorical } = theme; - const colors10 = categorical.colors; - const isDark = useMemo(() => value === 'dark', [value]); - - const containerRef = useRef<HTMLDivElement>(null); - const plotRef = React.useRef<any>(null); - - useEffect(() => { - if (containerRef.current) { - const themeConfig = { - theme: { - colors10, - }, - ...(isDark ? DARK_THEME_CONFIG : LIGHT_THEME_CONFIG), - }; - - if (!plotRef.current) { - plotRef.current = new Line(containerRef.current, { - data: DATA, - xField: 'x', - yField: 'y', - seriesField: 'type', - smooth: true, - point: {}, - ...themeConfig, - }); - - plotRef.current?.render(); - } else { - plotRef.current.update(themeConfig); - } - } - }, [containerRef, isDark, colors10]); - - return ( - <div className={styles.container}> - <div ref={containerRef} /> - </div> - ); -} diff --git a/site/components/ThemeCharts/Charts/Pie/index.tsx b/site/components/ThemeCharts/Charts/Pie/index.tsx deleted file mode 100644 index f5a94222d..000000000 --- a/site/components/ThemeCharts/Charts/Pie/index.tsx +++ /dev/null @@ -1,121 +0,0 @@ -import { Pie } from '@antv/g2plot'; -import { useIntl } from 'dumi'; -import React, { useEffect, useMemo, useRef } from 'react'; -import { DARK_THEME_CONFIG, LIGHT_THEME_CONFIG } from '../Column'; - -import styles from '../index.module.less'; - -type PieProps = { - theme?: any; -}; - -const DATA = [ - { type: 'PD: 1600', value: 1600 }, - { type: 'FE: 1000', value: 1000 }, - { type: 'UX: 400', value: 600 }, -]; - -// 饼图 -export function PieChart(props: PieProps) { - const { theme = {} } = props; - const { value, categorical } = theme; - const colors10 = categorical.colors; - const isDark = useMemo(() => value === 'dark', [value]); - - const intl = useIntl(); - const useT = (transformedMessage: string) => { - return intl.formatMessage({ - id: transformedMessage, - }); - }; - - const containerRef = useRef<HTMLDivElement>(null); - const plotRef = React.useRef<any>(null); - - useEffect(() => { - if (containerRef.current) { - const themeConfig = { - theme: { - colors10, - }, - legend: { - ...(isDark ? DARK_THEME_CONFIG : LIGHT_THEME_CONFIG)['legend'], - position: 'bottom', - }, - pieStyle: { - lineWidth: 0, - }, - statistic: { - title: { - offsetY: -10, - content: useT('用户总量'), - style: { - fontSize: '10px', - color: isDark ? 'rgba(255,255,255,0.45)' : '#424E66', - }, - }, - content: { - offsetY: -2, - content: '3,200', - style: { - fontFamily: 'AlibabaPuHuiTiB', - fontSize: '20px', - color: isDark ? '#fff' : '#1D2129', - }, - }, - }, - } as any; - if (!plotRef.current) { - plotRef.current = new Pie(containerRef.current, { - data: DATA, - angleField: 'value', - colorField: 'type', - innerRadius: 0.8, - label: false, - appendPadding: 10, - // 添加 中心统计文本 交互 - interactions: [ - { type: 'element-selected' }, - { type: 'element-active' }, - { - type: 'pie-statistic-active', - cfg: { - start: [ - { - trigger: 'element:mouseenter', - action: 'pie-statistic:change', - }, - { - trigger: 'legend-item:mouseenter', - action: 'pie-statistic:change', - }, - ], - end: [ - { - trigger: 'element:mouseleave', - action: 'pie-statistic:reset', - }, - { - trigger: 'legend-item:mouseleave', - action: 'pie-statistic:reset', - }, - ], - }, - }, - ], - ...themeConfig, - }); - - plotRef.current?.render(); - } else { - plotRef.current.update(themeConfig); - } - } - }, [containerRef, isDark, colors10]); - - return ( - <div className={styles.container}> - <div ref={containerRef} /> - </div> - ); -} diff --git a/site/components/ThemeCharts/Charts/StackedColumn/index.tsx b/site/components/ThemeCharts/Charts/StackedColumn/index.tsx deleted file mode 100644 index a47f81103..000000000 --- a/site/components/ThemeCharts/Charts/StackedColumn/index.tsx +++ /dev/null @@ -1,135 +0,0 @@ -import { Column } from '@antv/g2plot'; -import React, { useEffect, useMemo, useRef } from 'react'; -import { DARK_THEME_CONFIG, LIGHT_THEME_CONFIG } from '../Column'; - -import styles from '../index.module.less'; - -type StackedColumnProps = { - theme?: any; -}; - -const DATA = [ - { - x: '10-13', - y: 300, - type: 'PD', - }, - { - x: '10-13', - y: 100, - type: 'FE', - }, - { - x: '10-13', - y: 100, - type: 'UX', - }, - { - x: '10-13', - y: 100, - type: 'UE', - }, - { - x: '10-14', - y: 220, - type: 'PD', - }, - { - x: '10-14', - y: 80, - type: 'FE', - }, - { - x: '10-14', - y: 50, - type: 'UX', - }, - { - x: '10-14', - y: 250, - type: 'UE', - }, - { - x: '10-15', - y: 120, - type: 'PD', - }, - { - x: '10-15', - y: 180, - type: 'FE', - }, - { - x: '10-15', - y: 200, - type: 'UX', - }, - { - x: '10-15', - y: 100, - type: 'UE', - }, - { - x: '10-16', - y: 250, - type: 'PD', - }, - { - x: '10-16', - y: 50, - type: 'FE', - }, - { - x: '10-16', - y: 120, - type: 'UX', - }, - { - x: '10-16', - y: 180, - type: 'UE', - }, -]; - -// 堆叠柱形图 -export function StackedColumnChart(props: StackedColumnProps) { - const { theme = {} } = props; - const { value, categorical } = theme; - const colors10 = categorical.colors; - const isDark = useMemo(() => value === 'dark', [value]); - - const containerRef = useRef<HTMLDivElement>(null); - const plotRef = React.useRef<any>(null); - - useEffect(() => { - if (containerRef.current) { - const themeConfig = { - theme: { - colors10, - }, - ...(isDark ? DARK_THEME_CONFIG : LIGHT_THEME_CONFIG), - }; - - if (!plotRef.current) { - plotRef.current = new Column(containerRef.current, { - data: DATA, - isStack: true, - xField: 'x', - yField: 'y', - seriesField: 'type', - ...themeConfig, - }); - - plotRef.current?.render(); - } else { - plotRef.current.update(themeConfig); - } - } - }, [containerRef, isDark, colors10]); - - return ( - <div className={styles.container}> - <div ref={containerRef} /> - </div> - ); -} diff --git a/site/components/ThemeCharts/Charts/index.module.less b/site/components/ThemeCharts/Charts/index.module.less deleted file mode 100644 index f94c91d0c..000000000 --- a/site/components/ThemeCharts/Charts/index.module.less +++ /dev/null @@ -1,9 +0,0 @@ -.container { - width: 100%; - height: 100%; - - > div { - width: 100%; - height: 100%; - } -} diff --git a/site/components/ThemeCharts/Charts/index.tsx b/site/components/ThemeCharts/Charts/index.tsx deleted file mode 100644 index 88b5d0e16..000000000 --- a/site/components/ThemeCharts/Charts/index.tsx +++ /dev/null @@ -1,6 +0,0 @@ -export { ColumnChart } from './Column'; -export { GaugeChart } from './Gauge'; -export { GraphChart } from './Graph'; -export { LineChart } from './Line'; -export { PieChart } from './Pie'; -export { StackedColumnChart } from './StackedColumn'; diff --git a/site/components/ThemeCharts/index.module.less b/site/components/ThemeCharts/index.module.less deleted file mode 100644 index 2d5cb93e3..000000000 --- a/site/components/ThemeCharts/index.module.less +++ /dev/null @@ -1,249 +0,0 @@ -.commonFlexConfig { - display: flex; - align-items: center; - justify-content: center; -} - -.themeCharts { - &:extend(.commonFlexConfig); - position: relative; - z-index: 2; - padding: 50px 0 40px; - flex-direction: column; - font-family: PingFangSC; - background-size: cover; - background-color: rgba(0, 0, 0, 0); - - .title { - height: 48px; - line-height: 1em; - font-size: 40px; - color: #1d2129; - font-family: AlibabaPuHuiTiB; - margin-bottom: 48px; - } - - .themeButtons { - display: flex; - justify-content: center; - margin-bottom: 32px; - - .button { - &:extend(.commonFlexConfig); - height: 52px; - width: 160px; - cursor: pointer; - font-size: 18px; - background-color: #ffffff; - border: 2px solid #e5e8ef; - border-radius: 8px; - margin-right: 20px; - line-height: 52px; - - > img { - height: 24px; - width: 24px; - margin-right: 8px; - } - - &:hover { - font-weight: 500; - border: 2px solid #691eff; - } - } - - .isTheme { - font-weight: 500; - border: 2px solid #691eff; - color: #691eff; - } - } - - .themeChart { - height: 600px; - width: calc(100vw - 360px); - max-width: 1680px; - min-width: 1040px; - background-color: #fafbfc; - border: 1px solid #e5e8ef; - box-shadow: 0 8px 28px 0 rgba(0, 0, 0, 0.05); - border-radius: 16px; - box-sizing: border-box; - padding: 24px; - margin-bottom: 36px; - - .msg { - display: flex; - align-items: center; - letter-spacing: 0; - line-height: 28px; - height: 28px; - margin-bottom: 18px; - - .msgTitle { - width: 85px; - font-size: 20px; - color: #1d2129; - font-family: AlibabaPuHuiTiB; - } - - .msgText { - font-size: 16px; - color: #000000; - line-height: 28px; - } - } - - .charts { - .chart { - height: 243px; - width: calc(100% / 3 - 10px); - background: #fff; - box-sizing: border-box; - padding: 18px; - float: left; - margin-bottom: 15px; - margin-right: 14px; - box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.05); - border-radius: 12px; - - .chartMsg { - height: 24px; - font-weight: 500; - font-size: 16px; - color: #1d2129; - letter-spacing: 0; - line-height: 24px; - } - - .content { - height: 183px; - } - } - - .rightChart { - margin-right: 0; - } - } - } - - .acquire { - &:extend(.commonFlexConfig); - - .download { - font-size: 16px; - color: #424e66; - letter-spacing: 0; - line-height: 24px; - cursor: pointer; - overflow: hidden; - position: relative; - - &:hover { - color: #691eff; - - > img { - position: relative; - left: -80px; - filter: drop-shadow(#691eff 80px 0); - } - } - } - } - - .segmentation { - width: 0; - height: 12px; - border-left: 1px solid #979797; - margin: 0 12px; - } - - &.dark { - .title { - color: #fff; - } - - .themeButtons { - .button { - background: rgba(0, 0, 0, 0); - color: #fff; - opacity: 0.2; - border-color: #fff; - - &:hover { - font-weight: 500; - opacity: 0.9; - } - } - - .isTheme { - font-weight: 500; - opacity: 1; - } - } - - .themeChart { - border-color: rgba(0, 0, 0, 0); - background-position: -100px; - background-color: rgba(0, 0, 0, 0); - - .msg { - .msgTitle { - color: #fff; - } - - .msgText { - color: #fff; - } - } - - .charts { - .chart { - background: rgba(255, 255, 255, 0.08); - - .chartMsg { - color: #fff; - } - } - } - } - - .acquire { - .download { - img { - position: relative; - left: -80px; - filter: drop-shadow(#fff 80px 0); - } - - color: #fff; - opacity: 0.8; - - &:hover { - opacity: 1; - } - } - } - - .segmentation { - border-color: rgba(255, 255, 255, 0.5); - } - } -} - -.colors { - display: flex; - margin-bottom: 16px; - height: 25px; - - .color { - border-radius: 2px; - margin-right: 2px; - width: 23px; - height: 23px; - } - - :last-child { - margin-right: 0px; - } -} diff --git a/site/components/ThemeCharts/index.tsx b/site/components/ThemeCharts/index.tsx deleted file mode 100644 index 3ffae9742..000000000 --- a/site/components/ThemeCharts/index.tsx +++ /dev/null @@ -1,210 +0,0 @@ -import { ColorPicker } from 'antd'; -import classNames from 'classnames'; -import { useIntl } from 'dumi'; -import React, { useCallback, useMemo, useState } from 'react'; -import THEME_DATAS from '../../data/theme-charts.json'; -import THEME_COLORS1 from '../../data/theme-colors1.json'; -import THEME_COLORS2 from '../../data/theme-colors2.json'; -import THEME_COLORS3 from '../../data/theme-colors3.json'; -import { - ColumnChart, - GaugeChart, - GraphChart, - LineChart, - PieChart, - StackedColumnChart, -} from './Charts'; - -import styles from './index.module.less'; - -// 已经生成的主题 json 文件 -const themeColors = [THEME_COLORS1, THEME_COLORS2, THEME_COLORS3]; - -// 自定义主题,暂时不显示,需要时添加到 theme-charts.json 中 -// { -// "text": "自定主题", -// "img": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*5y_oTYSFUjUAAAAAAAAAAAAADmJ7AQ/original", -// "activeImg": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*qebjT6nhHBIAAAAAAAAAAAAADmJ7AQ/original", -// "darkImg": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*fuZwTJHtSWYAAAAAAAAAAAAADmJ7AQ/original", -// "theme": "light" -// } - -const CHARTS = [ - { - msg: '仪表盘', - chart: (theme: any) => <GaugeChart theme={theme} />, - }, - { - msg: '分组柱形图', - chart: (theme: any) => <ColumnChart theme={theme} />, - }, - { - msg: '力导向图布局', - chart: (theme: any) => <GraphChart theme={theme} />, - }, - { - msg: '折线图', - chart: (theme: any) => <LineChart theme={theme} />, - }, - { - msg: '堆叠柱形图', - chart: (theme: any) => <StackedColumnChart theme={theme} />, - }, - { - msg: '环形图', - chart: (theme: any) => <PieChart theme={theme} />, - }, -]; - -// 定制主题,一键生成 -export function ThemeCharts() { - const intl = useIntl(); - const useT = (transformedMessage: string) => { - return intl.formatMessage({ - id: transformedMessage, - }); - }; - - const [select, setSelect] = useState(THEME_DATAS[0]); - - // theme.colors10 - // const [colors10, setColors10] = useState<string[]>(pick('#6400FF', true)); - const [colorsJson, setColorsJson] = useState(THEME_COLORS1); - - // download theme - const onDownload = useCallback(() => { - // 等待后续放开自定义主题使用 autoPalette2 生成 - // const themes = autoPalette2(colors10); - // const json = { - // // _comment: { - // // [useT('发散色板')]: useT('对比色渐变色板,均基于分类色板生长而来,一般是两种互补色(也可以是对比色)去展现数据从一个负向值到 0 点再到正向值的连续变化区间,显示相对立的两个值的大小关系,常用于气温的冷热、海拔高低、股票涨跌等。'), - // // }, - // categorical: { - // text: useT('分类色板'), - // msg: useT('主要用于描述分类数据,如苹果、香蕉、梨,常用一个颜色代表一个值以区分不同类型,取色时色相分布均衡,相邻颜色之间明暗需考虑差异性,常用于饼图的不同分类、填充地图中的不同国家、关系图中的不同角色等。'), - // colors: themes.categorical, - // }, - // sequential: { - // text: useT('单一顺序色板'), - // msg: useT('单色顺序色板,均基于分类色板生长而来,一般使用同一色相,通过明度或饱和度的渐变,常用来表示同一事物中的数值大小或梯度变化,如排行榜等级变化、一个国家或地区的新增人口数对比、风险等级变化等。'), - // colors: themes.sequential, - // }, - // diverging: { - // text: useT('邻近顺序色板'), - // msg: useT('邻近顺序色板,均基于分类色板生长而来,为加大辨识度也可使用邻近色相,通过明度或饱和度的渐变,常用来表示同一事物中的数值大小或梯度变化,如排行榜等级变化、一个国家或地区的新增人口数对比、风险等级变化等。'), - // colors: themes.diverging, - // } - // }; - - const str = JSON.stringify(colorsJson, null, 2); - - const blobURL = new Blob([str], { type: 'text/json' }); - - const a = document.createElement('a'); - a.href = window.URL.createObjectURL(blobURL); - a.download = 'antv_theme.json'; - a.click(); - a.remove(); - }, [colorsJson]); - - const isDark = useMemo(() => select?.theme === 'dark', [select]); - - return ( - <div - className={classNames(styles.themeCharts, { - [styles.dark]: isDark, - })} - style={{ backgroundImage: `url(${select.background})` }} - > - <div className={styles.title}>{useT('定制主题,一键生成')}</div> - <div className={styles.themeButtons}> - {THEME_DATAS.map((data, index) => { - const isTheme = select.text === data.text; - - const button = ( - <div - className={classNames(styles.button, { - [styles.isTheme]: isTheme, - })} - onClick={() => { - setSelect(data); - setColorsJson(themeColors[index]); - }} - > - <img - src={ - isDark ? data.darkImg : isTheme ? data.activeImg : data.img - } - alt="theme_icon" - />{' '} - {useT(data.text)} - </div> - ); - - return index === 3 && isTheme ? ( - <ColorPicker - disabledAlpha - trigger="hover" - key={data.text} - // onChange={(v: any, color: string) => setColors10(pick(color, true))} - panelRender={(panel: React.ReactNode) => ( - <div className="custom-panel"> - <div className={styles.colors}> - { - // colors10.map((color) => <div className={styles.color} style={{ background: color }} />) - } - </div> - {panel} - </div> - )} - > - {button} - </ColorPicker> - ) : ( - button - ); - })} - </div> - <div - className={styles.themeChart} - style={{ backgroundImage: `url(${select.backgroundChart})` }} - > - <div className={styles.msg}> - <img - src="https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*U3AfQq_cQMYAAAAAAAAAAAAADmJ7AQ/original" - alt="antv" - /> - <div className={styles.msgTitle}>AntV 5.0</div> - <div className={styles.segmentation} /> - <div className={styles.msgText}>{useT(select.text)}</div> - </div> - <div className={styles.charts}> - {CHARTS.map((chart, index) => { - return ( - <div - className={classNames(styles.chart, { - [styles.rightChart]: (index + 1) % 3 === 0, - })} - key={chart.msg} - > - <div className={styles.chartMsg}>{useT(chart.msg)}</div> - <div className={styles.content}> - {chart.chart({ ...colorsJson, value: select.theme })} - </div> - </div> - ); - })} - </div> - </div> - <div className={styles.acquire}> - <div className={styles.download} onClick={onDownload}> - <img - alt="download" - src="https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*coOuTKR_NDMAAAAAAAAAAAAADmJ7AQ/original" - />{' '} - {useT('规范下载')} - </div> - </div> - </div> - ); -} diff --git a/site/components/bannerSVG/bannerSVG.module.less b/site/components/bannerSVG/bannerSVG.module.less deleted file mode 100644 index 098fe8314..000000000 --- a/site/components/bannerSVG/bannerSVG.module.less +++ /dev/null @@ -1,1429 +0,0 @@ -.wrapper { - width: 100%; - text-align: center; -} - -.block1Circle1 { - animation: block1Circle1Position 4s ease-in-out infinite; -} -.block1Circle1Infinite { - animation: block1Circle1Position 4s ease-in-out infinite; -} -.block1Circle2 { - animation: block1Circle2Position 4s ease-in-out infinite; -} -.block1Circle2Infinite { - animation: block1Circle2Position 4s ease-in-out infinite; -} -.block1Circle3 { - animation: block1Circle3Position 4s ease-in-out infinite; -} -.block1Circle3Infinite { - animation: block1Circle3Position 4s ease-in-out infinite; -} -.block1Circle4 { - animation: block1Circle4Position 4s ease-in-out infinite; -} -.block1Circle4Infinite { - animation: block1Circle4Position 4s ease-in-out infinite; -} -.block1Circle5 { - animation: block1Circle1Position 4s ease-in-out infinite; -} -.block1Circle5Infinite { - animation: block1Circle1Position 4s ease-in-out infinite; -} - -@keyframes block1Circle1Position { - 0% { - cy: 30; - } - 35% { - cy: 45; - } - 65% { - cy: 15; - } - 100% { - cy: 30; - } -} -@keyframes block1Circle2Position { - 0% { - cy: 15; - } - 35% { - cy: 35; - } - 65% { - cy: 45; - } - 100% { - cy: 15; - } -} -@keyframes block1Circle3Position { - 0% { - cy: 30; - } - 35% { - cy: 15; - } - 65% { - cy: 45; - } - 100% { - cy: 30; - } -} -@keyframes block1Circle4Position { - 0% { - cy: 45; - } - 35% { - cy: 25; - } - 65% { - cy: 15; - } - 100% { - cy: 45; - } -} - -.block2Bar1 { - animation: block2Bar1Width 3.5s ease-in-out infinite; -} -.block2Bar1Infinite { - animation: block2Bar1WidthInfinite 2s ease-in-out infinite; -} -.block2Bar2 { - animation: block2Bar2Width 3.5s ease-in-out infinite; -} -.block2Bar2Infinite { - animation: block2Bar2WidthInfinite 2s ease-in-out infinite; -} -.block2Bar3 { - animation: block2Bar3Width 3.5s ease-in-out infinite; -} -.block2Bar3Infinite { - animation: block2Bar3WidthInfinite 2s ease-in-out infinite; -} -.block2Bar4 { - animation: block2Bar4Width 3.5s ease-in-out infinite; -} -.block2Bar4Infinite { - animation: block2Bar4WidthInfinite 2s ease-in-out infinite; -} - -@keyframes block2Bar1Width { - 0% { - width: 27px; - } - 40% { - width: 27px; - } - 50% { - width: 53px; - } - 90% { - width: 53px; - } - 100% { - width: 27px; - } -} -@keyframes block2Bar2Width { - 0% { - width: 44px; - } - 40% { - width: 44px; - } - 50% { - width: 10px; - } - 90% { - width: 10px; - } - 100% { - width: 44px; - } -} -@keyframes block2Bar3Width { - 0% { - width: 17px; - } - 40% { - width: 17px; - } - 50% { - width: 50px; - } - 90% { - width: 50px; - } - 100% { - width: 17px; - } -} -@keyframes block2Bar4Width { - 0% { - width: 34px; - } - 40% { - width: 34px; - } - 50% { - width: 5px; - } - 90% { - width: 5px; - } - 100% { - width: 34px; - } -} -@keyframes block2Bar1WidthInfinite { - 0% { - width: 27px; - } - 10% { - width: 27px; - } - 30% { - width: 53px; - } - 80% { - width: 53px; - } - 100% { - width: 27px; - } -} -@keyframes block2Bar2WidthInfinite { - 0% { - width: 44px; - } - 10% { - width: 44px; - } - 30% { - width: 10px; - } - 80% { - width: 10px; - } - 100% { - width: 44px; - } -} -@keyframes block2Bar3WidthInfinite { - 0% { - width: 17px; - } - 10% { - width: 17px; - } - 30% { - width: 50px; - } - 80% { - width: 50px; - } - 100% { - width: 17px; - } -} -@keyframes block2Bar4WidthInfinite { - 0% { - width: 34px; - } - 10% { - width: 34px; - } - 30% { - width: 5px; - } - 80% { - width: 5px; - } - 100% { - width: 34px; - } -} - -.block3ArcBig { - animation: block3ArcBigLinedash 5s ease-in-out infinite; -} -.block3ArcBigInfinite { - animation: block3ArcBigLinedashInfinite 2s ease-in-out infinite; -} -.block3ArcSmall { - animation: block3ArcSmallLinedash 5s ease-in-out infinite; -} -.block3ArcSmallInfinite { - animation: block3ArcSmallLinedashInfinite 2s ease-in-out infinite; -} - -@keyframes block3ArcBigLinedash { - 0% { - stroke-dashoffset: 36px; - } - 40% { - stroke-dashoffset: 36px; - } - 50% { - stroke-dashoffset: 10px; - } - 90% { - stroke-dashoffset: 10px; - } - 100% { - stroke-dashoffset: 36px; - } -} -@keyframes block3ArcSmallLinedash { - 0% { - stroke-dashoffset: 6px; - } - 40% { - stroke-dashoffset: 6px; - } - 50% { - stroke-dashoffset: 25px; - } - 90% { - stroke-dashoffset: 25px; - } - 100% { - stroke-dashoffset: 6px; - } -} - -@keyframes block3ArcBigLinedashInfinite { - 0% { - stroke-dashoffset: 36px; - } - 10% { - stroke-dashoffset: 36px; - } - 30% { - stroke-dashoffset: 10px; - } - 80% { - stroke-dashoffset: 10px; - } - 100% { - stroke-dashoffset: 36px; - } -} -@keyframes block3ArcSmallLinedashInfinite { - 0% { - stroke-dashoffset: 6px; - } - 10% { - stroke-dashoffset: 6px; - } - 30% { - stroke-dashoffset: 25px; - } - 80% { - stroke-dashoffset: 25px; - } - 100% { - stroke-dashoffset: 6px; - } -} - -.block4LineVerti { - animation: block4LineVertiHeight 1s ease-in-out infinite; -} -.block4LineVertiInfinite { - animation: block4LineVertiHeight 1s ease-in-out infinite; -} -.block4LineHori { - animation: block4LineHoriWidth 1s ease-in-out infinite; -} -.block4LineHoriInfinite { - animation: block4LineHoriWidth 1s ease-in-out infinite; -} -.block4Circle { - animation: block4CircleLinedash 1s ease-in-out infinite; -} -.block4CircleInfinite { - animation: block4CircleLinedash 1s ease-in-out infinite; -} - -@keyframes block4LineVertiHeight { - 0% { - height: 20px; - y: 180px; - } - 100% { - height: 192px; - y: 20px; - } -} -@keyframes block4LineHoriWidth { - 0% { - width: 20px; - } - 100% { - width: 202px; - } -} -@keyframes block4CircleLinedash { - 0% { - stroke-dashoffset: 130px; - } - 100% { - stroke-dashoffset: 0px; - } -} - -.block5Fan { - animation: block5FanLinedash 5s ease-in-out infinite; -} -.block5FanInfinite { - animation: block5FanLinedashInfinite 3s ease-in-out infinite; -} - -@keyframes block5FanLinedash { - 0% { - stroke-dashoffset: 193.5px; - } - 10% { - stroke-dashoffset: 193.5px; - } - 45% { - stroke-dashoffset: 0px; - } - 60% { - stroke-dashoffset: 0px; - } - 95% { - stroke-dashoffset: 193.5px; - } - 100% { - stroke-dashoffset: 193.5px; - } -} -@keyframes block5FanLinedashInfinite { - 0% { - stroke-dashoffset: 193.5px; - } - 5% { - stroke-dashoffset: 193.5px; - } - 45% { - stroke-dashoffset: 0px; - } - 50% { - stroke-dashoffset: 0px; - } - 85% { - stroke-dashoffset: 193.5px; - } - 100% { - stroke-dashoffset: 193.5px; - } -} - -.block6CircleA { - animation: block6CircleAPosition 3s ease-in-out infinite; -} -.block6CircleAInfinite { - animation: block6CircleAPositionInfinite 3s ease-in-out infinite; -} -.block6CircleB { - animation: block6CircleBPosition 3s ease-in-out infinite; -} -.block6CircleBInfinite { - animation: block6CircleBPositionInfinite 3s ease-in-out infinite; -} -.block6CircleC { - animation: block6CircleCPosition 3s ease-in-out infinite; -} -.block6CircleCInfinite { - animation: block6CircleCPositionInfinite 3s ease-in-out infinite; -} -.block6CircleD { - animation: block6CircleDPosition 3s ease-in-out infinite; -} -.block6CircleDInfinite { - animation: block6CircleDPositionInfinite 3s ease-in-out infinite; -} -.block6CircleE { - animation: block6CircleEPosition 3s ease-in-out infinite; -} -.block6CircleEInfinite { - animation: block6CircleEPositionInfinite 3s ease-in-out infinite; -} -.block6CircleF { - animation: block6CircleFPosition 3s ease-in-out infinite; -} -.block6CircleFInfinite { - animation: block6CircleFPositionInfinite 3s ease-in-out infinite; -} -.block6CircleG { - animation: block6CircleGPosition 3s ease-in-out infinite; -} -.block6CircleGInfinite { - animation: block6CircleGPositionInfinite 3s ease-in-out infinite; -} -.block6CircleH { - animation: block6CircleHPosition 3s ease-in-out infinite; -} -.block6CircleHInfinite { - animation: block6CircleHPositionInfinite 3s ease-in-out infinite; -} -.block6CircleI { - animation: block6CircleIPosition 3s ease-in-out infinite; -} -.block6CircleIInfinite { - animation: block6CircleIPositionInfinite 3s ease-in-out infinite; -} -.block6CircleJ { - animation: block6CircleJPosition 3s ease-in-out infinite; -} -.block6CircleJInfinite { - animation: block6CircleJPositionInfinite 3s ease-in-out infinite; -} -.block6CircleK { - animation: block6CircleKPosition 3s ease-in-out infinite; -} -.block6CircleKInfinite { - animation: block6CircleKPositionInfinite 3s ease-in-out infinite; -} -.block6CircleL { - animation: block6CircleLPosition 3s ease-in-out infinite; -} -.block6CircleLInfinite { - animation: block6CircleLPositionInfinite 3s ease-in-out infinite; -} -.block6CircleM { - animation: block6CircleMPosition 3s ease-in-out infinite; -} -.block6CircleMInfinite { - animation: block6CircleMPositionInfinite 3s ease-in-out infinite; -} -.block6CircleN { - animation: block6CircleNPosition 3s ease-in-out infinite; -} -.block6CircleNInfinite { - animation: block6CircleNPositionInfinite 3s ease-in-out infinite; -} -.block6CircleO { - animation: block6CircleOPosition 3s ease-in-out infinite; -} -.block6CircleOInfinite { - animation: block6CircleOPositionInfinite 3s ease-in-out infinite; -} -.block6CircleP { - animation: block6CirclePPosition 3s ease-in-out infinite; -} -.block6CirclePInfinite { - animation: block6CirclePPositionInfinite 3s ease-in-out infinite; -} -.block6NodesContainer { - animation: block6ContainerRotate 3s ease-in-out infinite; -} -.block6NodesContainerInfinite { - animation: block6ContainerRotateInfinite 3s ease-in-out infinite; -} -@keyframes block6CircleAPosition { - 0% { - cx: 45.5px; - cy: 45.5px; - } - 30% { - cx: 45.5px; - cy: 45.5px; - } - 50% { - cx: 36.8px; - cy: 49.8px; - } - 80% { - cx: 36.8px; - cy: 49.8px; - } - 100% { - cx: 45.5px; - cy: 45.5px; - } -} -@keyframes block6CircleBPosition { - 0% { - cx: 65.5px; - cy: 45.5px; - } - 30% { - cx: 65.5px; - cy: 45.5px; - } - 50% { - cx: 66.8px; - cy: 29.8px; - } - 80% { - cx: 66.8px; - cy: 29.8px; - } - 100% { - cx: 65.5px; - cy: 45.5px; - } -} -@keyframes block6CircleCPosition { - 0% { - cx: 85.5px; - cy: 45.5px; - } - 30% { - cx: 85.5px; - cy: 45.5px; - } - 50% { - cx: 84.8px; - cy: 29.8px; - } - 80% { - cx: 84.8px; - cy: 29.8px; - } - 100% { - cx: 85.5px; - cy: 45.5px; - } -} -@keyframes block6CircleDPosition { - 0% { - cx: 105.5px; - cy: 45.5px; - } - 30% { - cx: 105.5px; - cy: 45.5px; - } - 50% { - cx: 101.8px; - cy: 36.8px; - } - 80% { - cx: 101.8px; - cy: 36.8px; - } - 100% { - cx: 105.5px; - cy: 45.5px; - } -} -@keyframes block6CircleEPosition { - 0% { - cx: 45.5px; - cy: 65.5px; - } - 30% { - cx: 45.5px; - cy: 65.5px; - } - 50% { - cx: 29.8px; - cy: 66.8px; - } - 80% { - cx: 29.8px; - cy: 66.8px; - } - 100% { - cx: 45.5px; - cy: 65.5px; - } -} -@keyframes block6CircleFPosition { - 0% { - cx: 65.5px; - cy: 65.5px; - } - 30% { - cx: 65.5px; - cy: 65.5px; - } - 50% { - cx: 49.8px; - cy: 36.8px; - } - 80% { - cx: 49.8px; - cy: 36.8px; - } - 100% { - cx: 65.5px; - cy: 65.5px; - } -} -@keyframes block6CircleGPosition { - 0% { - cx: 85.5px; - cy: 65.5px; - } - 30% { - cx: 85.5px; - cy: 65.5px; - } - 50% { - cx: 114.8px; - cy: 49.8px; - } - 80% { - cx: 114.8px; - cy: 49.8px; - } - 100% { - cx: 85.5px; - cy: 65.5px; - } -} -@keyframes block6CircleHPosition { - 0% { - cx: 105.5px; - cy: 65.5px; - } - 30% { - cx: 105.5px; - cy: 65.5px; - } - 50% { - cx: 121.8px; - cy: 66.8px; - } - 80% { - cx: 121.8px; - cy: 66.8px; - } - 100% { - cx: 105.5px; - cy: 65.5px; - } -} -@keyframes block6CircleIPosition { - 0% { - cx: 45.5px; - cy: 85.5px; - } - 30% { - cx: 45.5px; - cy: 85.5px; - } - 50% { - cx: 29.8px; - cy: 84.8px; - } - 80% { - cx: 29.8px; - cy: 84.8px; - } - 100% { - cx: 45.5px; - cy: 85.5px; - } -} -@keyframes block6CircleJPosition { - 0% { - cx: 65.5px; - cy: 85.5px; - } - 30% { - cx: 65.5px; - cy: 85.5px; - } - 50% { - cx: 36.8px; - cy: 101.8px; - } - 80% { - cx: 36.8px; - cy: 101.8px; - } - 100% { - cx: 65.5px; - cy: 85.5px; - } -} -@keyframes block6CircleKPosition { - 0% { - cx: 85.5px; - cy: 85.5px; - } - 30% { - cx: 85.5px; - cy: 85.5px; - } - 50% { - cx: 101.8px; - cy: 114.8px; - } - 80% { - cx: 101.8px; - cy: 114.8px; - } - 100% { - cx: 85.5px; - cy: 85.5px; - } -} -@keyframes block6CircleLPosition { - 0% { - cx: 105.5px; - cy: 85.5px; - } - 30% { - cx: 105.5px; - cy: 85.5px; - } - 50% { - cx: 121.8px; - cy: 84.8px; - } - 80% { - cx: 121.8px; - cy: 84.8px; - } - 100% { - cx: 105.5px; - cy: 85.5px; - } -} -@keyframes block6CircleMPosition { - 0% { - cx: 45.5px; - cy: 105.5px; - } - 30% { - cx: 45.5px; - cy: 105.5px; - } - 50% { - cx: 49.8px; - cy: 115.8px; - } - 80% { - cx: 49.8px; - cy: 115.8px; - } - 100% { - cx: 45.5px; - cy: 105.5px; - } -} -@keyframes block6CircleNPosition { - 0% { - cx: 65.5px; - cy: 105.5px; - } - 30% { - cx: 65.5px; - cy: 105.5px; - } - 50% { - cx: 66.8px; - cy: 121.8px; - } - 80% { - cx: 66.8px; - cy: 121.8px; - } - 100% { - cx: 65.5px; - cy: 105.5px; - } -} -@keyframes block6CircleOPosition { - 0% { - cx: 85.5px; - cy: 105.5px; - } - 30% { - cx: 85.5px; - cy: 105.5px; - } - 50% { - cx: 84.8px; - cy: 121.8px; - } - 80% { - cx: 84.8px; - cy: 121.8px; - } - 100% { - cx: 85.5px; - cy: 105.5px; - } -} -@keyframes block6CirclePPosition { - 0% { - cx: 105.5px; - cy: 105.5px; - } - 30% { - cx: 105.5px; - cy: 105.5px; - } - 50% { - cx: 114.8px; - cy: 101.8px; - } - 80% { - cx: 114.8px; - cy: 101.8px; - } - 100% { - cx: 105.5px; - cy: 105.5px; - } -} - -@keyframes block6CircleAPositionInfinite { - 0% { - cx: 45.5px; - cy: 45.5px; - } - 10% { - cx: 45.5px; - cy: 45.5px; - } - 30% { - cx: 36.8px; - cy: 49.8px; - } - 60% { - cx: 36.8px; - cy: 49.8px; - } - 80% { - cx: 45.5px; - cy: 45.5px; - } - 100% { - cx: 45.5px; - cy: 45.5px; - } -} -@keyframes block6CircleBPositionInfinite { - 0% { - cx: 65.5px; - cy: 45.5px; - } - 10% { - cx: 65.5px; - cy: 45.5px; - } - 30% { - cx: 66.8px; - cy: 29.8px; - } - 60% { - cx: 66.8px; - cy: 29.8px; - } - 80% { - cx: 65.5px; - cy: 45.5px; - } - 100% { - cx: 65.5px; - cy: 45.5px; - } -} -@keyframes block6CircleCPositionInfinite { - 0% { - cx: 85.5px; - cy: 45.5px; - } - 10% { - cx: 85.5px; - cy: 45.5px; - } - 30% { - cx: 84.8px; - cy: 29.8px; - } - 60% { - cx: 84.8px; - cy: 29.8px; - } - 80% { - cx: 85.5px; - cy: 45.5px; - } - 100% { - cx: 85.5px; - cy: 45.5px; - } -} -@keyframes block6CircleDPositionInfinite { - 0% { - cx: 105.5px; - cy: 45.5px; - } - 10% { - cx: 105.5px; - cy: 45.5px; - } - 30% { - cx: 101.8px; - cy: 36.8px; - } - 60% { - cx: 101.8px; - cy: 36.8px; - } - 80% { - cx: 105.5px; - cy: 45.5px; - } - 100% { - cx: 105.5px; - cy: 45.5px; - } -} -@keyframes block6CircleEPositionInfinite { - 0% { - cx: 45.5px; - cy: 65.5px; - } - 10% { - cx: 45.5px; - cy: 65.5px; - } - 30% { - cx: 29.8px; - cy: 66.8px; - } - 60% { - cx: 29.8px; - cy: 66.8px; - } - 80% { - cx: 45.5px; - cy: 65.5px; - } - 100% { - cx: 45.5px; - cy: 65.5px; - } -} -@keyframes block6CircleFPositionInfinite { - 0% { - cx: 65.5px; - cy: 65.5px; - } - 10% { - cx: 65.5px; - cy: 65.5px; - } - 30% { - cx: 49.8px; - cy: 36.8px; - } - 60% { - cx: 49.8px; - cy: 36.8px; - } - 80% { - cx: 65.5px; - cy: 65.5px; - } - 100% { - cx: 65.5px; - cy: 65.5px; - } -} -@keyframes block6CircleGPositionInfinite { - 0% { - cx: 85.5px; - cy: 65.5px; - } - 10% { - cx: 85.5px; - cy: 65.5px; - } - 30% { - cx: 114.8px; - cy: 49.8px; - } - 60% { - cx: 114.8px; - cy: 49.8px; - } - 80% { - cx: 85.5px; - cy: 65.5px; - } - 100% { - cx: 85.5px; - cy: 65.5px; - } -} -@keyframes block6CircleHPositionInfinite { - 0% { - cx: 105.5px; - cy: 65.5px; - } - 10% { - cx: 105.5px; - cy: 65.5px; - } - 30% { - cx: 121.8px; - cy: 66.8px; - } - 60% { - cx: 121.8px; - cy: 66.8px; - } - 80% { - cx: 105.5px; - cy: 65.5px; - } - 100% { - cx: 105.5px; - cy: 65.5px; - } -} -@keyframes block6CircleIPositionInfinite { - 0% { - cx: 45.5px; - cy: 85.5px; - } - 10% { - cx: 45.5px; - cy: 85.5px; - } - 30% { - cx: 29.8px; - cy: 84.8px; - } - 60% { - cx: 29.8px; - cy: 84.8px; - } - 80% { - cx: 45.5px; - cy: 85.5px; - } - 100% { - cx: 45.5px; - cy: 85.5px; - } -} -@keyframes block6CircleJPositionInfinite { - 0% { - cx: 65.5px; - cy: 85.5px; - } - 10% { - cx: 65.5px; - cy: 85.5px; - } - 30% { - cx: 36.8px; - cy: 101.8px; - } - 60% { - cx: 36.8px; - cy: 101.8px; - } - 80% { - cx: 65.5px; - cy: 85.5px; - } - 100% { - cx: 65.5px; - cy: 85.5px; - } -} -@keyframes block6CircleKPositionInfinite { - 0% { - cx: 85.5px; - cy: 85.5px; - } - 10% { - cx: 85.5px; - cy: 85.5px; - } - 30% { - cx: 101.8px; - cy: 114.8px; - } - 60% { - cx: 101.8px; - cy: 114.8px; - } - 80% { - cx: 85.5px; - cy: 85.5px; - } - 100% { - cx: 85.5px; - cy: 85.5px; - } -} -@keyframes block6CircleLPositionInfinite { - 0% { - cx: 105.5px; - cy: 85.5px; - } - 10% { - cx: 105.5px; - cy: 85.5px; - } - 30% { - cx: 121.8px; - cy: 84.8px; - } - 60% { - cx: 121.8px; - cy: 84.8px; - } - 80% { - cx: 105.5px; - cy: 85.5px; - } - 100% { - cx: 105.5px; - cy: 85.5px; - } -} -@keyframes block6CircleMPositionInfinite { - 0% { - cx: 45.5px; - cy: 105.5px; - } - 10% { - cx: 45.5px; - cy: 105.5px; - } - 30% { - cx: 49.8px; - cy: 115.8px; - } - 60% { - cx: 49.8px; - cy: 115.8px; - } - 80% { - cx: 45.5px; - cy: 105.5px; - } - 100% { - cx: 45.5px; - cy: 105.5px; - } -} -@keyframes block6CircleNPositionInfinite { - 0% { - cx: 65.5px; - cy: 105.5px; - } - 10% { - cx: 65.5px; - cy: 105.5px; - } - 30% { - cx: 66.8px; - cy: 121.8px; - } - 60% { - cx: 66.8px; - cy: 121.8px; - } - 80% { - cx: 65.5px; - cy: 105.5px; - } - 100% { - cx: 65.5px; - cy: 105.5px; - } -} -@keyframes block6CircleOPositionInfinite { - 0% { - cx: 85.5px; - cy: 105.5px; - } - 10% { - cx: 85.5px; - cy: 105.5px; - } - 30% { - cx: 84.8px; - cy: 121.8px; - } - 60% { - cx: 84.8px; - cy: 121.8px; - } - 80% { - cx: 85.5px; - cy: 105.5px; - } - 100% { - cx: 85.5px; - cy: 105.5px; - } -} -@keyframes block6CirclePPositionInfinite { - 0% { - cx: 105.5px; - cy: 105.5px; - } - 10% { - cx: 105.5px; - cy: 105.5px; - } - 30% { - cx: 114.8px; - cy: 101.8px; - } - 60% { - cx: 114.8px; - cy: 101.8px; - } - 80% { - cx: 105.5px; - cy: 105.5px; - } - 100% { - cx: 105.5px; - cy: 105.5px; - } -} - -@keyframes block6ContainerRotate { - 0% { - transform: rotate(0deg); - transform-origin: 77.5px 77.5px; - } - 30% { - transform: rotate(0deg); - transform-origin: 77.5px 77.5px; - } - 50% { - transform: rotate(90deg); - transform-origin: 77.5px 77.5px; - } - 80% { - transform: rotate(90deg); - transform-origin: 77.5px 77.5px; - } - 100% { - transform: rotate(0deg); - transform-origin: 77.5px 77.5px; - } -} -@keyframes block6ContainerRotateInfinite { - 0% { - transform: rotate(0deg); - transform-origin: 77.5px 77.5px; - } - 10% { - transform: rotate(0deg); - transform-origin: 77.5px 77.5px; - } - 30% { - transform: rotate(90deg); - transform-origin: 77.5px 77.5px; - } - 60% { - transform: rotate(90deg); - transform-origin: 77.5px 77.5px; - } - 80% { - transform: rotate(0deg); - transform-origin: 77.5px 77.5px; - } - 100% { - transform: rotate(0deg); - transform-origin: 77.5px 77.5px; - } -} - -.block8Bar1 { - animation: block8Bar1Height 3s ease-in-out infinite; -} -.block8Bar1Infinite { - animation: block8Bar1Height 3s ease-in-out infinite; -} -.block8Bar2 { - animation: block8Bar2Height 3s ease-in-out infinite; -} -.block8Bar2Infinite { - animation: block8Bar2Height 3s ease-in-out infinite; -} -.block8Bar3 { - animation: block8Bar3Height 3s ease-in-out infinite; -} -.block8Bar3Infinite { - animation: block8Bar3Height 3s ease-in-out infinite; -} - -@keyframes block8Bar1Height { - 0% { - height: 23.75px; - y: 10px; - } - 50% { - height: 30.75px; - y: 3px; - } - 100% { - height: 23.75px; - y: 10px; - } -} -@keyframes block8Bar2Height { - 0% { - height: 33.75px; - y: 0px; - } - 50% { - height: 10px; - y: 23.75px; - } - 100% { - height: 33.75px; - y: 0px; - } -} -@keyframes block8Bar3Height { - 0% { - height: 16.875px; - y: 17px; - } - 50% { - height: 26.875px; - y: 7px; - } - 100% { - height: 16.875px; - y: 17px; - } -} - -.block7Curve { - animation: block7CurveLinedash 1.5s ease-in-out infinite; -} -.block7CurveInfinite { - animation: block7CurveLinedash 1.5s ease-in-out infinite; -} -@keyframes block7CurveLinedash { - 0% { - stroke-dashoffset: 90; - } - 100% { - stroke-dashoffset: 0; - } -} diff --git a/site/components/bannerSVG/bannerSVG.tsx b/site/components/bannerSVG/bannerSVG.tsx deleted file mode 100644 index 7deed5aed..000000000 --- a/site/components/bannerSVG/bannerSVG.tsx +++ /dev/null @@ -1,1233 +0,0 @@ -import React from 'react'; -import styles from './bannerSVG.module.less'; - -interface BannerSVGProps { - play: boolean; -} - -const BannerSVG = (props: BannerSVGProps) => { - const block6NodeRadius = '2'; - const block6CirclePositions = [ - { x: 36.8, y: 49.8 }, //A - { x: 66.8, y: 29.8 }, //B - { x: 84.8, y: 29.8 }, //C - { x: 101.8, y: 36.8 }, //D - { x: 29.8, y: 66.8 }, //E - { x: 49.8, y: 36.8 }, //F - { x: 114.8, y: 49.8 }, //G - { x: 121.8, y: 66.8 }, //H - { x: 29.8, y: 84.8 }, //I - { x: 36.8, y: 101.8 }, //J - { x: 101.8, y: 114.8 }, //K - { x: 121.8, y: 84.8 }, //L - { x: 49.8, y: 115.8 }, //M - { x: 66.8, y: 121.8 }, //N - { x: 84.8, y: 121.8 }, //O - { x: 114.8, y: 101.8 }, //P - ]; - const block6GridPositions = [ - { x: 45.5, y: 45.5 }, //A - { x: 65.5, y: 45.5 }, //B - { x: 85.5, y: 45.5 }, //C - { x: 105.5, y: 45.5 }, //D - { x: 45.5, y: 65.5 }, //E - { x: 65.5, y: 65.5 }, //F - { x: 85.5, y: 65.5 }, //G - { x: 105.5, y: 65.5 }, //H - { x: 45.5, y: 85.5 }, //I - { x: 65.5, y: 85.5 }, //J - { x: 85.5, y: 85.5 }, //K - { x: 105.5, y: 85.5 }, //L - { x: 45.5, y: 105.5 }, //M - { x: 65.5, y: 105.5 }, //N - { x: 85.5, y: 105.5 }, //O - { x: 105.5, y: 105.5 }, //P - ]; - const labels = [ - 'A', - 'B', - 'C', - 'D', - 'E', - 'F', - 'G', - 'H', - 'I', - 'J', - 'K', - 'L', - 'M', - 'N', - 'O', - 'P', - ]; - const fills = [ - 'rgb(180, 100, 254)', //A - 'rgb(163, 89, 254)', //B - 'rgb(141, 76, 254)', //C - 'rgb(120, 64, 254)', //D - 'rgb(205, 114, 254)', //E - 'rgb(185, 103, 254)', //F - 'rgb(159, 87, 254)', //G - 'rgb(140, 78, 254)', //H - 'rgb(224, 126, 254)', //I - 'rgb(202, 114, 254)', //J - 'rgb(179, 100, 254)', //K - 'rgb(164, 92, 254)', //L - 'rgb(248, 141, 254)', //M - 'rgb(223, 126, 254)', //N - 'rgb(201, 112, 254)', //O - 'rgb(180, 101, 254)', //P - ]; - - const getBlock6Circles = () => { - const circles = labels.map((label, i) => { - const beginx = block6GridPositions[i].x; - const beginy = block6GridPositions[i].y; - const classname = `block6Circle${label}`; - return ( - <circle - id={`block6-circle-${label}`} - className={props.play ? styles[classname] : 'block6CircleStatic'} - key={label} - fill={fills[i]} - cx={beginx} - cy={beginy} - r={block6NodeRadius} - ></circle> - ); - }); - return circles; - }; - - const hoverAnimate = false; - const mouseEnterBlock1 = () => { - if (hoverAnimate) { - for (let i = 1; i <= 5; i++) { - const circleShadow = document.getElementById( - `block1-circle${i}-shadow`, - ); - const circle = document.getElementById(`block1-circle${i}-object`); - circleShadow && - circleShadow.setAttribute( - 'class', - styles[`block1Circle${i}Infinite`], - ); - circle && - circle.setAttribute('class', styles[`block1Circle${i}Infinite`]); - } - } - }; - const mouseOutBlock1 = () => { - if (hoverAnimate) { - for (let i = 1; i <= 5; i++) { - const circleShadow = document.getElementById( - `block1-circle${i}-shadow`, - ); - const circle = document.getElementById(`block1-circle${i}-object`); - circleShadow && circleShadow.setAttribute('class', ''); //styles[`block1Circle${i}`] - circle && circle.setAttribute('class', ''); //styles[`block1Circle${i}`] - } - } - }; - const mouseEnterBlock2 = () => { - if (hoverAnimate) { - for (let i = 1; i <= 4; i++) { - const bar = document.getElementById(`block2-bar${i}`); - bar && bar.setAttribute('class', styles[`block2Bar${i}Infinite`]); - } - } - }; - const mouseOutBlock2 = () => { - if (hoverAnimate) { - for (let i = 1; i <= 4; i++) { - const bar = document.getElementById(`block2-bar${i}`); - bar && bar.setAttribute('class', ''); // styles[`block2Bar${i}Infinite`] - } - } - }; - const mouseEnterBlock3 = () => { - if (hoverAnimate) { - if (hoverAnimate) { - const bigArc = document.getElementById('block3-arc-big'); - const smallArc = document.getElementById('block3-arc-small'); - bigArc && bigArc.setAttribute('class', styles.block3ArcBigInfinite); - smallArc && - smallArc.setAttribute('class', styles.block3ArcSmallInfinite); - } - } - }; - const mouseOutBlock3 = () => { - if (hoverAnimate) { - const bigArc = document.getElementById('block3-arc-big'); - const smallArc = document.getElementById('block3-arc-small'); - bigArc && bigArc.setAttribute('class', ''); - smallArc && smallArc.setAttribute('class', ''); - } - }; - const mouseEnterBlock4 = () => { - if (hoverAnimate) { - const verti = document.getElementById('block4-back-line-verti'); - const hori = document.getElementById('block4-back-line-hori'); - const circle = document.getElementById('block4-back-circle'); - verti && verti.setAttribute('class', styles.block4LineVertiInfinite); - hori && hori.setAttribute('class', styles.block4LineHoriInfinite); - circle && circle.setAttribute('class', styles.block4CircleInfinite); - } - }; - const mouseOutBlock4 = () => { - if (hoverAnimate) { - const verti = document.getElementById('block4-back-line-verti'); - const hori = document.getElementById('block4-back-line-hori'); - const circle = document.getElementById('block4-back-circle'); - verti && verti.setAttribute('class', ''); - hori && hori.setAttribute('class', ''); - circle && circle.setAttribute('class', ''); - } - }; - - const mouseEnterBlock5 = () => { - if (hoverAnimate) { - const fan = document.getElementById('block5-fan'); - fan && fan.setAttribute('class', styles.block5FanInfinite); - } - }; - const mouseOutBlock5 = () => { - if (hoverAnimate) { - const fan = document.getElementById('block5-fan'); - fan && fan.setAttribute('class', styles.block5Fan); - } - }; - - const mouseEnterBlock6 = () => { - if (hoverAnimate) { - labels.forEach((label) => { - const circle = document.getElementById(`block6-circle-${label}`); - circle && - circle.setAttribute('class', styles[`block6Circle${label}Infinite`]); - }); - const container = document.getElementById('block6-nodes'); - container && - container.setAttribute('class', styles.block6NodesContainerInfinite); - } - }; - const mouseOutBlock6 = () => { - if (hoverAnimate) { - labels.forEach((label) => { - const circle = document.getElementById(`block6-circle-${label}`); - circle && circle.setAttribute('class', ''); - }); - const container = document.getElementById('block6-nodes'); - container && container.setAttribute('class', ''); - } - }; - const mouseEnterBlock7 = () => { - if (hoverAnimate) { - const curve = document.getElementById('block7-curve'); - curve && curve.setAttribute('class', styles.block7CurveInfinite); - } - }; - const mouseOutBlock7 = () => { - if (hoverAnimate) { - const curve = document.getElementById('block7-curve'); - curve && curve.setAttribute('class', ''); - } - }; - const mouseEnterBlock8 = () => { - if (hoverAnimate) { - for (let i = 1; i <= 3; i++) { - const bar = document.getElementById(`block8-bar${i}`); - bar && bar.setAttribute('class', styles[`block8Bar${i}Infinite`]); - } - } - }; - const mouseOutBlock8 = () => { - if (hoverAnimate) { - for (let i = 1; i <= 3; i++) { - const bar = document.getElementById(`block8-bar${i}`); - bar && bar.setAttribute('class', ''); - } - } - }; - - return ( - <section className={styles.wrapper}> - <svg width="130%" height="130%" viewBox="-50 -50 751 587" version="1.1"> - <defs> - <linearGradient - x1="0%" - y1="0%" - x2="100%" - y2="100%" - id="back-rect1-gradient" - > - <stop stopColor="#F0EFFD" offset="0%"></stop> - <stop stopColor="#F9F8FF" offset="100%"></stop> - </linearGradient> - <rect id="path-5" x="39" y="0" width="24" height="24"></rect> - <linearGradient - x1="0%" - y1="0%" - x2="100%" - y2="0%" - id="linearGradient-27" - > - <stop stopColor="#3EB0FF" offset="0%"></stop> - <stop stopColor="#00FF97" offset="100%"></stop> - </linearGradient> - <linearGradient - x1="0%" - y1="0%" - x2="100%" - y2="0%" - id="linearGradient-28" - > - <stop stopColor="#3EB0FF" offset="0%"></stop> - <stop stopColor="#00FF97" offset="100%"></stop> - </linearGradient> - <linearGradient - x1="0%" - y1="0%" - x2="100%" - y2="0%" - id="linearGradient-29" - > - <stop stopColor="#3EB0FF" offset="0%"></stop> - <stop stopColor="#00FF97" offset="100%"></stop> - </linearGradient> - <linearGradient - x1="0%" - y1="0%" - x2="100%" - y2="0%" - id="linearGradient-30" - > - <stop stopColor="#3EB0FF" offset="0%"></stop> - <stop stopColor="#00FF97" offset="100%"></stop> - </linearGradient> - <linearGradient - x1="100%" - y1="98.9231419%" - x2="100%" - y2="0%" - id="linearGradient-35" - > - <stop stopColor="#79FFEF" offset="0%"></stop> - <stop stopColor="#35FFAD" offset="100%"></stop> - </linearGradient> - <linearGradient - x1="100%" - y1="98.9231419%" - x2="100%" - y2="0%" - id="linearGradient-36" - > - <stop stopColor="#79FFEF" offset="0%"></stop> - <stop stopColor="#35FFAD" offset="100%"></stop> - </linearGradient> - <linearGradient - x1="100%" - y1="98.9231419%" - x2="100%" - y2="0%" - id="linearGradient-37" - > - <stop stopColor="#79FFEF" offset="0%"></stop> - <stop stopColor="#35FFAD" offset="100%"></stop> - </linearGradient> - <circle id="path-41" cx="65.5" cy="65.5" r="32.5"></circle> - <linearGradient - x1="50%" - y1="3.85364977%" - x2="50%" - y2="89.6029946%" - id="linearGradient-50" - > - <stop stopColor="rgba(255, 255, 255, 0.12)" offset="0%"></stop> - <stop stopColor="rgba(255, 255, 255, 0.12)" offset="100%"></stop> - </linearGradient> - <linearGradient - x1="100%" - y1="50%" - x2="0%" - y2="50%" - id="linearGradient-51" - > - <stop stopColor="rgba(255, 255, 255, 0.12)" offset="0%"></stop> - <stop stopColor="rgba(255, 255, 255, 0.12)" offset="100%"></stop> - </linearGradient> - <linearGradient - x1="85.7700904%" - y1="92.3103523%" - x2="0%" - y2="34.9608269%" - id="linearGradient-52" - > - <stop stopColor="rgba(255, 255, 255, 0.12)" offset="0%"></stop> - <stop stopColor="rgba(255, 255, 255, 0.12)" offset="100%"></stop> - </linearGradient> - <linearGradient - x1="50%" - y1="100%" - x2="50%" - y2="0%" - id="linearGradient-53" - > - <stop stopColor="#FF41F9" offset="0%"></stop> - <stop stopColor="#00FFCA" offset="100%"></stop> - </linearGradient> - <path - d="M63,34 C74.045695,34 83,42.954305 83,54 C83,61.3637967 76.3333333,71.3637967 63,84 C49.6666667,71.3637967 43,61.3637967 43,54 C43,42.954305 51.954305,34 63,34 Z M63,39.8333333 C55.175966,39.8333333 48.8333333,46.1480369 48.8333333,53.9376185 C48.8333333,58.572673 53.4703894,66.0292388 63,75.6666667 L63,75.6666667 L63.4297955,75.230106 C72.669063,65.80393 77.1666667,58.5024449 77.1666667,53.9376185 C77.1666667,46.1480369 70.824034,39.8333333 63,39.8333333 Z M63,47 C66.3137085,47 69,49.6862915 69,53 C69,56.3137085 66.3137085,59 63,59 C59.6862915,59 57,56.3137085 57,53 C57,49.6862915 59.6862915,47 63,47 Z" - id="path-54" - ></path> - <linearGradient - id="arc-gradient1" - x1="0" - x2="0.3" - y1="0" - y2="1" - gradientTransform="rotate(-90)" - > - <stop offset="0%" stopColor="rgb(154, 104, 255)" stopOpacity="1" />\ - <stop - offset="100%" - stopColor="rgb(255, 145, 253)" - stopOpacity="1" - /> - </linearGradient> - <linearGradient - id="arc-gradient2" - x1="0" - x2="0" - y1="0" - y2="1" - gradientTransform="rotate(30)" - > - <stop offset="0%" stopColor="rgb(68, 17, 215)" stopOpacity="0.16" /> - <stop offset="100%" stopColor="rgb(230, 54, 255)" stopOpacity="1" /> - </linearGradient> - <filter - id="arc-filter1" - x="-100%" - y="-100%" - width="400%" - height="400%" - > - <feOffset result="offOut" in="SourceGraphic" dx="-5" dy="-5" /> - <feColorMatrix - result="matrixOut" - in="offOut" - type="matrix" - values="0.463 0 0 0 0 0 0.110 0 0 0 0 0 0.922 0 0 0 0 0 0.2 0" - /> - <feGaussianBlur result="blurOut" in="matrixOut" stdDeviation="20" /> - <feBlend in="SourceGraphic" in2="blurOut" mode="normal" /> - </filter> - <filter id="arc-filter2" x="-50%" y="-50%" width="250%" height="250%"> - <feOffset result="offOut" in="SourceGraphic" dx="5" dy="5" /> - <feGaussianBlur result="blurOut" in="offOut" stdDeviation="10" /> - <feBlend in="SourceGraphic" in2="blurOut" mode="normal" /> - </filter> - <filter - x="-300.0%" - y="-220.0%" - width="700.0%" - height="700.0%" - filterUnits="objectBoundingBox" - id="filter-81" - > - <feMorphology - radius="1" - operator="dilate" - in="SourceAlpha" - result="shadowSpreadOuter1" - ></feMorphology> - <feOffset - dx="0" - dy="4" - in="shadowSpreadOuter1" - result="shadowOffsetOuter1" - ></feOffset> - <feGaussianBlur - stdDeviation="4" - in="shadowOffsetOuter1" - result="shadowBlurOuter1" - ></feGaussianBlur> - <feComposite - in="shadowBlurOuter1" - in2="SourceAlpha" - operator="out" - result="shadowBlurOuter1" - ></feComposite> - <feColorMatrix - values="0 0 0 0 0.538230561 0 0 0 0 0.163202963 0 0 0 0 0.817963089 0 0 0 0.229758523 0" - type="matrix" - in="shadowBlurOuter1" - ></feColorMatrix> - </filter> - <filter - x="-300.0%" - y="-220.0%" - width="700.0%" - height="700.0%" - filterUnits="objectBoundingBox" - id="filter-83" - > - <feMorphology - radius="1" - operator="dilate" - in="SourceAlpha" - result="shadowSpreadOuter1" - ></feMorphology> - <feOffset - dx="0" - dy="4" - in="shadowSpreadOuter1" - result="shadowOffsetOuter1" - ></feOffset> - <feGaussianBlur - stdDeviation="4" - in="shadowOffsetOuter1" - result="shadowBlurOuter1" - ></feGaussianBlur> - <feComposite - in="shadowBlurOuter1" - in2="SourceAlpha" - operator="out" - result="shadowBlurOuter1" - ></feComposite> - <feColorMatrix - values="0 0 0 0 0.538230561 0 0 0 0 0.163202963 0 0 0 0 0.817963089 0 0 0 0.229758523 0" - type="matrix" - in="shadowBlurOuter1" - ></feColorMatrix> - </filter> - <filter - x="-300.0%" - y="-220.0%" - width="700.0%" - height="700.0%" - filterUnits="objectBoundingBox" - id="filter-85" - > - <feMorphology - radius="1" - operator="dilate" - in="SourceAlpha" - result="shadowSpreadOuter1" - ></feMorphology> - <feOffset - dx="0" - dy="4" - in="shadowSpreadOuter1" - result="shadowOffsetOuter1" - ></feOffset> - <feGaussianBlur - stdDeviation="4" - in="shadowOffsetOuter1" - result="shadowBlurOuter1" - ></feGaussianBlur> - <feComposite - in="shadowBlurOuter1" - in2="SourceAlpha" - operator="out" - result="shadowBlurOuter1" - ></feComposite> - <feColorMatrix - values="0 0 0 0 0.538230561 0 0 0 0 0.163202963 0 0 0 0 0.817963089 0 0 0 0.229758523 0" - type="matrix" - in="shadowBlurOuter1" - ></feColorMatrix> - </filter> - <filter - x="-300.0%" - y="-220.0%" - width="700.0%" - height="700.0%" - filterUnits="objectBoundingBox" - id="filter-87" - > - <feMorphology - radius="1" - operator="dilate" - in="SourceAlpha" - result="shadowSpreadOuter1" - ></feMorphology> - <feOffset - dx="0" - dy="4" - in="shadowSpreadOuter1" - result="shadowOffsetOuter1" - ></feOffset> - <feGaussianBlur - stdDeviation="4" - in="shadowOffsetOuter1" - result="shadowBlurOuter1" - ></feGaussianBlur> - <feComposite - in="shadowBlurOuter1" - in2="SourceAlpha" - operator="out" - result="shadowBlurOuter1" - ></feComposite> - <feColorMatrix - values="0 0 0 0 0.538230561 0 0 0 0 0.163202963 0 0 0 0 0.817963089 0 0 0 0.229758523 0" - type="matrix" - in="shadowBlurOuter1" - ></feColorMatrix> - </filter> - <filter - x="-300.0%" - y="-220.0%" - width="700.0%" - height="700.0%" - filterUnits="objectBoundingBox" - id="filter-89" - > - <feMorphology - radius="1" - operator="dilate" - in="SourceAlpha" - result="shadowSpreadOuter1" - ></feMorphology> - <feOffset - dx="0" - dy="4" - in="shadowSpreadOuter1" - result="shadowOffsetOuter1" - ></feOffset> - <feGaussianBlur - stdDeviation="4" - in="shadowOffsetOuter1" - result="shadowBlurOuter1" - ></feGaussianBlur> - <feComposite - in="shadowBlurOuter1" - in2="SourceAlpha" - operator="out" - result="shadowBlurOuter1" - ></feComposite> - <feColorMatrix - values="0 0 0 0 0.538230561 0 0 0 0 0.163202963 0 0 0 0 0.817963089 0 0 0 0.229758523 0" - type="matrix" - in="shadowBlurOuter1" - ></feColorMatrix> - </filter> - <radialGradient - id="block5-gradient" - fx="50%" - fy="50%" - cx="50%" - cy="50%" - r="90%" - > - <stop stopOpacity="1" stopColor="#FFDBB8" offset="0%" /> - <stop stopOpacity="1" stopColor="#FFD341" offset="100%" /> - </radialGradient> - <filter id="rect-shadow" x="-50%" y="-50%" width="300%" height="300%"> - <feOffset result="offOut" in="SourceGraphic" dx="10" dy="10" /> - <feColorMatrix - result="matrixOut" - in="offOut" - type="matrix" - values="0.192 0 0 0 0 0 0.275 0 0 0 0 0 0.349 0 0 0 0 0 0.1 0" - /> - <feGaussianBlur result="blurOut" in="matrixOut" stdDeviation="10" /> - <feBlend in="SourceGraphic" in2="blurOut" mode="normal" /> - </filter> - </defs> - <g - id="Ant-V-PC-定稿-1101" - transform="translate(-711.000000, -100.000000)" - stroke="none" - strokeWidth="1" - fill="none" - fillRule="evenodd" - > - <g id="banner-svg" transform="translate(779.000000, 127.000000)"> - <g id="backs" transform="translate(209.000000, 0.000000)"> - <rect - id="back-lefttop-small" - stroke="#EBE1FB" - opacity="0.503348214" - x="257.5" - y="145.5" - width="206" - height="172" - transform="translate(-90.000000, -150.000000)" - ></rect> - <rect - id="back-righttop" - stroke="#EBE1FB" - opacity="0.293619792" - x="235.5" - y="0.5" - width="527" - height="451" - transform="translate(-320.000000, -180.000000)" - ></rect> - <path - id="back-fan" - d="M0.500015456,334.512545 L0.507890624,586.5 L252.499521,586.5 C252.235652,448.831454 143.017682,336.763448 7.1430388,334.533878 L3.01314849,334.5 C2.17494966,334.5 1.33723221,334.504183 0.500015456,334.512545 Z" - stroke="#EBE1FB" - opacity="0.503348214" - transform="translate(-285.000000, -172.000000)" - ></path> - <image - xlinkHref="https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*aRK0RKcWMzEAAAAAAAAAAABkARQnAQ" - width="120px" - height="120px" - x="0px" - y="350px" - /> - <rect - id="back-rect1" - fill="url(#back-rect1-gradient)" - x="290" - y="424" - width="21" - height="21" - > - <animate - attributeName="y" - from="424" - to="424" - begin="0s" - dur="10s" - values="424;440;424" - keySplines="0.5 0.8 0.6 1; 0.5 0.8 0.6 1;" - keyTimes="0;0.5;1" - calcMode="spline" - repeatCount="indefinite" - /> - </rect> - <rect - id="back-rect2" - fill="#ffffff" - filter="url(#rect-shadow)" - x="312" - y="445" - width="28" - height="28" - > - <animate - attributeName="y" - from="445" - to="445" - begin="0s" - dur="10s" - values="445;430;445" - keySplines="0.5 0.8 0.6 1; 0.5 0.8 0.6 1;" - keyTimes="0;0.5;1" - calcMode="spline" - repeatCount="indefinite" - /> - </rect> - <circle - id="back-circle" - fill="#EEEBFD" - cx="205.5" - cy="431.5" - r="1.5" - ></circle> - <rect - id="back-rect-top" - fill="#ffffff" - filter="url(#rect-shadow)" - x="39" - y="0" - width="24" - height="24" - > - <animate - attributeName="y" - from="0" - to="0" - begin="0s" - dur="8s" - values="0;20;0" - keySplines="0.5 0.8 0.6 1; 0.5 0.8 0.6 1;" - keyTimes="0;0.5;1" - calcMode="spline" - repeatCount="indefinite" - /> - </rect> - </g> - <g id="block6" transform="translate(131.000000, 218.000000)"> - <image - id="block6Back" - xlinkHref="https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*zzQTRZPLhIgAAAAAAAAAAABkARQnAQ" - width="265px" - height="265px" - x="-56px" - y="-35px" - /> - <g - id="block6-nodes" - className={ - props.play - ? styles.block6NodesContainer - : 'block6NodesContainerStatic' - } - > - {getBlock6Circles()} - </g> - </g> - <g id="block2" transform="translate(185.000000, 118.000000)"> - <image - id="block2Back" - xlinkHref="https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*JikGQZ3gmKsAAAAAAAAAAABkARQnAQ" - width="236px" - height="236px" - x="-69px" - y="-30px" - /> - <g id="block2-bars" transform="translate(25.000000, 27.000000)"> - <rect - id="block2-bar1" - className={ - props.play ? styles.block2Bar1 : 'block2Bar1Static' - } - fill="url(#linearGradient-27)" - x="0" - y="0" - width="27" - height="6" - ></rect> - <rect - id="block2-bar2" - className={ - props.play ? styles.block2Bar2 : 'block2Bar2Static' - } - fill="url(#linearGradient-28)" - x="0" - y="12" - width="44" - height="6" - ></rect> - <rect - id="block2-bar3" - className={ - props.play ? styles.block2Bar3 : 'block2Bar3Static' - } - fill="url(#linearGradient-29)" - x="0" - y="24" - width="17" - height="6" - ></rect> - <rect - id="block2-bar4" - className={ - props.play ? styles.block2Bar4 : 'block2Bar4Static' - } - fill="url(#linearGradient-30)" - x="0" - y="36" - width="34" - height="6" - ></rect> - </g> - </g> - <g id="block8" transform="translate(385.000000, 218.000000)"> - <image - id="block8-back" - xlinkHref="https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Vo-SR4jzAy8AAAAAAAAAAABkARQnAQ" - width="235px" - height="235px" - x="-55px" - y="-40px" - /> - <g id="block8-bars" transform="translate(54.000000, 40.000000)"> - <rect - id="block8-bar2" - className={ - props.play ? styles.block8Bar2 : 'block8Bar2Static' - } - fill="url(#linearGradient-35)" - x="12" - y="0" - width="6" - height="33.75" - ></rect> - <rect - id="block8-bar1" - className={ - props.play ? styles.block8Bar1 : 'block8Bar1Static' - } - fill="url(#linearGradient-36)" - x="0" - y="10" - width="6" - height="23.75" - ></rect> - <rect - id="block8-bar3" - className={ - props.play ? styles.block8Bar3 : 'block8Bar3Static' - } - fill="url(#linearGradient-37)" - x="24" - y="17" - width="6" - height="16.875" - ></rect> - </g> - </g> - <g id="block5" transform="translate(0.000000, 218.000000)"> - <image - id="block5Back" - xlinkHref="https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*KpT9QrpQ4ZgAAAAAAAAAAABkARQnAQ" - width="268px" - height="268px" - x="-69px" - y="-30px" - /> - - <g id="block5-circle" opacity="0.326241629"> - <use - fill="#F4E7FF" - fillRule="evenodd" - xlinkHref="#path-41" - ></use> - </g> - <path - id="block5-fan" - className={props.play ? styles.block5Fan : 'block5FanStatic'} - stroke="url(#block5-gradient)" - strokeWidth="32.5" - strokeDasharray="207.24" - strokeDashoffset="193.5" // - d="M65.5,49 C74.336556,49 81.5,56.3873016 81.5,65.5 C81.5,70.0566032 79.7089393,74.1818092 76.8132242,77.1677613" - ></path> - </g> - <g id="block4" transform="translate(439.000000, 92.000000)"> - <image - id="block4Back" - xlinkHref="https://gw.alipayobjects.com/zos/antfincdn/p%24tXf8w8p5/location.png" - width="260px" - height="260px" - x="-68px" - y="-29px" - /> - <g id="block4-front-back" mask="url(#mask-47)"> - <g transform="translate(64.994468, 55.918147) rotate(10.000000) translate(-64.994468, -55.918147) translate(-40.505532, -50.081853)"> - <rect - id="block4-back-line-verti" - className={ - props.play - ? styles.block4LineVerti - : 'block4LineVertiStatic' - } - fill="url(#linearGradient-50)" - x="64" - y="20" - width="4" - height="192" - ></rect> - <rect - id="block4-back-line-hori" - className={ - props.play - ? styles.block4LineHori - : 'block4LineHoriStatic' - } - fill="url(#linearGradient-51)" - x="-1.36424205e-11" - y="151" - width="202" - height="4" - ></rect> - <path - id="block4-back-circle" - className={ - props.play ? styles.block4Circle : 'block4CircleStatic' - } - stroke="url(#linearGradient-52)" - opacity="0.545549665" - strokeDasharray="132" - strokeWidth="5" - d="M111.248537,49.2552483 C107.33563,82.1953597 146.587514,105.361957 164.688607,98.6513257" - ></path> - </g> - </g> - </g> - <g id="blcok7" transform="translate(285.000000, 218.000000)"> - <image - id="block7-back" - xlinkHref="https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*62E-Qa78EmMAAAAAAAAAAABkARQnAQ" - width="235px" - height="235px" - x="-68px" - y="-30px" - /> - <path - id="block7-curve" - className={ - props.play ? styles.block7Curve : 'block7CurveStatic' - } - strokeDasharray="90" - d="M36,65 C52.5685425,65 66,51.5685425 66,35" - stroke="#9655FE" - ></path> - </g> - <g id="block3" transform="translate(285.000000, 64.000000)"> - <image - id="block3Back" - xlinkHref="https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*6vbkRapOLegAAAAAAAAAAABkARQnAQ" - width="250px" - height="250px" - x="-48px" - y="-22px" - /> - <g id="block3-arcs" transform="translate(33.000000, 33.000000)"> - <circle - id="block3-arc-big" - className={ - props.play ? styles.block3ArcBig : 'block3ArcBigStatic' - } - fill="none" - stroke="url(#arc-gradient1)" - filter="url(#arc-filter1)" - strokeWidth="18" - strokeMiterlimit="1" - cx="45" - cy="45" - r="35" - strokeDasharray="201" - strokeDashoffset="36" - transform="rotate(-180 45 45)" - ></circle> - <circle - id="block3-arc-small" - className={ - props.play ? styles.block3ArcSmall : 'block3ArcSmallStatic' - } - fill="none" - stroke="url(#arc-gradient2)" - filter="url(#arc-filter2)" - strokeWidth="13" - strokeMiterlimit="1" - cx="45" - cy="45" - r="25" - strokeDasharray="123.6 1000" - strokeDashoffset="6" - transform="rotate(0 45 45)" - ></circle> - </g> - </g> - <g id="block1" transform="translate(63.000000, 96.000000)"> - <image - id="block1Back" - xlinkHref="https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*AtjkSai-KUAAAAAAAAAAAABkARQnAQ" - width="216px" - height="216px" - x="-48px" - y="-21px" - /> - <g - id="block1-circles" - transform="translate(27.000000, 34.000000)" - onMouseEnter={mouseEnterBlock1} - onMouseOut={mouseOutBlock1} - > - <circle - id="block1-circle1-shadow" - className={ - props.play ? styles.block1Circle1 : 'block1Circle1Static' - } - filter="url(#filter-81)" - stroke="#8D3FFD" - strokeWidth="1" - fill="#FFFFFF" - fillRule="evenodd" - cx="2.5" - cy="30" - r="3" - ></circle> - <circle - id="block1-circle1-object" - className={ - props.play ? styles.block1Circle1 : 'block1Circle1Static' - } - stroke="#8D3FFD" - strokeWidth="1" - fill="#FFFFFF" - fillRule="evenodd" - cx="2.5" - cy="30" - r="3" - ></circle> - - <circle - id="block1-circle2-shadow" - className={ - props.play ? styles.block1Circle2 : 'block1Circle2Static' - } - filter="url(#filter-83)" - stroke="#8D3FFD" - strokeWidth="1" - fill="#FFFFFF" - fillRule="evenodd" - cx="18.5" - cy="15" - r="3" - ></circle> - <circle - id="block1-circle2-object" - className={ - props.play ? styles.block1Circle2 : 'block1Circle2Static' - } - stroke="#8D3FFD" - strokeWidth="1" - fill="#FFFFFF" - fillRule="evenodd" - cx="18.5" - cy="15" - r="3" - ></circle> - - <circle - id="block1-circle3-shadow" - className={ - props.play ? styles.block1Circle3 : 'block1Circle3Static' - } - filter="url(#filter-85)" - stroke="#8D3FFD" - strokeWidth="1" - fill="#FFFFFF" - fillRule="evenodd" - cx="34.5" - cy="30" - r="3" - ></circle> - <circle - id="block1-circle3-object" - className={ - props.play ? styles.block1Circle3 : 'block1Circle3Static' - } - stroke="#8D3FFD" - strokeWidth="1" - fill="#FFFFFF" - fillRule="evenodd" - cx="34.5" - cy="30" - r="3" - ></circle> - - <circle - id="block1-circle4-shadow" - className={ - props.play ? styles.block1Circle4 : 'block1Circle4Static' - } - filter="url(#filter-87)" - stroke="#8D3FFD" - strokeWidth="1" - fill="#FFFFFF" - fillRule="evenodd" - cx="50.5" - cy="45" - r="3" - ></circle> - <circle - id="block1-circle4-object" - className={ - props.play ? styles.block1Circle4 : 'block1Circle4Static' - } - stroke="#8D3FFD" - strokeWidth="1" - fill="#FFFFFF" - fillRule="evenodd" - cx="50.5" - cy="45" - r="3" - ></circle> - - <circle - id="block1-circle5-shadow" - className={ - props.play ? styles.block1Circle5 : 'block1Circle5Static' - } - filter="url(#filter-89)" - stroke="#8D3FFD" - strokeWidth="1" - fill="#FFFFFF" - fillRule="evenodd" - cx="66.5" - cy="30" - r="3" - ></circle> - <circle - id="block1-circle5-object" - className={ - props.play ? styles.block1Circle5 : 'block1Circle5Static' - } - stroke="#8D3FFD" - strokeWidth="1" - fill="#FFFFFF" - fillRule="evenodd" - cx="66.5" - cy="30" - r="3" - ></circle> - </g> - </g> - </g> - </g> - - {/* <path - onMouseEnter={mouseEnterBlock2} - onMouseOut={mouseOutBlock2} - d="M252,145 L252,245 L352,245 L352,145 Z" - opacity="0" - id="block2listener" - ></path> - <path - onMouseEnter={mouseEnterBlock3} - onMouseOut={mouseOutBlock3} - d="M352,90 L352,245 L507,245 L507,90 Z" - opacity="0" - id="block3listener" - ></path> - <path - onMouseEnter={mouseEnterBlock4} - onMouseOut={mouseOutBlock4} - d="M507,120 L507,245 L632,245 L632,120 Z" - opacity="0" - id="block4listener" - ></path> - <path - onMouseEnter={mouseEnterBlock5} - onMouseOut={mouseOutBlock5} - d="M67,245 L67,378 L199,378 L199,245 Z" - opacity="0" - id="block5listener" - ></path> - <path - onMouseEnter={mouseEnterBlock6} - onMouseOut={mouseOutBlock6} - d="M199,245 L199,398 L353,398 L353,245 Z" - opacity="0" - id="block6listener" - ></path> - <path - onMouseEnter={mouseEnterBlock7} - onMouseOut={mouseOutBlock7} - d="M353,245 L353,345 L453,345 L453,245 Z" - opacity="0" - id="block7listener" - ></path> - <path - onMouseEnter={mouseEnterBlock8} - onMouseOut={mouseOutBlock8} - d="M453,245 L453,380 L583,380 L583,245 Z" - opacity="0" - id="block8listener" - ></path> */} - </svg> - </section> - ); -}; - -export default BannerSVG; diff --git a/site/components/common/ActiveIcon/index.module.less b/site/components/common/ActiveIcon/index.module.less deleted file mode 100644 index cb97f0106..000000000 --- a/site/components/common/ActiveIcon/index.module.less +++ /dev/null @@ -1,24 +0,0 @@ -.activeIcon { - display: inline-flex; - align-items: center; - justify-content: center; - color: #000; - - > img { - margin-right: 6px; - } - - .active { - display: none; - } - - &:hover { - .inactive { - display: none; - } - - .active { - display: block; - } - } -} diff --git a/site/components/common/ActiveIcon/index.tsx b/site/components/common/ActiveIcon/index.tsx deleted file mode 100644 index 06d8ae26d..000000000 --- a/site/components/common/ActiveIcon/index.tsx +++ /dev/null @@ -1,30 +0,0 @@ -import classNames from 'classnames'; -import React from 'react'; - -import styles from './index.module.less'; - -type ActiveIconProps = { - img: string; - activeImg: string; - className: string; - text: string; - href?: string; - target?: string; -}; - -// 公共跳转按钮 -export default function ActiveIcon(props: ActiveIconProps) { - const { img, activeImg, className, text, href, target } = props; - - return ( - <a - className={classNames(className, styles.activeIcon)} - href={href} - target={target} - > - <img className={styles.inactive} src={img} alt="inactive_icon" /> - <img className={styles.active} src={activeImg} alt="active_icon" /> - {text} - </a> - ); -} diff --git a/site/components/common/ModuleTitle/index.module.less b/site/components/common/ModuleTitle/index.module.less deleted file mode 100644 index 4d606858a..000000000 --- a/site/components/common/ModuleTitle/index.module.less +++ /dev/null @@ -1,23 +0,0 @@ -.msg { - display: flex; - align-items: center; - justify-content: center; - flex-direction: column; - - .title { - height: 48px; - font-size: 40px; - color: #1d2129; - margin-bottom: 16px; - font-family: AlibabaPuHuiTiB; - } - - .subTitle { - font-family: PingFangSC; - color: #424e66; - letter-spacing: 0; - line-height: 24px; - margin-bottom: 32px; - max-width: 800px; - } -} diff --git a/site/components/common/ModuleTitle/index.tsx b/site/components/common/ModuleTitle/index.tsx deleted file mode 100644 index 825413b67..000000000 --- a/site/components/common/ModuleTitle/index.tsx +++ /dev/null @@ -1,19 +0,0 @@ -import React from 'react'; - -import styles from './index.module.less'; - -type ModuleTitleProps = { - title: string; - subTitle?: string; -}; - -// 公共标题 -export default function ModuleTitle(props: ModuleTitleProps) { - const { title, subTitle } = props; - return ( - <div className={styles.msg}> - <div className={styles.title}>{title}</div> - {subTitle && <div className={styles.subTitle}>{subTitle}</div>} - </div> - ); -} diff --git a/site/components/common/OverflowedText/index.less b/site/components/common/OverflowedText/index.less deleted file mode 100644 index d60b09492..000000000 --- a/site/components/common/OverflowedText/index.less +++ /dev/null @@ -1,12 +0,0 @@ -@import './mixins.less'; - -.component-overflowed-text { - max-width: 100px; - .text-overflow(); - - &.max-height-text { - white-space: normal; - max-width: none; - word-break: break-all; - } -} diff --git a/site/components/common/OverflowedText/index.tsx b/site/components/common/OverflowedText/index.tsx deleted file mode 100644 index 6dff6bde8..000000000 --- a/site/components/common/OverflowedText/index.tsx +++ /dev/null @@ -1,117 +0,0 @@ -import { ConfigProvider, Tooltip } from 'antd'; -import cx from 'classnames'; -import { isNumber, isString, omit, toNumber } from 'lodash'; -import React, { PureComponent } from 'react'; - -import './index.less'; - -type Props = { - className: string; - text: string; - maxWidth: string | number; - maxHeight?: string | number; - style?: Record<string, any>; -}; - -const getPixel = (value: string | number) => { - if (isNumber(value)) return `${value}px`; - return value; -}; - -const getNumber = (value: string | number) => { - if (isString(value)) return toNumber(value.replace(/[^0-9]+/, '')); - return value; -}; - -// 自动省略并提示组件 -export class OverflowedText extends PureComponent<Props> { - static defaultProps = { - className: '', - text: 'overflowed text', - maxWidth: '100px', - style: {}, - }; - - state = { - isOverflow: false, - }; - - componentDidUpdate(prevProps: Props) { - if ( - prevProps.text !== this.props.text || - prevProps.maxWidth !== this.props.maxWidth || - prevProps.maxHeight !== this.props.maxHeight || - prevProps.style !== this.props.style - ) { - // @ts-ignore - this.init(this.$text); - } - } - - init = (node: HTMLDivElement) => { - // @ts-ignore - this.$text = node; - if (!node) return; - const { maxHeight } = this.props; - this.setState({ - isOverflow: maxHeight - ? node.scrollHeight > node.offsetHeight - : node.scrollWidth > node.offsetWidth, - }); - }; - - render() { - const { text, className, maxWidth, maxHeight, style = {} } = this.props; - const { fontSize, lineHeight } = style; - const props = omit(this.props, [ - 'className', - 'text', - 'maxWidth', - 'maxHeight', - 'style', - 'width', - ]); - const cls = cx( - 'component-overflowed-text', - className, - maxHeight && 'max-height-text', - ); - - let textStyle: Record<string, string> = { - maxWidth: getPixel(maxWidth), - ...style, - }; - // 最大高度 转化为 行数, 需要 fontSize, lineHeight 属性 - if (maxHeight && fontSize && lineHeight) { - const lineHeightSize = getNumber(fontSize) * lineHeight; - textStyle = { - ...textStyle, - maxWidth: 'none', - display: '-webkit-box', - '-webkitBoxOrient': 'vertical', - '-webkitLineClamp': ( - Math.max(getNumber(maxHeight), lineHeightSize) / lineHeightSize - ).toFixed(0), - }; - } - - return ( - <div className={cls} style={textStyle} ref={this.init}> - {this.state.isOverflow ? ( - <ConfigProvider prefixCls="antd5"> - <Tooltip - title={text} - placement="topLeft" - overlayStyle={{ maxWidth: '50vw' }} - {...props} - > - {text} - </Tooltip> - </ConfigProvider> - ) : ( - text - )} - </div> - ); - } -} diff --git a/site/components/common/OverflowedText/mixins.less b/site/components/common/OverflowedText/mixins.less deleted file mode 100644 index 5e1b82451..000000000 --- a/site/components/common/OverflowedText/mixins.less +++ /dev/null @@ -1,44 +0,0 @@ -.text-overflow() { - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; -} - -.transition-fast() { - transition: all 0.1s; -} - -.transition() { - transition: all 0.2s; -} - -.scroll-y() { - overflow: hidden; - overflow-y: auto; -} - -.childMiddle() { - display: flex; - align-items: center; - justify-content: center; -} - -.di-tooltip-inner() { - .ant-tooltip-inner { - max-height: 200px; - padding: 8px; - overflow-y: auto; - color: rgba(0, 0, 0, 0.65); - background: #fff; - box-shadow: 0 1px 12px rgba(0, 0, 0, 0.2); - } - .ant-tooltip-arrow { - border-top-color: #fff; - } -} - -.icon-extra () { - position: absolute; - top: -6px; - right: -8px; -} diff --git a/site/components/common/index.tsx b/site/components/common/index.tsx deleted file mode 100644 index a2b78a820..000000000 --- a/site/components/common/index.tsx +++ /dev/null @@ -1,5 +0,0 @@ -import ActiveIcon from './ActiveIcon'; -import ModuleTitle from './ModuleTitle'; -import { OverflowedText } from './OverflowedText'; - -export { ActiveIcon, ModuleTitle, OverflowedText }; diff --git a/site/components/quoteCard/quoteCard.module.less b/site/components/quoteCard/quoteCard.module.less deleted file mode 100644 index 547d00c40..000000000 --- a/site/components/quoteCard/quoteCard.module.less +++ /dev/null @@ -1,181 +0,0 @@ -.card { - background-color: #fff; - height: 100%; - margin-top: 0px; - transition: all 0.3s; - text-align: center; - .border { - position: absolute; - width: 2px; - height: 100%; - background: rgba(0, 0, 0, 0.01); - } - .lborder { - left: 0; - } - .rborder { - right: 0; - } - .content { - padding: 92px 7.96% 0 7.96%; - .avatar { - width: 94px; - height: 94px; - margin-top: -210px; - box-shadow: 5px 15px 30px rgba(0, 0, 0, 0.1); - } - .name { - font-size: 1.714rem; - color: #000; - margin-top: -20px; - margin-bottom: 0; - } - .from { - opacity: 0.6; - width: 100%; - color: rgba(105, 123, 140, 1); - font-size: 1.14em; - margin-top: 12px; - margin-bottom: 0; - } - .qslicer { - display: block; - position: absolute; - width: 28px; - height: 6px; - top: 236px; - left: 50%; - transform: translateX(-14px); - background: linear-gradient(25deg, rgb(181, 99, 243), rgb(67, 115, 246)); - } - .quoteWrapper { - width: 84.08%; - top: 278px; - position: absolute; - height: auto; - .quote { - position: relative; - line-height: 2em; - z-index: 10; - font-size: 1.29em; - color: rgba(49, 70, 89, 1); - } - .pad { - position: absolute; - width: 68px; - } - .leftpad { - left: 0%; - margin-top: -35px; - } - .rightpad { - right: 0%; - margin-top: -50px; - } - } - } -} - -@media (max-width: 1014px) { - .card { - height: auto; - .border { - display: none; - } - .content { - padding: 120px 20px 120px 20px; - .avatar { - margin-top: -270px; - } - .name { - top: 87px; - } - .from { - margin-top: 12px; - } - .qslicer { - margin-top: 48px; - top: 0; - position: relative; - } - .quoteWrapper { - position: relative; - margin-top: 58px; - top: 0; - width: 100%; - .pad { - width: 68px; - } - .leftpad { - left: 0; - margin-top: -3%; - } - .rightpad { - right: 0; - margin-top: -6%; - } - } - } - } -} - -@media (max-width: 768px) { - .card { - .content { - padding: 120px 20px 120px 20px; - .avatar { - width: 100px; - height: 100px; - } - .name { - font-size: 1.5em; - font-weight: 500; - } - .from { - font-size: 1em; - margin-top: 8px; - } - .qslicer { - width: 30px; - height: 7px; - transform: translateX(-15px); - } - .quoteWrapper { - .quote { - line-height: 40px; - font-size: 1.2em; - } - .pad { - position: absolute; - width: 70px; - } - .leftpad { - left: 0; - margin-top: -3%; - } - .rightpad { - right: 0; - margin-top: -10%; - } - } - } - } -} - -@media (max-width: 480px) { - .card { - .content { - .quoteWrapper { - .leftpad { - left: 5%; - margin-top: unset; - top: -14%; - } - .rightpad { - right: 5%; - margin-top: -16%; - } - } - } - } -} diff --git a/site/components/quoteCard/quoteCard.tsx b/site/components/quoteCard/quoteCard.tsx deleted file mode 100644 index 15ca77dac..000000000 --- a/site/components/quoteCard/quoteCard.tsx +++ /dev/null @@ -1,69 +0,0 @@ -import { Avatar } from 'antd'; -import classNames from 'classnames'; -import { useIntl } from 'dumi'; -import React from 'react'; -import styles from './quoteCard.module.less'; - -const leftpad = - 'https://gw.alipayobjects.com/zos/basement_prod/50fbdc16-bac3-4ecd-8210-f4ed2c116fdb.svg'; -const rightpad = - 'https://gw.alipayobjects.com/zos/basement_prod/194a96ef-be8c-4e51-85e1-69b34aa2a697.svg'; - -interface Props { - cardContent: { - avatar: string | undefined; - quote: string; - from: string; - name: string; - index: number; - nameEn: string; - fromEn: string; - quoteEn: string; - }; - hasBorder: boolean; -} - -const QuoteCard = (props: Props) => { - const intl = useIntl(); - - const useT = (transformedMessage: string) => { - return intl.formatMessage({ - id: transformedMessage, - }); - }; - const borderSlicer: Array<React.ReactNode> = []; - if (props.hasBorder) { - borderSlicer.push( - <div key={1} className={classNames(styles.border, styles.lborder)} />, - ); - borderSlicer.push( - <div key={2} className={classNames(styles.border, styles.rborder)} />, - ); - } - return ( - <div className={styles.card}> - {borderSlicer} - <div className={styles.content}> - <Avatar src={props.cardContent.avatar} className={styles.avatar} /> - <p className={styles.name}>{useT(props.cardContent.name)}</p> - <p className={styles.from}>{useT(props.cardContent.from)}</p> - <div className={styles.qslicer} /> - <div className={styles.quoteWrapper}> - <img - className={classNames(styles.pad, styles.leftpad)} - src={leftpad} - alt="leftpad" - /> - <p className={styles.quote}>{useT(props.cardContent.quote)}</p> - <img - className={classNames(styles.pad, styles.rightpad)} - src={rightpad} - alt="rightpad" - /> - </div> - </div> - </div> - ); -}; - -export default QuoteCard; diff --git a/site/data/banner-info.json b/site/data/banner-info.json deleted file mode 100644 index 5fc087b6e..000000000 --- a/site/data/banner-info.json +++ /dev/null @@ -1,593 +0,0 @@ -{ - "about": { - "name": "About", - "title": "关于我们", - "info": "我们是蚂蚁集团数据可视化团队,一群有爱有梦的人,怀揣「让人们在数据世界里获得视觉化思考能力」的梦想前行,成就智能时代全球领先的数据可视化解决方案。", - "banner_img": "https://gw.alipayobjects.com/zos/bmw-prod/84f7b424-2003-452d-b9ff-e8c829095ebb.svg", - "banner_url": "/about" - }, - "products_tabs": [ - { - "name": "G2 | G2Plot", - "products": ["G2", "G2Plot"], - "demos": [ - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_f5c722/afts/img/A*WmOcQafphvEAAAAAAAAAAABkARQnAQ", - "title_zh": "动态条形图", - "title_en": "Dynamtic bar", - "host": "https://g2.antv.antgroup.com/", - "path": "/examples/case/dynamic#dynamic-bar", - "ratio": 1.3 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_d314dd/afts/img/A*kHHZQa-fpAQAAAAAAAAAAAAAARQnAQ", - "title_zh": "指标卡联动", - "title_en": "Dynamtic bar", - "host": "https://g2plot.antv.antgroup.com/", - "path": "/examples/case/statistical-scenario#trend", - "ratio": 1.3 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_d314dd/afts/img/A*5fg3Q7n3tFEAAAAAAAAAAAAAARQnAQ", - "title_zh": "自定义 Tooltip", - "title_en": "Custom tooltip", - "host": "https://g2plot.antv.antgroup.com/", - "path": "/examples/case/customize#customize-tooltip", - "ratio": 1.3 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_d314dd/afts/img/A*DIzzR6M4T94AAAAAAAAAAAAAARQnAQ", - "title_zh": "水波图", - "title_en": "Liquid charts", - "host": "https://g2plot.antv.antgroup.com/", - "path": "/examples/progress-plots/liquid#basic#style", - "ratio": 1.3 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_d314dd/afts/img/A*-9CLRItZrPMAAAAAAAAAAAAAARQnAQ", - "title_zh": "基础条形图 - 转化率", - "title_en": "Bar plot conversion tag", - "host": "https://g2plot.antv.antgroup.com/", - "path": "/examples/bar/basic#conversion-tag", - "ratio": 1.3 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_d314dd/afts/img/A*uKKQQ4Xc3GMAAAAAAAAAAAAAARQnAQ", - "title_zh": "瀑布图 - 数值标签展示绝对值", - "title_en": "Waterfall plot with absolute-label-dataMode", - "host": "https://g2plot.antv.antgroup.com/", - "path": "/examples/more-plots/waterfall/#absolute-label", - "ratio": 1.3 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_d314dd/afts/img/A*tdedT4uaPaYAAAAAAAAAAABkARQnAQ", - "title_zh": "四象限散点图", - "title_en": "Scatter with quadrants", - "host": "https://g2plot.antv.antgroup.com/", - "path": "/examples/scatter/bubble/#quadrant", - "ratio": 1.3 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_2274c3/afts/img/A*gS12TpN1MN8AAAAAAAAAAAAAARQnAQ", - "title_zh": "对比漏斗图", - "title_en": "Compare funnel", - "host": "https://g2plot.antv.antgroup.com/", - "path": "/examples/case/statistical-scenario#compare-funnel", - "ratio": 1.3 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_2274c3/afts/img/A*CcFlQ7se_sAAAAAAAAAAAABkARQnAQ", - "title_zh": "2016 年全球十大转基因作物种植面积和耕地总", - "title_en": "Row facet", - "host": "https://g2.antv.antgroup.com/", - "path": "/examples/case/facet#facet3", - "ratio": 1.3 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_f5c722/afts/img/A*id4CSZIMCtsAAAAAAAAAAABkARQnAQ", - "title_zh": "词云图-图片遮罩", - "title_en": "Word cloud plot - image mask", - "host": "https://g2plot.antv.antgroup.com/", - "path": "/examples/more-plots/word-cloud/#image-mask", - "ratio": 1.3 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_d314dd/afts/img/A*d_LXSq9yXEYAAAAAAAAAAAAAARQnAQ", - "title_zh": "雷达图", - "title_en": "Area radar plot", - "host": "https://g2plot.antv.antgroup.com/", - "path": "/examples/more-plots/radar#basic", - "ratio": 1.3 - }, - - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_f5c722/afts/img/A*KDGDQLKrV_EAAAAAAAAAAABkARQnAQ", - "title_zh": "某水产公司 2017 年月盈利变化", - "title_en": "Month earnings", - "host": "https://g2.antv.antgroup.com/", - "path": "/examples/case/area#area2", - "ratio": 1.3 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_d314dd/afts/img/A*aiU7SpgRN48AAAAAAAAAAAAAARQnAQ", - "title_zh": "柱线混合图表-更多示例", - "title_en": "Other column line", - "host": "https://g2plot.antv.antgroup.com/", - "path": "/examples/dual-axes/column-line#demo-more-1", - "ratio": 1.3 - }, - { - "imgurl": "https://gw.alicdn.com/tfs/TB1EgtsuuT2gK0jSZFvXXXnFXXa-958-591.png", - "title_zh": "基础漏斗图-转置", - "title_en": "Funnel plot-transpose", - "host": "https://g2plot.antv.antgroup.com/", - "path": "/examples/more-plots/funnel#basic-transpose", - "ratio": 1.3 - } - ] - }, - { - "name": "S2", - "products": ["S2"], - "demos": [ - { - "imgurl": "https://gw.alipayobjects.com/zos/antfincdn/RYy4GI8Y8d/demo.gif", - "title_zh": "分群下钻表", - "title_en": "Group drill down sheet", - "host": "https://s2.antv.antgroup.com/", - "path": "/examples/case/proportion#group-drill-down", - "ratio": 1.3 - }, - { - "imgurl": "https://gw.alipayobjects.com/zos/antfincdn/BLitStN%24sR/196f5853-98cf-414f-af83-16b9c594c377.png", - "title_zh": "KPI 趋势表", - "title_en": "KPI StrategySheet", - "host": "https://s2.antv.antgroup.com/", - "path": "/examples/case/kpi-strategy#basic", - "ratio": 1.3 - }, - { - "imgurl": "https://gw.alipayobjects.com/zos/antfincdn/clsZ0BSxpR/c315b0f0-03df-46e6-b470-7894c7fa5b17.png", - "title_zh": "单人群占比表", - "title_en": "Single population proportion Sheet", - "host": "https://s2.antv.antgroup.com/", - "path": "/examples/case/proportion#single-population-proportion", - "ratio": 1.3 - }, - { - "imgurl": "https://gw.alipayobjects.com/zos/antfincdn/Hp592db5za/60960a3d-f405-4474-a412-95721a21654d.png", - "title_zh": "指标对比表", - "title_en": "Measure Comparison Sheet", - "host": "https://s2.antv.antgroup.com/", - "path": "/examples/case/comparison#measure-comparison", - "ratio": 1.3 - }, - { - "imgurl": "https://gw.alipayobjects.com/zos/antfincdn/GVz3yaFf5O/b57857b9-a307-474a-a418-c97f627311a1.png", - "title_zh": "多人群对比表", - "title_en": "Multiple People Comparison Sheet", - "host": "https://s2.antv.antgroup.com/", - "path": "/examples/case/comparison#multiple-people-comparison", - "ratio": 1.3 - } - ] - }, - { - "name": "G6 | Graphin", - "products": ["G6", "Graphin"], - "demos": [ - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*HS5gQ6yCiL4AAAAAAAAAAAAAARQnAQ", - "title_zh": "决策树", - "title_en": "Decision Tree", - "host": "https://g6.antv.vision/", - "path": "/examples/case/treeDemos#decisionTree", - "ratio": 1.46 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*e2nhTZPD0tUAAAAAAAAAAAAAARQnAQ", - "title_zh": "布局切换", - "title_en": "Layout Translate", - "host": "https://g6.antv.vision/", - "path": "/examples/net/layoutMechanism#layoutTranslate", - "ratio": 1.46 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*4TJ0Tq3IQUwAAAAAAAAAAAAAARQnAQ", - "title_zh": "环形弧线图", - "title_en": "Circular Arc Diagram", - "host": "https://g6.antv.vision/", - "path": "/examples/net/arcDiagram#circularArcDiagram", - "ratio": 1.46 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*CWOwQrSBZ9wAAAAAAAAAAAAAARQnAQ", - "title_zh": "圣诞推文可视化", - "title_en": "Christmas Bubbles", - "host": "https://g6.antv.vision/", - "path": "/examples/case/graphDemos/#christmasBubbles", - "ratio": 1.46 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*w-HGQa0EwKIAAAAAAAAAAAAAARQnAQ", - "title_zh": "鱼眼放大镜", - "title_en": "Fisheye Lens", - "host": "https://g6.antv.vision/", - "path": "/examples/tool/fisheye#fisheye", - "ratio": 1.46 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*R1W_Q4A9IgQAAAAAAAAAAAAAARQnAQ", - "title_zh": "高亮相关元素", - "title_en": "Highlight Related Items", - "host": "https://g6.antv.vision/", - "path": "/examples/interaction/highlight#activateRelations", - "ratio": 1.46 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*tXyfTqdwv6cAAAAAAAAAAAAAARQnAQ", - "title_zh": "边过滤镜", - "title_en": "Edge Lens", - "host": "https://g6.antv.vision/", - "path": "/examples/tool/edgeFilterLens#edgeFilter", - "ratio": 1.46 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*KooGTZ8vm6cAAAAAAAAAAAAAARQnAQ", - "title_zh": "轮廓包裹", - "title_en": "Hull", - "host": "https://g6.antv.vision/", - "path": "/examples/interaction/hull#hull", - "ratio": 1.46 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*MeduR4-vUfsAAAAAAAAAAAAAARQnAQ", - "title_zh": "力导向布局", - "title_en": "Force Layout", - "host": "https://g6.antv.vision/", - "path": "/examples/net/forceDirected#forceDirectedPreventOverlap", - "ratio": 1.46 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*IGKUSq0-_OwAAAAAAAAAAAAAARQnAQ", - "title_zh": "边状态动画", - "title_en": "Edge State Animation", - "host": "https://g6.antv.vision/", - "path": "/examples/scatter/stateChange#hover", - "ratio": 1.46 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*spLJT46-tB0AAAAAAAAAAAAAARQnAQ", - "title_zh": "自定义树样式", - "title_en": "Custom Tree Style", - "host": "https://g6.antv.vision/", - "path": "/examples/tree/compactBox#compactBoxLeftAlign", - "ratio": 1.46 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_402c1a/afts/img/A*suE6SoLi6twAAAAAAAAAAAAAARQnAQ", - "title_zh": "节点扩散", - "title_en": "Node Expand", - "host": "https://graphin.antv.vision/", - "path": "/examples/advanced/node-expand#Force", - "ratio": 1.46 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_402c1a/afts/img/A*piRgQ6aKczYAAAAAAAAAAAAAARQnAQ", - "title_zh": "节点扩散 不带动画", - "title_en": "Node Expand Without Animation", - "host": "https://graphin.antv.vision/", - "path": "/examples/advanced/node-expand#ForceWithoutAnimation", - "ratio": 1.46 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_402c1a/afts/img/A*tnPpQLWNvH4AAAAAAAAAAAAAARQnAQ", - "title_zh": "内置节点与边", - "title_en": "Built-in Nodes and Edges", - "host": "https://graphin.antv.vision/", - "path": "/examples/shape/node", - "ratio": 1.46 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_402c1a/afts/img/A*J7K9QLr9X80AAAAAAAAAAAAAARQnAQ", - "title_zh": "力导布局", - "title_en": "Force Layout", - "host": "https://graphin.antv.vision/", - "path": "/examples/layout/force", - "ratio": 1.46 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_402c1a/afts/img/A*2yeyQ6Nyos0AAAAAAAAAAAAAARQnAQ", - "title_zh": "布局切换", - "title_en": "Layout Switching", - "host": "https://graphin.antv.vision/", - "path": "examples/advanced/layout-switching", - "ratio": 1.46 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_402c1a/afts/img/A*YlWCRITHEbsAAAAAAAAAAAAAARQnAQ", - "title_zh": "关系发现", - "title_en": "Find Connection", - "host": "https://graphin.antv.vision/", - "path": "/examples/advanced/find-connections", - "ratio": 1.46 - } - ] - }, - { - "name": "X6 | XFlow", - "products": ["X6", "XFlow"], - "demos": [ - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_43231b/afts/img/A*W9g1S7W-TOoAAAAAAAAAAAAAARQnAQ", - "title_zh": "DAG", - "title_en": "DAG", - "location": "https://x6.antv.antgroup.com/apps/dag/", - "ratio": 1.4 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_43231b/afts/img/A*_0vpQ5sFL-8AAAAAAAAAAAAAARQnAQ", - "title_zh": "流程图", - "title_en": "Flow Chart", - "location": "https://x6.antv.antgroup.com/apps/draw/", - "ratio": 1.4 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_43231b/afts/img/A*AVRUSrPL_dEAAAAAAAAAAAAAARQnAQ", - "title_zh": "ER", - "title_en": "ER", - "location": "https://x6.antv.antgroup.com/apps/er/", - "ratio": 1.4 - } - ] - }, - { - "name": "L7 | L7Plot", - "products": ["L7", "L7Plot"], - "demos": [ - { - "imgurl": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*v5j_QZEL-1YAAAAAAAAAAABkARQnAQ", - "title_zh": "气泡地图", - "title_en": "Bubble Map", - "host": "https://l7.antv.antgroup.com/", - "path": "/examples/point/bubble#world", - "ratio": 1.5 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*u5BsQbn30pkAAAAAAAAAAABkARQnAQ", - "title_zh": "动画", - "title_en": "Animate", - "host": "https://l7.antv.antgroup.com/", - "path": "/examples/gallery/animate#world2", - "ratio": 1.5 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*GD2bR7pb-yIAAAAAAAAAAABkARQnAQ", - "title_zh": "经典热力图", - "title_en": "HeatMap", - "host": "https://l7.antv.antgroup.com/", - "path": "/examples/heatmap/heatmap#heatmap_purple", - "ratio": 1.5 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*j-P8RaJMEvAAAAAAAAAAAABkARQnAQ", - "title_zh": "路径地图", - "title_en": "Path Map", - "host": "https://l7.antv.antgroup.com/", - "path": "/examples/line/path#bus_dark", - "ratio": 1.5 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*xr8BQouXGvoAAAAAAAAAAABkARQnAQ", - "title_zh": "基础可视化", - "title_en": "Featured", - "host": "https://l7.antv.antgroup.com/", - "path": "/examples/gallery/basic#normal", - "ratio": 1.5 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*6Qm_QY69sBMAAAAAAAAAAABkARQnAQ", - "title_zh": "基础可视化", - "title_en": "Featured", - "host": "https://l7.antv.antgroup.com/", - "path": "/examples/gallery/basic#arcCircle", - "ratio": 1.5 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*JjUcTZ8-PC8AAAAAAAAAAABkARQnAQ", - "title_zh": "弧线地图", - "title_en": "Arc Line Map", - "host": "https://l7.antv.antgroup.com/", - "path": "/examples/line/arc#trip_arc_dark", - "ratio": 1.5 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*Uo9oQolgoxYAAAAAAAAAAABkARQnAQ", - "title_zh": "网格热力图", - "title_en": "Grid Map", - "host": "https://l7.antv.antgroup.com/", - "path": "/examples/heatmap/grid#grid1", - "ratio": 1.5 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*7COqR4wCc6QAAAAAAAAAAABkARQnAQ", - "title_zh": "3D 柱状地图", - "title_en": "Column Map", - "host": "https://l7.antv.antgroup.com/", - "path": "/examples/point/column#column_dark", - "ratio": 1.5 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*jJd0Qq_E3_UAAAAAAAAAAABkARQnAQ", - "title_zh": "等值线地图", - "title_en": "Isoline Map", - "host": "https://l7.antv.antgroup.com/", - "path": "/examples/line/isoline#ele_dark", - "ratio": 1.5 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*RCaZSLthUn0AAAAAAAAAAABkARQnAQ", - "title_zh": "3D填充图", - "title_en": "Extrude Map", - "host": "https://l7.antv.antgroup.com/", - "path": "/examples/polygon/3d#polygon", - "ratio": 1.5 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*SLcGSbvZoEwAAAAAAAAAAABkARQnAQ", - "title_zh": "蜂窝热力图", - "title_en": "Hexagon Map", - "host": "https://l7.antv.antgroup.com/", - "path": "/examples/heatmap/hexagon#light", - "ratio": 1.5 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*jLo0RY0sDG4AAAAAAAAAAABkARQnAQ", - "title_zh": "动画", - "title_en": "Animate", - "host": "https://l7.antv.antgroup.com/", - "path": "/examples/gallery/animate#animate_line", - "ratio": 1.5 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*ypZCT6pqv84AAAAAAAAAAABkARQnAQ", - "title_zh": "亮度图", - "title_en": "Dot Intensity", - "host": "https://l7.antv.antgroup.com/", - "path": "/examples/point/dot#normal2", - "ratio": 1.5 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*7XkWTYQMfPMAAAAAAAAAAABkARQnAQ", - "title_zh": "动画", - "title_en": "Animate", - "host": "https://l7.antv.antgroup.com/", - "path": "/examples/gallery/animate#build", - "ratio": 1.5 - } - ] - }, - { - "name": "F2 | F6", - "products": ["F2", "F6", "F2Native"], - "demos": [ - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_4f0ff1/afts/img/A*BDubSYaFpboAAAAAAAAAAABkARQnAQ", - "title_zh": "对比折线图", - "title_en": "Compare Line Chart", - "host": "https://f2.antv.antgroup.com/", - "path": "/examples/line/multiple", - "ratio": 1.9 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_4f0ff1/afts/img/A*_SQ6TItK-U8AAAAAAAAAAABkARQnAQ", - "title_zh": "层叠面积图", - "title_en": "Stacked Area Chart", - "host": "https://f2.antv.antgroup.com/", - "path": "/examples/area/stacked", - "ratio": 1.9 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_4f0ff1/afts/img/A*sDB-S6qxxsYAAAAAAAAAAABkARQnAQ", - "title_zh": "预测线", - "title_en": "Forecast Line", - "host": "https://f2.antv.antgroup.com/", - "path": "/examples/gallery/forecast", - "ratio": 1.9 - }, - { - "imgurl": "https://gw.alipayobjects.com/zos/finxbff/compress-tinypng/92dbeff4-526e-48df-b122-72ed50395b79.jpg", - "title_zh": "基础演示", - "title_en": "Basic Demo", - "host": "https://f2.antv.antgroup.com/", - "path": "/examples/basic", - "ratio": 1.9 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_4f0ff1/afts/img/A*WDqYSYm6HPAAAAAAAAAAAABkARQnAQ", - "title_zh": "分组柱状图", - "title_en": "Dodge Column Chart", - "host": "https://f2.antv.antgroup.com/", - "path": "/examples/column/dodge#negetive", - "ratio": 1.9 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_4f0ff1/afts/img/A*6v1fRatDBM4AAAAAAAAAAABkARQnAQ", - "title_zh": "Guide", - "title_en": "Guide", - "host": "https://f2.antv.antgroup.com/", - "path": "/examples/component/guide#region-filter", - "ratio": 1.9 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_4f0ff1/afts/img/A*fZ11RIsy8zQAAAAAAAAAAABkARQnAQ", - "title_zh": "基础饼图", - "title_en": "Basic Pie Chart", - "host": "https://f2.antv.antgroup.com/", - "path": "/examples/pie/basic#pie-with-label", - "ratio": 1.9 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_4f0ff1/afts/img/A*agBZRoedYKQAAAAAAAAAAABkARQnAQ", - "title_zh": "南丁格尔玫瑰图", - "title_en": "Nightingale Rose Chart", - "host": "https://f2.antv.antgroup.com/", - "path": "/examples/pie/rose", - "ratio": 1.9 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_4f0ff1/afts/img/A*tq5ERqXPyOUAAAAAAAAAAABkARQnAQ", - "title_zh": "Basic Radar Chart", - "title_en": "Basic Radar Chart", - "host": "https://f2.antv.antgroup.com/", - "path": "/examples/radar/radar#area", - "ratio": 1.9 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_4f0ff1/afts/img/A*Xpt7QLmlgz0AAAAAAAAAAABkARQnAQ", - "title_zh": "点图", - "title_en": "Point Chart", - "host": "https://f2.antv.antgroup.com/", - "path": "/examples/point/scatter", - "ratio": 1.9 - }, - { - "imgurl": "https://gw.alipayobjects.com/mdn/rms_4f0ff1/afts/img/A*eKP_RJ2aMfgAAAAAAAAAAABkARQnAQ", - "title_zh": "点图", - "title_en": "Point Chart", - "host": "https://f2.antv.antgroup.com/", - "path": "/examples/point/scatter#bubble", - "ratio": 1.9 - }, - { - "imgurl": "https://gw.alipayobjects.com/zos/finxbff/compress-tinypng/ca7a35dd-b1e9-46b4-a802-54ee4c5e3501.jpg", - "title_zh": "金字塔图", - "title_en": "Pyramid Chart", - "host": "https://f2.antv.antgroup.com/", - "path": "/examples/funnel/pyramid#stroke", - "ratio": 1.9 - }, - { - "imgurl": "https://gw.alipayobjects.com/zos/finxbff/compress-tinypng/4f420a5d-6a81-4ef8-9cba-62106bbdb593.jpg", - "title_zh": "基础漏斗图", - "title_en": "Basic Funnel Chart", - "host": "https://f2.antv.antgroup.com/", - "path": "/examples/funnel/basic#stroke", - "ratio": 1.9 - } - ] - }, - { - "name": "AVA", - "products": ["AVA"], - "banner_img": "https://gw.alipayobjects.com/zos/bmw-prod/2add3311-0f8b-4dc3-a943-8bcff56a3fec.svg", - "banner_url": "https://ava.antv.antgroup.com" - } - ], - "extra_tabs": [ - { - "name": "ChartCube", - "url": "https://chartcube.alipay.com" - } - ] -} diff --git a/site/data/banner-link.json b/site/data/banner-link.json deleted file mode 100644 index 659631511..000000000 --- a/site/data/banner-link.json +++ /dev/null @@ -1,149 +0,0 @@ -[ - { - "title_zh": "AVA", - "title_en": "AVA", - "url": "https://ava.antv.antgroup.com", - "className": "ava", - "gridArea": "ava" - }, - { - "title_zh": "Ant Design Charts", - "title_en": "Ant Design Charts", - "url": "https://charts.ant.design", - "className": "charts", - "gridArea": "charts" - }, - { - "title_zh": "G2Plot", - "title_en": "G2Plot", - "url": "https://g2plot.antv.antgroup.com", - "className": "G2", - "gridArea": "G2Plot" - }, - { - "title_zh": "G2", - "title_en": "G2", - "url": "https://g2.antv.antgroup.com", - "className": "G2", - "gridArea": "G2" - }, - { - "title_zh": "S2", - "title_en": "S2", - "url": "https://s2.antv.antgroup.com", - "className": "G2", - "gridArea": "S2" - }, - { - "title_zh": "常规统计数据", - "title_en": "General Statistics", - "className": "conventional", - "gridArea": "statistic" - }, - { - "title_zh": "Graphin", - "title_en": "Graphin", - "url": "https://graphin.antv.vision", - "className": "G6", - "gridArea": "Graphin" - }, - { - "title_zh": "XFlow", - "title_en": "XFlow", - "url": "https://xflow.antv.vision", - "className": "G6", - "gridArea": "XFlow" - }, - { - "title_zh": "G6", - "title_en": "G6", - "url": "https://g6.antv.vision", - "className": "G6", - "gridArea": "G6" - }, - { - "title_zh": "X6", - "title_en": "X6", - "url": "https://x6.antv.antgroup.com", - "className": "G6", - "gridArea": "X6" - }, - { - "title_zh": "关系数据", - "title_en": "Relation Data", - "className": "relationship", - "gridArea": "graph" - }, - { - "title_zh": "L7Plot", - "title_en": "L7Plot", - "url": "https://l7plot.antv.vision", - "className": "L7", - "gridArea": "L7Plot" - }, - { - "title_zh": "L7", - "title_en": "L7", - "url": "https://l7.antv.antgroup.com", - "className": "L7", - "gridArea": "L7" - }, - { - "title_zh": "地理空间数据", - "title_en": "Geospatial Data", - "className": "geography", - "gridArea": "geo" - }, - { - "title_zh": "G", - "title_en": "G", - "url": "https://g-next.antv.vision", - "className": "G", - "gridArea": "G" - }, - { - "title_zh": "", - "title_en": "", - "className": "gutter", - "gridArea": "gutter" - }, - { - "title_zh": "267 全系 F 版", - "title_en": "F2、6、7", - "className": "FSeries", - "gridArea": "F" - }, - { - "title_zh": "极致移动定制", - "title_en": "Fast & Flexible", - "className": "FSeries", - "gridArea": "f-intro" - }, - { - "title_zh": "F2Native", - "title_en": "F2Native", - "url": "https://f2native.antv.vision", - "className": "G2", - "gridArea": "F2Native" - }, - { - "title_zh": "F2", - "title_en": "F2", - "url": "https://f2.antv.antgroup.com", - "className": "G2", - "gridArea": "F2" - }, - { - "title_zh": "F6", - "title_en": "F6", - "url": "https://f6.antv.vision", - "className": "G6", - "gridArea": "F6" - }, - { - "title_zh": "F7", - "title_en": "F7", - "className": "L7", - "gridArea": "F7" - } -] diff --git a/site/data/chart-urls.json b/site/data/chart-urls.json deleted file mode 100644 index 5eec8e373..000000000 --- a/site/data/chart-urls.json +++ /dev/null @@ -1,969 +0,0 @@ -{ - "single_line_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*JXRgQ4tcm1kAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/line/basic", - "/g2/zh/examples/line/basic", - "/f2/zh/examples/line/basic" - ], - "links_en": [ - "/g2plot/en/examples/line/basic", - "/g2/en/examples/line/basic", - "/f2/en/examples/line/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "multi_line_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*gnbiSo8DaEwAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/line/multiple", - "/g2/zh/examples/line/multiple", - "/f2/zh/examples/line/multiple" - ], - "links_en": [ - "/g2plot/en/examples/line/multiple", - "/g2/en/examples/line/multiple", - "/f2/en/examples/line/multiple" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "step_line_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*sheqT5vGsewAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/step-line/basic", - "/g2/zh/examples/line/step" - ], - "links_en": [ - "/g2plot/en/examples/step-line/basic", - "/g2/en/examples/line/step" - ], - "linkNames": ["G2Plot", "G2"] - }, - - "multi_step_line_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*IFo8S4Ax2uYAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/step-line/multiple", - "/g2/zh/examples/line/step#step-series" - ], - "links_en": [ - "/g2plot/en/examples/step-line/multiple", - "/g2/en/examples/line/step#step-series" - ], - "linkNames": ["G2Plot", "G2"] - }, - - "basic_area_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Zv4oSrF6JDYAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/area/basic", - "/g2/zh/examples/area/basic", - "/f2/zh/examples/area/basic" - ], - "links_en": [ - "/g2plot/en/examples/area/basic", - "/g2/en/examples/area/basic", - "/f2/en/examples/area/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "stacked_area_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*YoCuRoNaN8kAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/area/stacked#basic", - "/g2/zh/examples/area/stacked#stacked", - "/g]f2/zh/examples/area/stacked#stacked" - ], - "links_en": [ - "/g2plot/en/examples/area/stacked#basic", - "/g2/en/examples/area/stacked", - "/f2/en/examples/area/stacked" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "percent_stacked_area_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*NMkWRLm2_8IAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/area/percent-stacked#basic", - "/g2/zh/examples/area/stacked#percentage", - "/f2/zh/examples/area/stacked#percent" - ], - "links_en": [ - "/g2plot/en/examples/area/percent-stacked#basic", - "/g2/en/examples/area/stacked#percentage", - "/f2/en/examples/area/stacked#percent" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "interval_area_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*wX5sTajQpn4AAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/area/range"], - "links_en": ["/g2/en/examples/area/range"], - "linkNames": ["G2"] - }, - - "stream_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*-lFRTootQesAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/area/stacked#streamgraph"], - "links_en": ["/g2/en/examples/area/stacked#streamgraph"], - "linkNames": ["G2"] - }, - - "basic_column_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*V9UkSqvdud4AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/basic", - "/g2/zh/examples/column/basic", - "/f2/zh/examples/column/basic" - ], - "links_en": [ - "/g2plot/en/examples/column/basic", - "/g2/en/examples/column/basic", - "/f2/en/examples/column/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "grouped_column_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*qjpuT6qOKG0AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/grouped#group-column", - "/g2/zh/examples/column/dodge", - "/f2/zh/examples/column/dodge" - ], - "links_en": [ - "/g2plot/en/examples/column/grouped#group-column", - "/g2/en/examples/column/dodge", - "/f2/en/examples/column/dodge" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "stacked_column_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*l8T0QYLvYocAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/stacked#stackColumn", - "/g2/zh/examples/column/stack#stacked", - "/f2/zh/examples/column/stack#stacked" - ], - "links_en": [ - "/g2plot/en/examples/column/stacked##stackColumn", - "/g2/en/examples/column/stack#stacked", - "/f2/en/examples/column/stack#stacked" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "percent_stacked_column_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*nl5pTowaN5EAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/percent-stacked#basic", - "/g2/zh/examples/column/stack#stacked-percentage", - "/f2/zh/examples/column/stack#percent" - ], - "links_en": [ - "/g2plot/en/examples/column/percent-stacked#basic", - "/g2/en/examples/column/stack#stacked-percentage", - "/f2/en/examples/column/stack#stacked-percentage" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "interval_column_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*5FIvRblZNooAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/range#range-column", - "/g2/zh/examples/column/basic#ranged", - "/f2/zh/examples/column/basic#ranged" - ], - "links_en": [ - "/g2plot/en/examples/column/range#range-column", - "/g2/en/examples/column/basic#ranged", - "/f2/zh/examples/column/basic#ranged" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "waterfall_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*QLMTR4jmABYAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/waterfall#basic", - "/g2/zh/examples/column/basic#waterfall" - ], - "links_en": [ - "/g2plot/en/examples/column/waterfall#basic", - "/g2/en/examples/column/basic#waterfall" - ], - "linkNames": ["G2Plot", "G2"] - }, - - "histogram": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*WI97SJBgaCwAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/histogram", - "/g2/zh/examples/column/histogram#histogram" - ], - "links_en": [ - "/g2plot/en/examples/column/histogram#histogram", - "/g2/en/examples/column/histogram#histogram" - ], - "linkNames": ["G2Plot", "G2"] - }, - - "basic_bar_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*RENoRrj3PugAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/bar/basic", - "/g2/zh/examples/bar/basic", - "/f2/zh/examples/bar/basic" - ], - "links_en": [ - "/g2plot/en/examples/bar/basic", - "/g2/en/examples/bar/basic", - "/f2/en/examples/bar/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "grouped_bar_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*ERLHR55JdTgAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/bar/grouped#basic", - "/g2/zh/examples/bar/dodge", - "/f2/zh/examples/bar/stack#percent" - ], - "links_en": [ - "/g2plot/en/examples/bar/grouped#basic", - "/g2/en/examples/bar/dodge", - "/f2/en/examples/bar/dodge" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "stacked_bar_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*JKcNRbvHZAwAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/bar/stacked#basic", - "/g2/zh/examples/bar/stack", - "/f2/zh/examples/bar/stack" - ], - "links_en": [ - "/g2plot/en/examples/bar/stacked#basic", - "/g2/en/examples/bar/stack#stacked", - "/f2/en/examples/bar/stack" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "percent_stacked_bar_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*R8HdRo0_Sp4AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/bar/percent-stacked#basic", - "/g2/zh/examples/bar/stack#bar-percentage-stacked-marked", - "/f2/zh/examples/bar/stack#bar-percentage-stacked-marked" - ], - "links_en": [ - "/g2plot/en/examples/bar/percent-stacked#basic", - "/g2/en/examples/bar/stack#bar-percentage-stacked-marked", - "/f2/en/examples/bar/stack#bar-percentage-stacked-marked" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "interval_bar_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*G6vWT52rdz4AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/bar/range#range-bar", - "/g2/zh/examples/bar/basic#ranged" - ], - "links_en": [ - "/g2plot/en/examples/bar/range#range-bar", - "/g2/en/examples/bar/basic#ranged" - ], - "linkNames": ["G2Plot", "G2"] - }, - - "radial_bar_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*5EwoQYlQ4q4AAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/bar/basic#radial-bar"], - "links_en": ["/g2/en/examples/bar/basic#radial-bar"], - "linkNames": ["G2"] - }, - - "mirror_bar_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*-y0dTbzSPycAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/bar/dodge#bar5"], - "links_en": ["/g2/en/examples/bar/dodge#bar5"], - "linkNames": ["G2"] - }, - - "basic_pie_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*ka5WSJgUllkAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/pie/basic", - "/g2/zh/examples/pie/basic", - "/f2/zh/examples/pie/basic" - ], - "links_en": [ - "/g2plot/en/examples/pie/basic", - "/g2/en/examples/pie/basic", - "/f2/en/examples/pie/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "donut_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*NkK1T7VLgjkAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/pie/donut#ring-basic", - "/g2/zh/examples/pie/donut", - "/f2/zh/examples/pie/donut" - ], - "links_en": [ - "/g2plot/en/examples/pie/donut#ring-basic", - "/g2/en/examples/pie/donut#donut", - "/f2/en/examples/pie/donut#donut" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "nested_pie_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*JFtYRK6qeeUAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/pie/nested"], - "links_en": ["/g2/en/examples/pie/nested"], - "linkNames": ["G2"] - }, - - "nightingale_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*FBnUR449kzYAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/rose/rose#basic", - "/g2/zh/examples/pie/rose#color-rose", - "/f2/zh/examples/pie/rose#rose" - ], - "links_en": [ - "/g2plot/en/examples/rose/rose#basic", - "/g2/en/examples/pie/rose#color-rose", - "/f2/en/examples/pie/rose#color-rose" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "basic_scatter_plot": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*UQo_Rav7tO4AAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/point/scatter", "/f2/zh/examples/point/scatter"], - "links_en": [ - "/g2/en/examples/point/scatter#scatter", - "/f2/en/examples/point/scatter#scatter" - ], - "linkNames": ["G2", "F2"] - }, - - "basic_bubble_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*tJcRQa5kI10AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/point/scatter#bubble", - "/f2/zh/examples/point/scatter#bubble" - ], - "links_en": [ - "/g2/en/examples/point/scatter#bubble", - "/f2/en/examples/point/scatter#bubble" - ], - "linkNames": ["G2", "F2"] - }, - - "non_ribbon_chord_diagram": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*DltUTa3ASJ8AAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/arcDiagram#circularArcDiagram"], - "links_en": ["/g6/en/examples/net/arcDiagram#circularArcDiagram"], - "linkNames": ["G6"] - }, - - "arc_diagram": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*aVzrSI3NAtAAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/arcDiagram"], - "links_en": ["/g6/en/examples/net/arcDiagram"], - "linkNames": ["G6"] - }, - - "chord_diagram": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*KEDoQrZdzXUAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/relation/relation#chord"], - "links_en": ["/g2/en/examples/relation/relation#chord"], - "linkNames": ["G2"] - }, - - "treemap": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*nUuaSpgmG6UAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/treemap/rect#label", - "/g2/zh/examples/relation/relation#treemap-children", - "/f2/zh/examples/relation/relation#treemap" - ], - "links_en": [ - "/g2plot/en/examples/treemap/rect#label", - "/g2/en/examples/relation/relation#treemap-children", - "/f2/en/examples/relation/relation#treemap" - ], - "linkNames": ["G2Plot", "G2"] - }, - - "sankey_diagram": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*iuHTTJRzTW4AAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/relation/relation#sankey"], - "links_en": ["/g2/en/examples/relation/relation#sankey"], - "linkNames": ["G2"] - }, - - "basic_funnel_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*TqKWT57XsrIAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/funnel/basic#basic", - "/g2/zh/examples/funnel/funnel" - ], - "links_en": [ - "/g2plot/en/examples/funnel/basic#basic", - "/g2/en/examples/funnel/funnel" - ], - "linkNames": ["G2Plot", "G2"] - }, - - "overlapping_funnel_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Q5tSQJMDvCoAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/funnel/funnel#comparision"], - "links_en": ["/g2/en/examples/funnel/funnel#comparision"], - "linkNames": ["G2"] - }, - - "mirror_funnel_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*GyMBTqqGY_wAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/funnel/basic#compare", - "/g2/zh/examples/funnel/funnel#symmetric" - ], - "links_en": [ - "/g2plot/en/examples/funnel/basic#compare", - "/g2/en/examples/funnel/funnel#symmetric" - ], - "linkNames": ["G2Plot", "G2"] - }, - - "boxplot": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*xhSaRb16RzYAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/box/box"], - "links_en": ["/g2/en/examples/box/box"], - "linkNames": ["G2"] - }, - - "heatmap": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Te9gRYpVq0cAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/heatmap/basic#basic", - "/g2/zh/examples/heatmap/heatmap#image" - ], - "links_en": [ - "/g2plot/en/examples/heatmap/basic#basic", - "/g2/en/examples/heatmap/heatmap#image" - ], - "linkNames": ["G2Plot", "G2"] - }, - - "gauge_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*McoQQpjJFwkAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/gauge/basic", - "/g2/zh/examples/gauge/gauge", - "/f2/zh/examples/gallery/gauge" - ], - "links_en": [ - "/g2plot/en/examples/gauge/basic", - "/g2/en/examples/gauge/gauge#basic", - "/f2/en/examples/gauge/gauge#basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "basic_radar_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*NxMmSabzJGQAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/radar/basic", - "/g2/zh/examples/radar/radar", - "/f2/zh/examples/radar/radar" - ], - "links_en": [ - "/g2plot/en/examples/radar/basic", - "/g2/en/examples/radar/radar", - "/f2/en/examples/radar/radar" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "wordcloud": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*iHCmSaZ1tCwAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/word-cloud/basic#basic", - "/g2/zh/examples/other/other#word-cloud", - "/f2/zh/examples/other/other#word-cloud" - ], - "links_en": [ - "/g2plot/zh/examples/word-cloud/basic#basic", - "/g2/en/examples/other/other#word-cloud", - "/f2/en/examples/other/other#word-cloud" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "candlestick_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*nOPdTrLtpdMAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/candlestick/demo#k-and-area", - "/f2/zh/examples/candlestick/basic#k" - ], - "links_en": [ - "/g2/en/examples/candlestick/demo#k-and-area", - "/f2/zh/examples/candlestick/demo#k-and-area" - ], - "linkNames": ["G2", "F2"] - }, - - "compact_box_tree": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*WGHWQYjLmXoAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/tree/compactBox#tbCompactBox"], - "links_en": ["/g6/en/examples/tree/compactBox#tbCompactBox"], - "linkNames": ["G6"] - }, - - "dendrogram": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*r51nTJ-Ha5MAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/tree/dendrogram#tbDendrogram"], - "links_en": ["/g6/en/examples/tree/dendrogram#tbDendrogram"], - "linkNames": ["G6"] - }, - - "indented_tree": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*ywVeSJIfeK8AAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/tree/indented"], - "links_en": ["/g6/en/examples/tree/indented"], - "linkNames": ["G6"] - }, - - "radial_tree": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*vUkTSpv9YqkAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/tree/radialtree"], - "links_en": ["/g6/en/examples/tree/radialtree"], - "linkNames": ["G6"] - }, - - "flow_diagram": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*35XETpuMRpsAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/dagreFlow"], - "links_en": ["/g6/en/examples/net/dagreFlow"], - "linkNames": ["G6"] - }, - - "fruchterman_layout_cluster_graph": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*8qAMTomesZcAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/furchtermanLayout#fruchtermanClustering"], - "links_en": ["/g6/en/examples/net/furchtermanLayout#fruchtermanClustering"], - "linkNames": ["G6"] - }, - - "fruchterman_layout_graph": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*XD22Q7uxddEAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/furchtermanLayout"], - "links_en": ["/g6/en/examples/net/furchtermanLayout"], - "linkNames": ["G6"] - }, - - "force_directed_layout_graph": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*dokGR7uP50oAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/forceDirected"], - "links_en": ["/g6/en/examples/net/forceDirected"], - "linkNames": ["G6"] - }, - - "circular_layout_graph": { - "tags": ["relational"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*2ZNjRqRzJggAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/circular"], - "links_en": ["/g6/en/examples/net/circular"], - "linkNames": ["G6"] - }, - - "spiral_layout_graph": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*5NkUTJyXfIcAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/circular#spiralCircular"], - "links_en": ["/g6/en/examples/net/circular#spiralCircular"], - "linkNames": ["G6"] - }, - - "radial_layout_graph": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*KON0Rbv5XtEAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/radialLayout"], - "links_en": ["/g6/en/examples/net/radialLayout"], - "linkNames": ["G6"] - }, - - "concentric_layout_graph": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*zxlhRobv7VEAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/concentricLayout"], - "links_en": ["/g6/en/examples/net/concentricLayout"], - "linkNames": ["G6"] - }, - - "grid_layout_graph": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*wlkBRKmjVNgAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/gridLayout"], - "links_en": ["/g6/en/examples/net/gridLayout"], - "linkNames": ["G6"] - }, - - "bubbles_diagram": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*EaIlRqda-VcAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/forceDirected#forceBubbles"], - "links_en": ["/g6/en/examples/net/forceDirected#forceBubbles"], - "linkNames": ["G6"] - }, - - "symbol_map": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Af7tQJ_sFdwAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/point/image"], - "links_en": ["/L7/en/examples/point/image"], - "linkNames": ["L7"] - }, - - "chart_map": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*KEmSSIB3scwAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/point/chart"], - "links_en": ["/L7/en/examples/point/chart"], - "linkNames": ["L7"] - }, - - "column_map_3d": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*1X4mS4yNGSgAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/point/column"], - "links_en": ["/L7/en/examples/point/column"], - "linkNames": ["L7"] - }, - - "scatter_map": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*c2EOQqwR-toAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/point/scatter"], - "links_en": ["/L7/en/examples/point/scatter"], - "linkNames": ["L7"] - }, - - "path_map": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*J3sVRrzk3egAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/line/path"], - "links_en": ["/L7/en/examples/line/path"], - "linkNames": ["L7"] - }, - - "isoline_map": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*hHKHSa1PH-MAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/line/isoline"], - "links_en": ["/L7/en/examples/line/isoline"], - "linkNames": ["L7"] - }, - - "arc_map_3d": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*5cnzS4A3968AAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/line/arc"], - "links_en": ["/L7/en/examples/line/arc"], - "linkNames": ["L7"] - }, - - "choropleth_map": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*TSGQRowxmmAAAAAAAAAAAABkARQnAQ", - "links": [ - "/L7/zh/examples/polygon/fill", - "/g2/zh/examples/map/map#choropleth-map" - ], - "links_en": [ - "/L7/en/examples/polygon/fill", - "/g2/en/examples/map/map#choropleth-map" - ], - "linkNames": ["L7", "G2"] - }, - - "choropleth_map_3d": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*9b3zR6FNKh4AAAAAAAAAAABkARQnAQ", - "links": ["/l7/zh/examples/polygon/3d"], - "links_en": ["/l7/en/examples/polygon/3d"], - "linkNames": ["L7"] - }, - - "hexagonal_heat_map": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*YbKcRbypQ_oAAAAAAAAAAABkARQnAQ", - "links": [ - "/L7/zh/examples/heatmap/hexagon", - "/g2/zh/examples/map/map#hex-choropleth-map" - ], - "links_en": [ - "/L7/en/examples/heatmap/hexagon", - "/g2/en/examples/map/map#hex-choropleth-map" - ], - "linkNames": ["L7", "G2"] - }, - - "hexagonal_heat_map_3d": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*l9D1QK5-z-8AAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/heatmap/hexagon#light"], - "links_en": ["/L7/en//examples/heatmap/hexagon#light"], - "linkNames": ["L7"] - }, - - "classical_heat_map": { - "imgSrc": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*HxpoRIcBA80AAAAAAAAAAABkARQnAQ", - "links": [ - "/L7/zh/examples/heatmap/heatmap", - "/g2/zh/examples/map/map#with-heatmap" - ], - "links_en": [ - "/L7/en/examples/heatmap/heatmap", - "/g2/en/examples/map/map#with-heatmap" - ], - "linkNames": ["L7", "G2"] - }, - - "grid_heat_map": { - "imgSrc": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*tAGKS6EClQ4AAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/heatmap/grid#grid1"], - "links_en": ["/L7/en/examples/heatmap/grid#grid1"], - "linkNames": ["L7"] - }, - - "packed_circles": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*nbfsS6Fe8mgAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/relation/relation#circle-packing"], - "links_en": ["/g2/en/examples/relation/relation#circle-packing"], - "linkNames": ["G2"] - }, - - "polar_treemap": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*HGyHQbd3esQAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/relation/relation#polar-treemap"], - "links_en": ["/g2/en/examples/relation/relation#polar-treemap"], - "linkNames": ["G2"] - }, - - "sunburst_diagram": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*6vuVTqshFqgAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/relation/relation#sunburst"], - "links_en": ["/g2/en/examples/relation/relation#sunburst"], - "linkNames": ["G2"] - }, - - "liquid_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*UuVdTY8CCgwAAAAAAAAAAABkARQnAQ", - "links": ["/g2plot/zh/examples/liquid/basic#basic"], - "links_en": ["/g2plot/en/examples/liquid/basic#basic"], - "linkNames": ["G2Plot"] - }, - - "range_column_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*HnDyRbJLzRIAAAAAAAAAAABkARQnAQ", - "links": ["/g2plot/zh/examples/column/range#range-column"], - "links_en": ["/g2plot/en/examples/column/range#range-column"], - "linkNames": ["G2Plot"] - }, - - "range_bar_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*3k3KRKkG0XcAAAAAAAAAAABkARQnAQ", - "links": ["/g2plot/zh/examples/bar/range#range-bar"], - "links_en": ["/g2plot/en/examples/bar/range#range-bar"], - "linkNames": ["G2Plot"] - }, - - "bullet_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*n9NkQrE7Nf8AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/bullet/basic#basic", - "/g2/zh/examples/other/other#bullet-graph" - ], - "links_en": [ - "/g2plot/en/examples/bullet/basic#basic", - "/g2/en/examples/other/other#bullet-graph" - ], - "linkNames": ["G2Plot", "G2"] - }, - - "density_heatmap": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*VX0VT7ejFJ4AAAAAAAAAAABkARQnAQ", - "links": [ - "/l7/zh/examples/heatmap/heatmap", - "/g2plot/zh/examples/heatmap/density#basic" - ], - "links_en": [ - "/l7/en/examples/heatmap/heatmap", - "/g2plot/en/examples/heatmap/density#basic" - ], - "linkNames": ["L7", "G2Plot"] - }, - - "bubble_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Ju-vTbtJ2L4AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/bubble/basic", - "/g2/zh/examples/point/bubble#bubble" - ], - "links_en": [ - "/g2plot/en/examples/bubble/basic", - "/g2/en/examples/point/bubble#bubble" - ], - "linkNames": ["G2Plot", "G2"] - }, - - "bubble_map": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*h8uZSar9UPEAAAAAAAAAAABkARQnAQ", - "links": ["/l7/zh/examples/point/bubble#point"], - "links_en": ["/l7/en/examples/point/bubble#point"], - "linkNames": ["L7"] - }, - - "bubble_light_map": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*8hJhRaqz5h0AAAAAAAAAAABkARQnAQ", - "links": ["/l7/zh/examples/point/dot"], - "links_en": ["/l7/en/examples/point/dot"], - "linkNames": ["L7"] - }, - - "column_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*APMLRan5SQkAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/gallery/column#column2", - "/g2/zh/examples/column/basic", - "/f2/zh/examples/column/basic" - ], - "links_en": [ - "/g2plot/en/examples/gallery/column#column2", - "/g2/en/examples/column/basic", - "/f2/en/examples/column/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "bar_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*mxr-Q7aH970AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/bar/basic", - "/g2/zh/examples/bar/basic", - "/f2/zh/examples/bar/basic" - ], - "links_en": [ - "/g2plot/en/examples/bar/basic", - "/g2/en/examples/bar/basic", - "/f2/en/examples/bar/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "scatter_plot": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*UCKjQo1GzR0AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/scatter/basic", - "/g2/zh/examples/point/scatter#scatter-series", - "/f2/zh/examples/point/scatter" - ], - "links_en": [ - "/g2plot/en/examples/scatter/basic", - "/g2/en/examples/point/scatter#scatter-series", - "/f2/en/examples/point/scatter" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "pie_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*cO3NQYaljgUAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/pie/basic", - "/g2/zh/examples/pie/basic", - "/f2/zh/examples/pie/basic" - ], - "links_en": [ - "/g2plot/en/examples/pie/basic", - "/g2/en/examples/pie/basic", - "/f2/en/examples/pie/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "rose_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*v0leRYiKPWIAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/rose/basic", - "/g2/zh/examples/pie/rose#color-rose", - "/f2/zh/examples/pie/rose" - ], - "links_en": [ - "/g2plot/en/examples/rose/basic", - "/g2/en/examples/pie/rose#color-rose", - "/f2/en/examples/pie/rose" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "line_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*AXN-RL5AtWoAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/line/basic", - "/g2/zh/examples/line/basic", - "/f2/zh/examples/line/basic" - ], - "links_en": [ - "/g2plot/en/examples/line/basic", - "/g2/en/examples/line/basic", - "/f2/en/examples/line/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "area_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*HnQ9TqZ8cl0AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/area/basic", - "/g2/zh/examples/area/basic", - "/f2/zh/examples/area/basic" - ], - "links_en": [ - "/g2plot/en/examples/area/basic", - "/g2/en/examples/area/basic", - "/f2/en/examples/area/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - - "funnel_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*VFFTRp_9pBEAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/funnel/basic", - "/g2/zh/examples/funnel/funnel" - ], - "links_en": [ - "/g2plot/en/examples/funnel/basic", - "/g2/en/examples/funnel/funnel" - ], - "linkNames": ["G2Plot", "G2"] - }, - - "radar_chart": { - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*71XVSojadu0AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/radar/basic", - "/g2/zh/examples/radar/radar", - "/f2/zh/examples/radar/radar" - ], - "links_en": [ - "/g2plot/en/examples/radar/basic", - "/g2/en/examples/radar/radar", - "/f2/en/examples/radar/radar" - ], - "linkNames": ["G2Plot", "G2", "F2"] - } -} diff --git a/site/data/complex-charts.json b/site/data/complex-charts.json deleted file mode 100644 index b7c89b611..000000000 --- a/site/data/complex-charts.json +++ /dev/null @@ -1,31 +0,0 @@ -[ - { - "text": "3D大图", - "video": "https://gw.alipayobjects.com/v/huamei_qa8qxu/afts/video/wg8jTrLg-3EAAAAAAAAAAAAAK4eUAQBr", - "link": "https://g6.antv.antgroup.com/examples/feature/default/#3d-massive", - "img": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*RFK7R4TWuWQAAAAAAAAAAAAADmJ7AQ/original", - "activeImg": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*NYQ-SLUYDpMAAAAAAAAAAAAADmJ7AQ/original" - }, - { - "text": "超强性能", - "video": "https://gw.alipayobjects.com/v/huamei_qa8qxu/afts/video/l9viS4v0-fgAAAAAAAAAAAAAK4eUAQBr", - "link": "https://g6.antv.antgroup.com/zh/examples/performance/massive-data/#20000", - "img": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*EZ7OTLICg8MAAAAAAAAAAAAADmJ7AQ/original", - "activeImg": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*2_soSbk9R-gAAAAAAAAAAAAADmJ7AQ/original" - }, - { - "text": "叙事动画", - "video": "https://gw.alipayobjects.com/v/huamei_qa8qxu/afts/video/XHdUSp9rBo4AAAAAAAAAAAAAK4eUAQBr", - "link": "https://g2.antv.antgroup.com/examples/storytelling/storytelling/#stocks-keyframe", - "img": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*yrlSTZeONjUAAAAAAAAAAAAADmJ7AQ/original", - "activeImg": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*HG6pSovStWgAAAAAAAAAAAAADmJ7AQ/original" - }, - { - "text": "WebXR", - "video": "https://gw.alipayobjects.com/v/huamei_qa8qxu/afts/video/StguTYJvYQMAAAAAAAAAAAAAVoeUAQBr", - "link": "https://5mxqzn.csb.app/", - "img": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*RFK7R4TWuWQAAAAAAAAAAAAADmJ7AQ/original", - "activeImg": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*NYQ-SLUYDpMAAAAAAAAAAAAADmJ7AQ/original", - "objectFit": "contain" - } -] diff --git a/site/data/contributors.tsx b/site/data/contributors.tsx deleted file mode 100644 index 5909cbef3..000000000 --- a/site/data/contributors.tsx +++ /dev/null @@ -1,376 +0,0 @@ -const contributors: { - name: string; - jobTitle: string; - avatar: string; - weibo: string; - github: string; -}[] = [ - { - name: '艾因', - jobTitle: '工程师', - avatar: 'https://gw.alipayobjects.com/zos/antfincdn/z8eXl6l9GM/aiyin.jpg', - weibo: '', - github: 'https://github.com/liuzhenying', - }, - { - name: '白弦', - jobTitle: '设计师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*cu6GQ7yNpJIAAAAAAAAAAABkARQnAQ', - weibo: '', - github: '', - }, - { - name: '柏愚', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*IFYESbDDqI0AAAAAAAAAAABkARQnAQ', - weibo: '', - github: '', - }, - { - name: '不过', - jobTitle: '设计师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*z6bUQ7bvuAYAAAAAAAAAAABkARQnAQ', - weibo: '', - github: '', - }, - { - name: '步茗', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*zIFOTbhtCoMAAAAAAAAAAABkARQnAQ', - weibo: 'https://weibo.com/neopard/profile', - github: 'https://github.com/neoddish', - }, - { - name: '沧东', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*z9SnQpiMnIgAAAAAAAAAAABkARQnAQ', - weibo: '', - github: 'https://github.com/xiaoiver', - }, - { - name: '导演', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*aGTWQKFIx2cAAAAAAAAAAABkARQnAQ', - weibo: '', - github: 'https://github.com/tarobjtu', - }, - { - name: '多牧', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/zos/antfincdn/n%26uTxqsNHe/IMG_3154.JPG', - weibo: 'https://weibo.com/u/2866327102', - github: 'https://github.com/mxz96102', - }, - { - name: '耳铃', - jobTitle: '设计师', - avatar: - 'http://alipay-rmsdeploy-image.cn-hangzhou.alipay.aliyun-inc.com/antfincdn/sX13FkC4%26C/erling.jpg', - weibo: '', - github: '', - }, - { - name: '佛肚', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/zos/antfincdn/4VUXCQEiBd/c4f901c7-f591-4616-8dfc-83aecf839cd8.png', - weibo: '', - github: 'https://github.com/budlion', - }, - { - name: '福晋', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*5kqTSZE-9KMAAAAAAAAAAABkARQnAQ', - weibo: '', - github: 'https://github.com/lxfu', - }, - { - name: '顾己', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*_OhHTo0gxAMAAAAAAAAAAABkARQnAQ', - weibo: '', - github: 'https://github.com/Esorakouki', - }, - { - name: '伽壹', - jobTitle: '设计师', - avatar: - 'https://gw.alipayobjects.com/zos/antfincdn/aXQ3OTu6Er/IMG_3509.JPG', - weibo: '', - github: '', - }, - { - name: '尽白', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*blSIQbwdOqsAAAAAAAAAAABkARQnAQ', - weibo: 'https://www.weibo.com/u/1736341270', - github: 'https://github.com/aa1011372655', - }, - { - name: '镜曦', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*rVgGS5sJwHQAAAAAAAAAAABkARQnAQ', - weibo: '', - github: '', - }, - { - name: '聚则', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*gB63QppvTsgAAAAAAAAAAABkARQnAQ', - weibo: '', - github: 'https://github.com/baizn', - }, - { - name: '康奎', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/zos/antfincdn/AefmmqKied/3ca2b3d8-e568-4bec-b10d-e4e432cb6f23.png', - weibo: '', - github: 'https://github.com/benjamin920813', - }, - { - name: '珂甫', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*iBIzSZMCWRcAAAAAAAAAAABkARQnAQ', - weibo: '', - github: 'https://github.com/pddpd', - }, - { - name: '林外', - jobTitle: '设计师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*GHQQQYTL4g8AAAAAAAAAAABkARQnAQ', - weibo: '', - github: '', - }, - { - name: '翎刀', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*VXoNRoRXPBwAAAAAAAAAAABkARQnAQ', - weibo: '', - github: 'https://github.com/zqlu', - }, - { - name: '幕阑', - jobTitle: '设计师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*WZcQRJtWWlIAAAAAAAAAAABkARQnAQ', - weibo: '', - github: '', - }, - { - name: '偏右', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*-wAXRKlOrW4AAAAAAAAAAABkARQnAQ', - weibo: '', - github: 'https://github.com/afc163', - }, - { - name: '璆鸣', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*LSpRS6i_WOcAAAAAAAAAAABkARQnAQ', - weibo: '', - github: '', - }, - { - name: '山果', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*23r_SpWxPdEAAAAAAAAAAABkARQnAQ', - weibo: '', - github: 'https://github.com/pomelo-nwu', - }, - { - name: '十吾', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*R3QzTpZM7IUAAAAAAAAAAABkARQnAQ', - weibo: 'https://weibo.com/u/2844988612', - github: 'https://github.com/Yanyan-Wang', - }, - { - name: '拾锋', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*vU-mRr0XrfcAAAAAAAAAAABkARQnAQ', - weibo: '', - github: '', - }, - { - name: '索丘', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*LMcOQKUxbUEAAAAAAAAAAABkARQnAQ', - weibo: 'https://weibo.com/u/1959122550', - github: 'https://github.com/zengyue', - }, - { - name: '完白', - jobTitle: '设计师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*8CiTTqjnzcEAAAAAAAAAAABkARQnAQ', - weibo: '', - github: '', - }, - { - name: '文瑀', - jobTitle: '工程师', - avatar: 'https://gw.alipayobjects.com/zos/antfincdn/smBVaflWk5/my.jpg', - weibo: '', - github: 'https://github.com/newbyvector', - }, - { - name: '问崖', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*V7E0RqRAlG4AAAAAAAAAAABkARQnAQ', - weibo: '', - github: 'https://github.com/bubkoo', - }, - { - name: '象数', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*_E0SR4LCxaAAAAAAAAAAAABkARQnAQ', - weibo: 'https://weibo.com/1707284737', - github: 'https://github.com/lzxue', - }, - { - name: '逍为', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*PmifSa53auQAAAAAAAAAAABkARQnAQ', - weibo: '', - github: 'https://github.com/hustcc', - }, - { - name: '萧庆', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*mWkGRqxLexYAAAAAAAAAAABkARQnAQ', - weibo: '', - github: 'https://github.com/dxq613', - }, - { - name: '新茗', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*CPXKQ76YlfwAAAAAAAAAAABkARQnAQ', - weibo: 'https://weibo.com/kasmine/profile', - github: 'https://github.com/me-momo', - }, - { - name: '缨缨', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/zos/antfincdn/c9K5r1m%26y9/d0b8a090-f034-43e6-aeeb-f59cb6c7c33c.png', - weibo: '', - github: 'https://github.com/xingwanying', - }, - { - name: '鱼亦', - jobTitle: '设计师', - avatar: - 'https://gw.alipayobjects.com/zos/antfincdn/L%261dAufvjL/IMG_1477.JPG', - weibo: '', - github: '', - }, - { - name: '羽熙', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/zos/antfincdn/NkfCEL7RTL/7cdd44fc-8624-4b6c-8947-67f78e79142f.png', - weibo: '', - github: 'https://github.com/bbsqq', - }, - { - name: '羽依', - jobTitle: '工程师', - avatar: - 'https://ch-resources.oss-cn-shanghai.aliyuncs.com/images/avatar/observedobserver.png', - weibo: '', - github: 'https://github.com/ObservedObserver', - }, - { - name: '玉伯', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*dl_gToTY6msAAAAAAAAAAABkARQnAQ', - weibo: 'https://weibo.com/lifesinger', - github: 'https://github.com/lifesinger', - }, - { - name: '御术', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*QFEMTaidg9QAAAAAAAAAAABkARQnAQ', - weibo: 'https://weibo.com/kenerlinfeng', - github: 'https://github.com/kener', - }, - { - name: '源子', - jobTitle: '设计师', - avatar: - 'https://gw.alipayobjects.com/zos/antfincdn/KGawdl9Ahq/touxiang.JPG', - weibo: '', - github: '', - }, - { - name: '再飞', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*y1cFS4MDmPIAAAAAAAAAAABkARQnAQ', - weibo: 'https://weibo.com/simaoohappy', - github: 'https://github.com/simaQ', - }, - { - name: '杍鱼', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*qykaTLGttsgAAAAAAAAAAABkARQnAQ', - weibo: '', - github: 'https://github.com/cycgit', - }, - { - name: '子晴', - jobTitle: '设计师', - avatar: - 'https://gw.alipayobjects.com/zos/antfincdn/QL5d8rcf%24M/IMG_6534.JPG', - weibo: '', - github: '', - }, - { - name: '青原', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_04a9e5/afts/img/A*ZmohRYwarWcAAAAAAAAAAAAAARQnAQ', - weibo: '', - github: 'https://github.com/yangxlei', - }, - { - name: '夏珞', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_04a9e5/afts/img/A*1O_3R4Wcwy0AAAAAAAAAAAAAARQnAQ', - weibo: '', - github: 'https://github.com/JaneZhong', - }, -]; - -export default contributors; diff --git a/site/data/decision-tree-chartype.json b/site/data/decision-tree-chartype.json deleted file mode 100644 index da1a7195e..000000000 --- a/site/data/decision-tree-chartype.json +++ /dev/null @@ -1,1649 +0,0 @@ -{ - "nodes": [ - { - "id": "statisticchart", - "name": "统计图表", - "level": 0, - "childrenNum": 41, - "tag": "statisticchart" - }, - { - "id": "graph", - "name": "关系图", - "level": 0, - "childrenNum": 23, - "tag": "graph" - }, - { - "id": "map", - "name": "地图", - "level": 0, - "childrenNum": 14, - "tag": "map" - }, - { - "id": "linechart", - "name": "折线图", - "level": 1, - "tag": "linechart", - "childrenNum": 7, - "isLeaf": false, - "tags": ["statisticchart"] - }, - { - "id": "statisticchartothers", - "name": "其他", - "level": 1, - "tag": "statisticchartothers", - "childrenNum": 5, - "isLeaf": false, - "tags": ["statisticchart"] - }, - { - "id": "areachart", - "name": "面积图", - "level": 1, - "childrenNum": 5, - "tag": "areachart", - "isLeaf": false, - "tags": ["statisticchart"] - }, - { - "id": "histogram", - "name": "柱状图", - "level": 1, - "childrenNum": 7, - "tag": "histogram", - "isLeaf": false, - "tags": ["statisticchart"] - }, - { - "id": "barchart", - "name": "条形图", - "level": 1, - "childrenNum": 7, - "tag": "barchart", - "isLeaf": false, - "tags": ["statisticchart"] - }, - { - "id": "piechart", - "name": "饼图", - "level": 1, - "childrenNum": 4, - "tag": "piechart", - "isLeaf": false, - "tags": ["statisticchart"] - }, - { - "id": "scatterplot", - "name": "散点图", - "level": 1, - "childrenNum": 2, - "tag": "scatterplot", - "isLeaf": false, - "tags": ["statisticchart"] - }, - { - "id": "flowplot", - "name": "流程图", - "level": 1, - "childrenNum": 3, - "tag": "flowplot", - "isLeaf": false, - "tags": ["statisticchart"] - }, - { - "id": "stockplot", - "name": "股票", - "level": 1, - "tag": "stockplot", - "childrenNum": 2, - "isLeaf": false, - "tags": ["statisticchart"] - }, - { - "id": "tree", - "name": "树图", - "level": 1, - "tag": "tree", - "childrenNum": 8, - "isLeaf": false, - "tags": ["graph"] - }, - { - "id": "pointlayer", - "name": "点图层", - "level": 1, - "tag": "pointlayer", - "childrenNum": 5, - "isLeaf": false, - "tags": ["map"] - }, - { - "id": "linelayer", - "name": "线图层", - "level": 1, - "childrenNum": 3, - "tag": "linelayer", - "isLeaf": false, - "tags": ["map"] - }, - { - "id": "polygonlayer", - "name": "面图层", - "level": 1, - "childrenNum": 2, - "tag": "polygonlayer", - "isLeaf": false, - "tags": ["map"] - }, - { - "id": "heatmap", - "name": "热力图", - "level": 1, - "childrenNum": 4, - "tag": "heatmap", - "isLeaf": false, - "tags": ["map"] - }, - - { - "id": "basiclinechart", - "name": "基础折线", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-linechart"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*JXRgQ4tcm1kAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/line/basic", - "/g2/zh/examples/line/basic", - "/f2/zh/examples/line/basic" - ], - "links_en": [ - "/g2plot/en/examples/line/basic", - "/g2/en/examples/line/basic", - "/f2/en/examples/line/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "multilinechart", - "name": "多折线图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-linechart"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*gnbiSo8DaEwAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/line/multiple", - "/g2/zh/examples/line/multiple", - "/f2/zh/examples/line/multiple" - ], - "links_en": [ - "/g2plot/en/examples/line/multiple", - "/g2/en/examples/line/multiple", - "/f2/en/examples/line/multiple" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "basicareachart", - "name": "基础面积图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-areachart"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Zv4oSrF6JDYAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/area/basic", - "/g2/zh/examples/area/basic", - "/f2/zh/examples/area/basic" - ], - "links_en": [ - "/g2plot/en/examples/area/basic", - "/g2/en/examples/area/basic", - "/f2/en/examples/area/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "stackareachart", - "name": "堆叠面积图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-areachart"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*YoCuRoNaN8kAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/area/stack", - "/g2/zh/examples/area/stacked#stacked", - "/g]f2/zh/examples/area/stacked#stacked" - ], - "links_en": [ - "/g2plot/en/examples/area/stacked", - "/g2/en/examples/area/stacked", - "/f2/en/examples/area/stacked" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "percentstackareachart", - "name": "百分比堆\n叠面积图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-areachart"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*NMkWRLm2_8IAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/area/percentageArea", - "/g2/zh/examples/area/stacked#percentage", - "/f2/zh/examples/area/stacked#percent" - ], - "links_en": [ - "/g2plot/en/examples/area/percentageArea", - "/g2/en/examples/area/stacked#percentage", - "/f2/en/examples/area/stacked#percent" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "intervalareachart", - "name": "区间面积图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-areachart"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*wX5sTajQpn4AAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/area/range"], - "links_en": ["/g2/en/examples/area/range"], - "linkNames": ["G2"] - }, - { - "id": "streamchart", - "name": "河流图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-areachart"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*-lFRTootQesAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/area/stacked#streamgraph"], - "links_en": ["/g2/en/examples/area/stacked#streamgraph"], - "linkNames": ["G2"] - }, - { - "id": "basichistogram", - "name": "基础柱状图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-histogram"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*V9UkSqvdud4AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/basic", - "/g2/zh/examples/column/basic", - "/f2/zh/examples/column/basic" - ], - "links_en": [ - "/g2plot/en/examples/column/basic", - "/g2/en/examples/column/basic", - "/f2/en/examples/column/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "grouphistogram", - "name": "分组柱状图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-histogram"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*qjpuT6qOKG0AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/group", - "/g2/zh/examples/column/dodge", - "/f2/zh/examples/column/dodge" - ], - "links_en": [ - "/g2plot/en/examples/column/dodge", - "/g2/en/examples/column/dodge", - "/f2/en/examples/column/dodge" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "stackhistogram", - "name": "堆叠柱状图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-histogram"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*l8T0QYLvYocAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/stack#stacked", - "/g2/zh/examples/column/stack#stacked", - "/f2/zh/examples/column/stack#stacked" - ], - "links_en": [ - "/g2plot/en/examples/column/stack#stacked", - "/g2/en/examples/column/stack#stacked", - "/f2/en/examples/column/stack#stacked" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "percentstackhistogram", - "name": "百分比堆\n叠柱状图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-histogram"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*nl5pTowaN5EAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/percentageStack", - "/g2/zh/examples/column/stack#stacked-percentage", - "/f2/zh/examples/column/stack#percent" - ], - "links_en": [ - "/g2plot/en/examples/column/stack#stacked-percentage", - "/g2/en/examples/column/stack#stacked-percentage", - "/f2/en/examples/column/stack#stacked-percentage" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "intervalhistogram", - "name": "区间柱状图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-histogram"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*5FIvRblZNooAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/column/basic#ranged", - "/f2/zh/examples/column/basic#ranged" - ], - "links_en": [ - "/g2/en/examples/column/basic#ranged", - "/f2/zh/examples/column/basic#ranged" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "waterfall", - "name": "瀑布图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-histogram"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*QLMTR4jmABYAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/column/basic#waterfall"], - "links_en": ["/g2/en/examples/column/basic#waterfall"], - "linkNames": ["G2"] - }, - { - "id": "histogramunit", - "name": "直方图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-histogram"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*WI97SJBgaCwAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/histogram", - "/g2/zh/examples/column/histogram#histogram" - ], - "links_en": [ - "/g2plot/en/examples/column/histogram#histogram", - "/g2/en/examples/column/histogram#histogram" - ], - "linkNames": ["G2Plot", "G2"] - }, - { - "id": "basicbarchart", - "name": "基础条形图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-barchart"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*RENoRrj3PugAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/bar/basic", - "/g2/zh/examples/bar/basic", - "/f2/zh/examples/bar/basic" - ], - "links_en": [ - "/g2plot/en/examples/bar/basic", - "/g2/en/examples/bar/basic", - "/f2/en/examples/bar/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "stackbarchart", - "name": "堆叠条形图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-barchart"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*JKcNRbvHZAwAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/bar/stack", - "/g2/zh/examples/bar/stack", - "/f2/zh/examples/bar/stack" - ], - "links_en": [ - "/g2plot/en/examples/bar/stack#stacked", - "/g2/en/examples/bar/stack#stacked", - "/f2/en/examples/bar/stack" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "percentstackbarchart", - "name": "百分比堆\n叠条形图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-barchart"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*nl5pTowaN5EAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/bar/percentageStack", - "/g2/zh/examples/bar/stack#bar-percentage-stacked-marked", - "/f2/zh/examples/bar/stack#bar-percentage-stacked-marked" - ], - "links_en": [ - "/g2plot/en/examples/bar/stack#bar-percentage-stacked-marked", - "/g2/en/examples/bar/stack#bar-percentage-stacked-marked", - "/f2/en/examples/bar/stack#bar-percentage-stacked-marked" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "groupbarchart", - "name": "分组条形图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-barchart"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*ERLHR55JdTgAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/bar/group", - "/g2/zh/examples/bar/dodge", - "/f2/zh/examples/bar/stack#percent" - ], - "links_en": [ - "/g2plot/en/examples/bar/group", - "/g2/en/examples/bar/dodge", - "/f2/en/examples/bar/dodge" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "intervalbarchart", - "name": "区间条形图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-barchart"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*G6vWT52rdz4AAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/bar/basic#ranged"], - "links_en": ["/g2/en/examples/bar/basic#ranged"], - "linkNames": ["G2"] - }, - { - "id": "radiobarchart", - "name": "玉珏图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-barchart"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*5EwoQYlQ4q4AAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/bar/basic#radial-bar"], - "links_en": ["/g2/en/examples/bar/basic#radial-bar"], - "linkNames": ["G2"] - }, - { - "id": "symetricgroupbarchart", - "name": "对称分组\n条形图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-barchart"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*-y0dTbzSPycAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/bar/dodge#bar5"], - "links_en": ["/g2/en/examples/bar/dodge#bar5"], - "linkNames": ["G2"] - }, - { - "id": "basicpiechart", - "name": "基础饼图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-piechart"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*ka5WSJgUllkAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/pie/basic", - "/g2/zh/examples/pie/basic", - "/f2/zh/examples/pie/basic" - ], - "links_en": [ - "/g2plot/en/examples/pie/basic", - "/g2/en/examples/pie/basic", - "/f2/en/examples/pie/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "ringpiechart", - "name": "环图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-piechart"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*NkK1T7VLgjkAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/pie/ring", - "/g2/zh/examples/pie/donut", - "/f2/zh/examples/pie/donut" - ], - "links_en": [ - "/g2plot/en/examples/pie/ring", - "/g2/en/examples/pie/donut#donut", - "/f2/en/examples/pie/donut#donut" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "nestpiechart", - "name": "嵌套饼图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-piechart"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*JFtYRK6qeeUAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/pie/nested"], - "links_en": ["/g2/en/examples/pie/nested"], - "linkNames": ["G2"] - }, - { - "id": "nightingalechart", - "name": "南丁格尔图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-piechart"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*FBnUR449kzYAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/pie/rose#color-rose", - "/f2/zh/examples/pie/rose#rose" - ], - "links_en": [ - "/g2/en/examples/pie/rose#color-rose", - "/f2/en/examples/pie/rose#color-rose" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "scatterplotunit", - "name": "散点图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-scatterplot"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*UQo_Rav7tO4AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/point/scatter", - "/f2/zh/examples/point/scatter" - ], - "links_en": [ - "/g2/en/examples/point/scatter#scatter", - "/f2/en/examples/point/scatter#scatter" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "bublescatterplot", - "name": "散点\n气泡图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-scatterplot"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*tJcRQa5kI10AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/point/scatter#bubble", - "/f2/zh/examples/point/scatter#bubble" - ], - "links_en": [ - "/g2/en/examples/point/scatter#bubble", - "/f2/en/examples/point/scatter#bubble" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "circulararcdiagram", - "name": "环形弧线图", - "level": 2, - "isLeaf": true, - "tags": ["graph"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*DltUTa3ASJ8AAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/arcDiagram#circularArcDiagram"], - "links_en": ["/g6/en/examples/net/arcDiagram#circularArcDiagram"], - "linkNames": ["G6"] - }, - { - "id": "arcdiagram", - "name": "弧线图", - "level": 2, - "isLeaf": true, - "tags": ["graph"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*aVzrSI3NAtAAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/arcDiagram"], - "links_en": ["/g6/en/examples/net/arcDiagram"], - "linkNames": ["G6"] - }, - { - "id": "chorddiagram", - "name": "和弦图", - "level": 2, - "isLeaf": true, - "tags": ["graph"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*KEDoQrZdzXUAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/relation/relation#chord"], - "links_en": ["/g2/en/examples/relation/relation#chord"], - "linkNames": ["G2"] - }, - { - "id": "treemap", - "name": "矩阵树图", - "level": 2, - "isLeaf": true, - "tags": ["graph"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*nUuaSpgmG6UAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/relation/relation#treemap-children", - "/f2/zh/examples/relation/relation#treemap" - ], - "links_en": [ - "/g2/en/examples/relation/relation#treemap-children", - "/f2/en/examples/relation/relation#treemap" - ], - "linkNames": ["G2"] - }, - { - "id": "sankey", - "name": "桑基图", - "level": 2, - "isLeaf": true, - "tags": ["graph"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*iuHTTJRzTW4AAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/relation/relation#sankey"], - "links_en": ["/g2/en/examples/relation/relation#sankey"], - "linkNames": ["G2"] - }, - { - "id": "basicfunnel", - "name": "基础漏斗图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-flowplot"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*TqKWT57XsrIAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/funnel/funnel"], - "links_en": ["/g2/en/examples/funnel/funnel"], - "linkNames": ["G2"] - }, - { - "id": "comparefunnel", - "name": "对比漏斗图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-flowplot"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Q5tSQJMDvCoAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/funnel/funnel#comparision"], - "links_en": ["/g2/en/examples/funnel/funnel#comparision"], - "linkNames": ["G2"] - }, - { - "id": "symetricfunnel", - "name": "对称漏斗图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-flowplot"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*GyMBTqqGY_wAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/funnel/funnel#symmetric"], - "links_en": ["/g2/en/examples/funnel/funnel#symmetric"], - "linkNames": ["G2"] - }, - { - "id": "binchart", - "name": "箱型图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-statisticchartothers"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*xhSaRb16RzYAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/box/box"], - "links_en": ["/g2/en/examples/box/box"], - "linkNames": ["G2"] - }, - { - "id": "colorblockheatmap", - "name": "色块热力图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-statisticchartothers"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*eS0LS5wt6wwAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/heatmap/heatmap#basic", - "/f2/zh/examples/heatmap/heatmap#basic" - ], - "links_en": [ - "/g2/en/examples/heatmap/heatmap#basic", - "/f2/en/examples/heatmap/heatmap#basic" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "basicheatmap", - "name": "基础热力图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-statisticchartothers"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Te9gRYpVq0cAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/heatmap/heatmap#image"], - "links_en": ["/g2/en/examples/heatmap/heatmap#image"], - "linkNames": ["G2"] - }, - { - "id": "instrument", - "name": "仪表盘", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-statisticchartothers"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*McoQQpjJFwkAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/gauge/basic", - "/g2/zh/examples/gauge/gauge", - "/f2/zh/examples/gallery/gauge" - ], - "links_en": [ - "/g2plot/en/examples/gauge/basic", - "/g2/en/examples/gauge/gauge#basic", - "/f2/en/examples/gauge/gauge#basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "radar", - "name": "雷达图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-statisticchartothers"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*NxMmSabzJGQAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/radar/basic", - "/g2/zh/examples/radar/radar", - "/f2/zh/examples/radar/radar" - ], - "links_en": [ - "/g2plot/zh/examples/radar/basic", - "/g2/en/examples/radar/radar", - "/f2/en/examples/radar/radar" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "stockklines", - "name": "股票k线图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-stockplot"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*GbzaQLwYrFUAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/candlestick/demo#basic", - "/f2/zh/examples/candlestick/basic" - ], - "links_en": [ - "/g2/en/examples/candlestick/demo", - "/f2/en/examples/candlestick/demo" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "wordcloud", - "name": "词云图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-statisticchartothers"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*iHCmSaZ1tCwAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/other/other#word-cloud", - "/f2/zh/examples/other/other#word-cloud" - ], - "links_en": [ - "/g2/en/examples/other/other#word-cloud", - "/f2/en/examples/other/other#word-cloud" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "candlestick", - "name": "烛形图", - "level": 2, - "isLeaf": true, - "tags": ["statisticchart-linechart", "statisticchart-stockplot"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*nOPdTrLtpdMAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/candlestick/demo#k-and-area", - "/f2/zh/examples/candlestick/basic#k" - ], - "links_en": [ - "/g2/en/examples/candlestick/demo#k-and-area", - "/f2/zh/examples/candlestick/demo#k-and-area" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "compactBox", - "name": "紧凑树", - "level": 2, - "isLeaf": true, - "tags": ["graph-tree"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*WGHWQYjLmXoAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/tree/compactBox#tbCompactBox"], - "links_en": ["/g6/en/examples/tree/compactBox#tbCompactBox"], - "linkNames": ["G6"] - }, - { - "id": "dendrogram", - "name": "系统树", - "level": 2, - "isLeaf": true, - "tags": ["graph-tree"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*r51nTJ-Ha5MAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/tree/dendrogram#tbDendrogram"], - "links_en": ["/g6/en/examples/tree/dendrogram#tbDendrogram"], - "linkNames": ["G6"] - }, - { - "id": "mindmap", - "name": "脑图", - "level": 2, - "isLeaf": true, - "tags": ["graph-tree"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*VFXlT6A_g7wAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/tree/mindmap"], - "links_en": ["/g6/en/examples/tree/mindmap"], - "linkNames": ["G6"] - }, - { - "id": "indented", - "name": "缩进树", - "level": 2, - "isLeaf": true, - "tags": ["graph-tree"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*ywVeSJIfeK8AAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/tree/indented"], - "links_en": ["/g6/en/examples/tree/indented"], - "linkNames": ["G6"] - }, - { - "id": "radialtree", - "name": "辐射树", - "level": 2, - "isLeaf": true, - "tags": ["graph-tree"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*vUkTSpv9YqkAAAAAAAAAAABkARQnAQ", - "links": [ - "/g6/zh/examples/tree/radialtree", - "/g2/zh/examples/relation/relation#radial-dendrogram" - ], - "links_en": [ - "/g6/en/examples/tree/radialtree", - "/g2/en/examples/relation/relation#radial-dendrogram" - ], - "linkNames": ["G6", "G2"] - }, - { - "id": "flowdiagram", - "name": "流程图", - "level": 2, - "isLeaf": true, - "tags": ["graph"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*35XETpuMRpsAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/dagreFlow"], - "links_en": ["/g6/en/examples/net/dagreFlow"], - "linkNames": ["G6"] - }, - { - "id": "fruchtermancluster", - "name": "Fruchterman\n聚类", - "level": 2, - "isLeaf": true, - "tags": ["graph"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*8qAMTomesZcAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/furchtermanLayout#fruchtermanClustering"], - "links_en": [ - "/g6/en/examples/net/furchtermanLayout#fruchtermanClustering" - ], - "linkNames": ["G6"] - }, - { - "id": "fruchterman", - "name": "Fruchterman", - "level": 2, - "isLeaf": true, - "tags": ["graph"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*XD22Q7uxddEAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/furchtermanLayout"], - "links_en": ["/g6/en/examples/net/furchtermanLayout"], - "linkNames": ["G6"] - }, - { - "id": "forcedirected", - "name": "力导向图", - "level": 2, - "isLeaf": true, - "tags": ["graph"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*dokGR7uP50oAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/forceDirected"], - "links_en": ["/g6/en/examples/net/forceDirected"], - "linkNames": ["G6"] - }, - { - "id": "circular", - "name": "环形图", - "level": 2, - "isLeaf": true, - "tags": ["graph"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*2ZNjRqRzJggAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/circular"], - "links_en": ["/g6/en/examples/net/circular"], - "linkNames": ["G6"] - }, - { - "id": "spiral", - "name": "螺旋线图", - "level": 2, - "isLeaf": true, - "tags": ["graph"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*5NkUTJyXfIcAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/circular#spiralCircular"], - "links_en": ["/g6/en/examples/net/circular#spiralCircular"], - "linkNames": ["G6"] - }, - { - "id": "radial", - "name": "辐射图", - "level": 2, - "isLeaf": true, - "tags": ["graph"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*KON0Rbv5XtEAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/radialLayout"], - "links_en": ["/g6/en/examples/net/radialLayout"], - "linkNames": ["G6"] - }, - { - "id": "concentric", - "name": "同心圆", - "level": 2, - "isLeaf": true, - "tags": ["graph"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*zxlhRobv7VEAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/concentricLayout"], - "links_en": ["/g6/en/examples/net/concentricLayout"], - "linkNames": ["G6"] - }, - { - "id": "grid", - "name": "网格图", - "level": 2, - "isLeaf": true, - "tags": ["graph"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*wlkBRKmjVNgAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/gridLayout"], - "links_en": ["/g6/en/examples/net/gridLayout"], - "linkNames": ["G6"] - }, - { - "id": "arcdiagram", - "name": "弧线图", - "level": 2, - "isLeaf": true, - "tags": ["graph"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*aVzrSI3NAtAAAAAAAAAAAABkARQnAQ", - "links": [ - "/g6/zh/examples/net/arcDiagram", - "/g2/zh/examples/relation/relation#arc" - ], - "links_en": [ - "/g6/en/examples/net/arcDiagram", - "/g2/en/examples/relation/relation#arc" - ], - "linkNames": ["G6"] - }, - { - "id": "circulararcdiagram", - "name": "环形弧线图", - "level": 2, - "isLeaf": true, - "tags": ["graph"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*DltUTa3ASJ8AAAAAAAAAAABkARQnAQ", - "links": [ - "/g6/zh/examples/net/arcDiagram#circularArcDiagram", - "/g2/zh/examples/relation/relation#arc-polar" - ], - "links_en": [ - "/g6/en/examples/net/arcDiagram#circularArcDiagram", - "/g2/en/examples/relation/relation#arc-polar" - ], - "linkNames": ["G6"] - }, - { - "id": "bubbles", - "name": "气泡图", - "level": 2, - "isLeaf": true, - "tags": ["graph"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*EaIlRqda-VcAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/forceDirected#forceBubbles"], - "links_en": ["/g6/en/examples/net/forceDirected#forceBubbles"], - "linkNames": ["G6"] - }, - - { - "id": "symbollayer", - "name": "符号地图", - "level": 2, - "isLeaf": true, - "tags": ["map-pointlayer"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Af7tQJ_sFdwAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/point/image"], - "links_en": ["/L7/en/examples/point/image"], - "linkNames": ["L7"] - }, - { - "id": "chartmap", - "name": "复合图表\n地图", - "level": 2, - "isLeaf": true, - "tags": ["map-pointlayer"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*KEmSSIB3scwAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/point/chart"], - "links_en": ["/L7/en/examples/point/chart"], - "linkNames": ["L7"] - }, - { - "id": "columnmap", - "name": "3D 柱状\n地图", - "level": 2, - "isLeaf": true, - "tags": ["map-pointlayer"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*1X4mS4yNGSgAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/point/column"], - "links_en": ["/L7/en/examples/point/column"], - "linkNames": ["L7"] - }, - { - "id": "scattermap", - "name": "散点地图", - "level": 2, - "isLeaf": true, - "tags": ["map-pointlayer"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*c2EOQqwR-toAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/point/scatter"], - "links_en": ["/L7/en/examples/point/scatter"], - "linkNames": ["L7"] - }, - { - "id": "pathmap", - "name": "路径地图", - "level": 2, - "isLeaf": true, - "tags": ["map-linelayer"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*J3sVRrzk3egAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/line/path"], - "links_en": ["/L7/en/examples/line/path"], - "linkNames": ["L7"] - }, - { - "id": "isolinemap", - "name": "等值线地图", - "level": 2, - "isLeaf": true, - "tags": ["map-linelayer"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*hHKHSa1PH-MAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/line/isoline"], - "links_en": ["/L7/en/examples/line/isoline"], - "linkNames": ["L7"] - }, - { - "id": "custommakermap", - "name": "自定义\n Maker", - "level": 2, - "isLeaf": true, - "tags": ["map-pointlayer"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*_FJCRpEzM8YAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/point/marker"], - "links_en": ["/L7/en/examples/point/marker"], - "linkNames": ["L7"] - }, - { - "id": "arc3dmap", - "name": "3D 弧线地图", - "level": 2, - "isLeaf": true, - "tags": ["map-linelayer"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*5cnzS4A3968AAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/line/arc"], - "links_en": ["/L7/en/examples/line/arc"], - "linkNames": ["L7"] - }, - { - "id": "choroplethmap", - "name": "分类填充图", - "level": 2, - "isLeaf": true, - "tags": ["map-polygonlayer"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*TSGQRowxmmAAAAAAAAAAAABkARQnAQ", - "links": [ - "/L7/zh/examples/polygon/fill", - "/g2/zh/examples/map/map#choropleth-map" - ], - "links_en": [ - "/L7/en/examples/polygon/fill", - "/g2/en/examples/map/map#choropleth-map" - ], - "linkNames": ["L7", "G2"] - }, - { - "id": "extrudemap", - "name": "3D 填充地图", - "level": 2, - "isLeaf": true, - "tags": ["map-polygonlayer"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*l9D1QK5-z-8AAAAAAAAAAABkARQnAQ", - "links": [ - "/L7/zh/examples/polygon/3d", - "/g2/zh/examples/map/map#choropleth-map" - ], - "links_en": [ - "/L7/en/examples/polygon/3d", - "/g2/en/examples/map/map#choropleth-map" - ], - "linkNames": ["L7", "G2"] - }, - { - "id": "hexagonalheatmap", - "name": "蜂窝热力图", - "level": 2, - "isLeaf": true, - "tags": ["map-heatmap"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*YbKcRbypQ_oAAAAAAAAAAABkARQnAQ", - "links": [ - "/L7/zh/examples/heatmap/hexagon", - "/g2/zh/examples/map/map#hex-choropleth-map" - ], - "links_en": [ - "/L7/en/examples/heatmap/hexagon", - "/g2/en/examples/map/map#hex-choropleth-map" - ], - "linkNames": ["L7", "G2"] - }, - { - "id": "3dhexagonalheatmap", - "name": "3D 蜂窝\n热力图", - "level": 2, - "isLeaf": true, - "tags": ["map-heatmap"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*l9D1QK5-z-8AAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/heatmap/hexagon#light"], - "links_en": ["/L7/en//examples/heatmap/hexagon#light"], - "linkNames": ["L7"] - }, - { - "id": "classicalheatmap", - "name": "经典热力图", - "level": 2, - "isLeaf": true, - "tags": ["map-heatmap"], - "imgSrc": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*HxpoRIcBA80AAAAAAAAAAABkARQnAQ", - "links": [ - "/L7/zh/examples/heatmap/heatmap", - "/g2/zh/examples/map/map#with-heatmap" - ], - "links_en": [ - "/L7/en/examples/heatmap/heatmap", - "/g2/en/examples/map/map#with-heatmap" - ], - "linkNames": ["L7", "G2"] - }, - { - "id": "gridbinheatmap", - "name": "网格\n热力图", - "level": 2, - "isLeaf": true, - "tags": ["map-heatmap"], - "imgSrc": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*tAGKS6EClQ4AAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/heatmap/grid#grid1"], - "links_en": ["/L7/en/examples/heatmap/grid#grid1"], - "linkNames": ["L7"] - }, - - { - "id": "circlepacking", - "name": "圆堆积图", - "level": 2, - "isLeaf": true, - "tags": ["graph-tree"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*nbfsS6Fe8mgAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/relation/relation#circle-packing"], - "links_en": ["/g2/en/examples/relation/relation#circle-packing"], - "linkNames": ["G2"] - }, - { - "id": "polartreemap", - "name": "极坐标树图", - "level": 2, - "isLeaf": true, - "tags": ["graph-tree"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*HGyHQbd3esQAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/relation/relation#polar-treemap"], - "links_en": ["/g2/en/examples/relation/relation#polar-treemap"], - "linkNames": ["G2"] - }, - { - "id": "sunburstdiagram", - "name": "旭日图", - "level": 2, - "isLeaf": true, - "tags": ["graph-tree"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*6vuVTqshFqgAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/relation/relation#sunburst"], - "links_en": ["/g2/en/examples/relation/relation#sunburst"], - "linkNames": ["G2"] - } - ], - "edges": [ - { - "source": "tree", - "target": "sunburstdiagram" - }, - { - "source": "tree", - "target": "circlepacking" - }, - { - "source": "tree", - "target": "polartreemap" - }, - { - "source": "statisticchart", - "target": "linechart" - }, - { - "source": "statisticchart", - "target": "areachart" - }, - { - "source": "statisticchart", - "target": "stockplot" - }, - { - "source": "statisticchart", - "target": "histogram" - }, - { - "source": "statisticchart", - "target": "barchart" - }, - { - "source": "statisticchart", - "target": "piechart" - }, - { - "source": "statisticchart", - "target": "scatterplot" - }, - { - "source": "graph", - "target": "tree" - }, - { - "source": "statisticchart", - "target": "flowplot" - }, - { - "source": "map", - "target": "pointlayer" - }, - { - "source": "map", - "target": "linelayer" - }, - { - "source": "map", - "target": "polygonlayer" - }, - { - "source": "map", - "target": "heatmap" - }, - { - "source": "statisticchart", - "target": "stock" - }, - { - "source": "statisticchart", - "target": "flowplot" - }, - { - "source": "flowplot", - "target": "basicfunnel" - }, - - { - "source": "linechart", - "target": "basiclinechart" - }, - { - "source": "linechart", - "target": "multilinechart" - }, - { - "source": "areachart", - "target": "basicareachart" - }, - { - "source": "areachart", - "target": "stackareachart" - }, - { - "source": "areachart", - "target": "percentstackareachart" - }, - { - "source": "areachart", - "target": "intervalareachart" - }, - { - "source": "areachart", - "target": "streamchart" - }, - { - "source": "histogram", - "target": "basichistogram" - }, - { - "source": "histogram", - "target": "grouphistogram" - }, - { - "source": "histogram", - "target": "stackhistogram" - }, - { - "source": "histogram", - "target": "percentstackhistogram" - }, - { - "source": "histogram", - "target": "intervalhistogram" - }, - { - "source": "histogram", - "target": "waterfall" - }, - { - "source": "histogram", - "target": "histogramunit" - }, - { - "source": "barchart", - "target": "basicbarchart" - }, - { - "source": "barchart", - "target": "percentstackbarchart" - }, - { - "source": "barchart", - "target": "stackbarchart" - }, - { - "source": "barchart", - "target": "percentbarchart" - }, - { - "source": "barchart", - "target": "groupbarchart" - }, - { - "source": "barchart", - "target": "intervalbarchart" - }, - { - "source": "barchart", - "target": "radiobarchart" - }, - { - "source": "barchart", - "target": "symetricgroupbarchart" - }, - { - "source": "piechart", - "target": "basicpiechart" - }, - { - "source": "piechart", - "target": "ringpiechart" - }, - { - "source": "piechart", - "target": "nightingalechart" - }, - { - "source": "piechart", - "target": "nestpiechart" - }, - { - "source": "scatterplot", - "target": "scatterplotunit" - }, - { - "source": "scatterplot", - "target": "bublescatterplot" - }, - { - "source": "scatterplot", - "target": "bubblescatterplot" - }, - { - "source": "graph", - "target": "circulararcdiagram" - }, - { - "source": "graph", - "target": "arcdiagram" - }, - { - "source": "graph", - "target": "chorddiagram" - }, - { - "source": "graph", - "target": "treemap" - }, - { - "source": "graph", - "target": "sankey" - }, - { - "source": "flowplot", - "target": "basicfunnel" - }, - { - "source": "flowplot", - "target": "comparefunnel" - }, - { - "source": "flowplot", - "target": "symetricfunnel" - }, - { - "source": "pointlayer", - "target": "bubblemap" - }, - { - "source": "statisticchart", - "target": "statisticchartothers" - }, - { - "source": "statisticchartothers", - "target": "binchart" - }, - { - "source": "statisticchartothers", - "target": "colorblockheatmap" - }, - { - "source": "statisticchartothers", - "target": "basicheatmap" - }, - { - "source": "statisticchartothers", - "target": "instrument" - }, - { - "source": "statisticchartothers", - "target": "radar" - }, - { - "source": "stockplot", - "target": "stockklines" - }, - { - "source": "statisticchartothers", - "target": "wordcloud" - }, - { - "source": "linechart", - "target": "candlestick" - }, - { - "source": "stockplot", - "target": "candlestick" - }, - { - "source": "tree", - "target": "compactBox" - }, - { - "source": "tree", - "target": "dendrogram" - }, - { - "source": "tree", - "target": "mindmap" - }, - { - "source": "tree", - "target": "indented" - }, - { - "source": "tree", - "target": "radialtree" - }, - { - "source": "graph", - "target": "flowdiagram" - }, - { - "source": "graph", - "target": "fruchtermancluster" - }, - - { - "source": "graph", - "target": "fruchterman" - }, - { - "source": "graph", - "target": "forcedirected" - }, - { - "source": "graph", - "target": "circular" - }, - { - "source": "graph", - "target": "spiral" - }, - { - "source": "graph", - "target": "radial" - }, - { - "source": "graph", - "target": "concentric" - }, - { - "source": "graph", - "target": "grid" - }, - { - "source": "graph", - "target": "chorddiagram" - }, - { - "source": "graph", - "target": "arddiagram" - }, - { - "source": "graph", - "target": "circulararddiagram" - }, - { - "source": "graph", - "target": "bubbles" - }, - { - "source": "pointlayer", - "target": "symbollayer" - }, - { - "source": "pointlayer", - "target": "chartmap" - }, - { - "source": "pointlayer", - "target": "columnmap" - }, - { - "source": "pointlayer", - "target": "scattermap" - }, - { - "source": "pointlayer", - "target": "custommakermap" - }, - { - "source": "pointlayer", - "target": "bubblemap" - }, - { - "source": "linelayer", - "target": "pathmap" - }, - { - "source": "linelayer", - "target": "isolinemap" - }, - { - "source": "linelayer", - "target": "arc3dmap" - }, - { - "source": "polygonlayer", - "target": "horoplethmap" - }, - { - "source": "polygonlayer", - "target": "choroplethmap" - }, - { - "source": "polygonlayer", - "target": "extrudemap" - }, - { - "source": "heatmap", - "target": "3dhexagonalheatmap" - }, - { - "source": "heatmap", - "target": "gridbinheatmap" - }, - { - "source": "heatmap", - "target": "hexagonalheatmap" - }, - { - "source": "heatmap", - "target": "classicalheatmap" - } - ] -} diff --git a/site/data/decision-tree-datatype.json b/site/data/decision-tree-datatype.json deleted file mode 100644 index c636e2bd2..000000000 --- a/site/data/decision-tree-datatype.json +++ /dev/null @@ -1,1718 +0,0 @@ -{ - "nodes": [ - { - "id": "numeric", - "name": "数值型", - "level": 0, - "childrenNum": 51, - "tag": "numeric" - }, - { - "id": "timeseries", - "name": "时序型", - "level": 0, - "childrenNum": 17, - "tag": "timeseries" - }, - { - "id": "category", - "name": "分类型", - "level": 0, - "childrenNum": 36, - "tag": "category" - }, - { - "id": "geography", - "name": "地理型", - "level": 0, - "childrenNum": 15, - "tag": "geography" - }, - { - "id": "relational", - "name": "关系型", - "level": 0, - "tag": "relational", - "childrenNum": 19 - }, - - { - "id": "tree", - "name": "树", - "level": 1, - "childrenNum": 9, - "tag": "tree", - "isLeaf": false, - "tags": ["relational"] - }, - - { - "id": "basiclinechart", - "name": "基础折线", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "timeseries"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*JXRgQ4tcm1kAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/line/basic", - "/g2/zh/examples/line/basic", - "/f2/zh/examples/line/basic" - ], - "links_en": [ - "/g2plot/en/examples/line/basic", - "/g2/en/examples/line/basic", - "/f2/en/examples/line/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "multilinechart", - "name": "多折线图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "timeseries"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*gnbiSo8DaEwAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/line/multiple", - "/g2/zh/examples/line/multiple", - "/f2/zh/examples/line/multiple" - ], - "links_en": [ - "/g2plot/en/examples/line/multiple", - "/g2/en/examples/line/multiple", - "/f2/en/examples/line/multiple" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "basicareachart", - "name": "基础面积图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "timeseries"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Zv4oSrF6JDYAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/area/basic", - "/g2/zh/examples/area/basic", - "/f2/zh/examples/area/basic" - ], - "links_en": [ - "/g2plot/en/examples/area/basic", - "/g2/en/examples/area/basic", - "/f2/en/examples/area/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "stackareachart", - "name": "堆叠面积图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "timeseries"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*YoCuRoNaN8kAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/area/stack", - "/g2/zh/examples/area/stacked#stacked", - "/g]f2/zh/examples/area/stacked#stacked" - ], - "links_en": [ - "/g2plot/en/examples/area/stacked", - "/g2/en/examples/area/stacked", - "/f2/en/examples/area/stacked" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "percentstackareachart", - "name": "百分比堆\n叠面积图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "timeseries"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*NMkWRLm2_8IAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/area/percentageArea", - "/g2/zh/examples/area/stacked#percentage", - "/f2/zh/examples/area/stacked#percent" - ], - "links_en": [ - "/g2plot/en/examples/area/percentageArea", - "/g2/en/examples/area/stacked#percentage", - "/f2/en/examples/area/stacked#percent" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "intervalareachart", - "name": "区间面积图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "timeseries"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*wX5sTajQpn4AAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/area/range"], - "links_en": ["/g2/en/examples/area/range"], - "linkNames": ["G2"] - }, - { - "id": "streamchart", - "name": "河流图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "timeseries"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*-lFRTootQesAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/area/stacked#streamgraph"], - "links_en": ["/g2/en/examples/area/stacked#streamgraph"], - "linkNames": ["G2"] - }, - { - "id": "basichistogram", - "name": "基础柱状图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "timeseries", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*V9UkSqvdud4AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/basic", - "/g2/zh/examples/column/basic", - "/f2/zh/examples/column/basic" - ], - "links_en": [ - "/g2plot/en/examples/column/basic", - "/g2/en/examples/column/basic", - "/f2/en/examples/column/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "grouphistogram", - "name": "分组柱状图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*qjpuT6qOKG0AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/group", - "/g2/zh/examples/column/dodge", - "/f2/zh/examples/column/dodge" - ], - "links_en": [ - "/g2plot/en/examples/column/dodge", - "/g2/en/examples/column/dodge", - "/f2/en/examples/column/dodge" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "stackhistogram", - "name": "堆叠柱状图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*l8T0QYLvYocAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/stack#stacked", - "/g2/zh/examples/column/stack#stacked", - "/f2/zh/examples/column/stack#stacked" - ], - "links_en": [ - "/g2plot/en/examples/column/stack#stacked", - "/g2/en/examples/column/stack#stacked", - "/f2/en/examples/column/stack#stacked" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "percentstackhistogram", - "name": "百分比堆\n叠柱状图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*nl5pTowaN5EAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/percentageStack", - "/g2/zh/examples/column/stack#stacked-percentage", - "/f2/zh/examples/column/stack#percent" - ], - "links_en": [ - "/g2plot/en/examples/column/stack#stacked-percentage", - "/g2/en/examples/column/stack#stacked-percentage", - "/f2/en/examples/column/stack#stacked-percentage" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "intervalhistogram", - "name": "区间柱状图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*5FIvRblZNooAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/column/basic#ranged", - "/f2/zh/examples/column/basic#ranged" - ], - "links_en": [ - "/g2/en/examples/column/basic#ranged", - "/f2/zh/examples/column/basic#ranged" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "waterfall", - "name": "瀑布图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*QLMTR4jmABYAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/column/basic#waterfall"], - "links_en": ["/g2/en/examples/column/basic#waterfall"], - "linkNames": ["G2"] - }, - { - "id": "histogramunit", - "name": "直方图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category", "timeseries"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*WI97SJBgaCwAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/histogram", - "/g2/zh/examples/column/histogram#histogram" - ], - "links_en": [ - "/g2plot/en/examples/column/histogram#histogram", - "/g2/en/examples/column/histogram#histogram" - ], - "linkNames": ["G2Plot", "G2"] - }, - { - "id": "basicbarchart", - "name": "基础条形图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category", "timeseries"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*RENoRrj3PugAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/bar/basic", - "/g2/zh/examples/bar/basic", - "/f2/zh/examples/bar/basic" - ], - "links_en": [ - "/g2plot/en/examples/bar/basic", - "/g2/en/examples/bar/basic", - "/f2/en/examples/bar/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "stackbarchart", - "name": "堆叠条形图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category", "timeseries"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*JKcNRbvHZAwAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/bar/stack", - "/g2/zh/examples/bar/stack", - "/f2/zh/examples/bar/stack" - ], - "links_en": [ - "/g2plot/en/examples/bar/stack#stacked", - "/g2/en/examples/bar/stack#stacked", - "/f2/en/examples/bar/stack" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "percentstackbarchart", - "name": "百分比堆\n叠条形图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category", "timeseries"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*nl5pTowaN5EAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/bar/percentageStack", - "/g2/zh/examples/bar/stack#bar-percentage-stacked-marked", - "/f2/zh/examples/bar/stack#bar-percentage-stacked-marked" - ], - "links_en": [ - "/g2plot/en/examples/bar/stack#bar-percentage-stacked-marked", - "/g2/en/examples/bar/stack#bar-percentage-stacked-marked", - "/f2/en/examples/bar/stack#bar-percentage-stacked-marked" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "groupbarchart", - "name": "分组条形图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category", "timeseries"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*ERLHR55JdTgAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/bar/group", - "/g2/zh/examples/bar/dodge", - "/f2/zh/examples/bar/stack#percent" - ], - "links_en": [ - "/g2plot/en/examples/bar/group", - "/g2/en/examples/bar/dodge", - "/f2/en/examples/bar/dodge" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "intervalbarchart", - "name": "区间条形图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category", "timeseries"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*G6vWT52rdz4AAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/bar/basic#ranged"], - "links_en": ["/g2/en/examples/bar/basic#ranged"], - "linkNames": ["G2"] - }, - { - "id": "radiobarchart", - "name": "玉珏图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*5EwoQYlQ4q4AAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/bar/basic#radial-bar"], - "links_en": ["/g2/en/examples/bar/basic#radial-bar"], - "linkNames": ["G2"] - }, - { - "id": "symetricgroupbarchart", - "name": "对称分组\n条形图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*-y0dTbzSPycAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/bar/dodge#bar5"], - "links_en": ["/g2/en/examples/bar/dodge#bar5"], - "linkNames": ["G2"] - }, - { - "id": "basicpiechart", - "name": "基础饼图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*ka5WSJgUllkAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/pie/basic", - "/g2/zh/examples/pie/basic", - "/f2/zh/examples/pie/basic" - ], - "links_en": [ - "/g2plot/en/examples/pie/basic", - "/g2/en/examples/pie/basic", - "/f2/en/examples/pie/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "ringpiechart", - "name": "环图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*NkK1T7VLgjkAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/pie/ring", - "/g2/zh/examples/pie/donut", - "/f2/zh/examples/pie/donut" - ], - "links_en": [ - "/g2plot/en/examples/pie/ring", - "/g2/en/examples/pie/donut#donut", - "/f2/en/examples/pie/donut#donut" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "nestpiechart", - "name": "嵌套饼图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*JFtYRK6qeeUAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/pie/nested"], - "links_en": ["/g2/en/examples/pie/nested"], - "linkNames": ["G2"] - }, - { - "id": "nightingalechart", - "name": "南丁格尔图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*FBnUR449kzYAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/pie/rose#color-rose", - "/f2/zh/examples/pie/rose#rose" - ], - "links_en": [ - "/g2/en/examples/pie/rose#color-rose", - "/f2/en/examples/pie/rose#color-rose" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "scatterplotunit", - "name": "散点图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*UQo_Rav7tO4AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/point/scatter", - "/f2/zh/examples/point/scatter" - ], - "links_en": [ - "/g2/en/examples/point/scatter#scatter", - "/f2/en/examples/point/scatter#scatter" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "bubblescatterplot", - "name": "散点\n气泡图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*tJcRQa5kI10AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/point/scatter#bubble", - "/f2/zh/examples/point/scatter#bubble" - ], - "links_en": [ - "/g2/en/examples/point/scatter#bubble", - "/f2/en/examples/point/scatter#bubble" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "circulararcdiagram", - "name": "环形弧线图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "relational"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*DltUTa3ASJ8AAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/arcDiagram#circularArcDiagram"], - "links_en": ["/g6/en/examples/net/arcDiagram#circularArcDiagram"], - "linkNames": ["G6"] - }, - { - "id": "arcdiagram", - "name": "弧线图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "relational"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*aVzrSI3NAtAAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/arcDiagram"], - "links_en": ["/g6/en/examples/net/arcDiagram"], - "linkNames": ["G6"] - }, - { - "id": "chorddiagram", - "name": "和弦图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "relational"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*KEDoQrZdzXUAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/relation/relation#chord"], - "links_en": ["/g2/en/examples/relation/relation#chord"], - "linkNames": ["G2"] - }, - { - "id": "treemap", - "name": "矩阵树图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "relational"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*nUuaSpgmG6UAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/relation/relation#treemap-children", - "/f2/zh/examples/relation/relation#treemap" - ], - "links_en": [ - "/g2/en/examples/relation/relation#treemap-children", - "/f2/en/examples/relation/relation#treemap" - ], - "linkNames": ["G2"] - }, - { - "id": "sankey", - "name": "桑基图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "relational"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*iuHTTJRzTW4AAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/relation/relation#sankey"], - "links_en": ["/g2/en/examples/relation/relation#sankey"], - "linkNames": ["G2"] - }, - { - "id": "basicfunnel", - "name": "基础漏斗图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "relational", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*TqKWT57XsrIAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/funnel/funnel"], - "links_en": ["/g2/en/examples/funnel/funnel"], - "linkNames": ["G2"] - }, - { - "id": "comparefunnel", - "name": "对比漏斗图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "relational", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Q5tSQJMDvCoAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/funnel/funnel#comparision"], - "links_en": ["/g2/en/examples/funnel/funnel#comparision"], - "linkNames": ["G2"] - }, - { - "id": "symetricfunnel", - "name": "对称漏斗图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "relational", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*GyMBTqqGY_wAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/funnel/funnel#symmetric"], - "links_en": ["/g2/en/examples/funnel/funnel#symmetric"], - "linkNames": ["G2"] - }, - { - "id": "binchart", - "name": "箱型图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*xhSaRb16RzYAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/box/box"], - "links_en": ["/g2/en/examples/box/box"], - "linkNames": ["G2"] - }, - { - "id": "colorblockheatmap", - "name": "色块热力图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category", "timeseries"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*eS0LS5wt6wwAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/heatmap/heatmap#basic", - "/f2/zh/examples/heatmap/heatmap#basic" - ], - "links_en": [ - "/g2/en/examples/heatmap/heatmap#basic", - "/f2/en/examples/heatmap/heatmap#basic" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "basicheatmap", - "name": "基础热力图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category", "geography"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Te9gRYpVq0cAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/heatmap/heatmap#image"], - "links_en": ["/g2/en/examples/heatmap/heatmap#image"], - "linkNames": ["G2"] - }, - { - "id": "instrument", - "name": "仪表盘", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*McoQQpjJFwkAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/gauge/basic", - "/g2/zh/examples/gauge/gauge", - "/f2/zh/examples/gallery/gauge" - ], - "links_en": [ - "/g2plot/en/examples/gauge/basic", - "/g2/en/examples/gauge/gauge#basic", - "/f2/en/examples/gauge/gauge#basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "radar", - "name": "雷达图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*NxMmSabzJGQAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/radar/basic", - "/g2/zh/examples/radar/radar", - "/f2/zh/examples/radar/radar" - ], - "links_en": [ - "/g2plot/zh/examples/radar/basic", - "/g2/en/examples/radar/radar", - "/f2/en/examples/radar/radar" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "stockklines", - "name": "股票k线图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "timeseries"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*GbzaQLwYrFUAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/candlestick/demo#basic", - "/f2/zh/examples/candlestick/basic" - ], - "links_en": [ - "/g2/en/examples/candlestick/demo", - "/f2/en/examples/candlestick/demo" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "wordcloud", - "name": "词云图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*iHCmSaZ1tCwAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/other/other#word-cloud", - "/f2/zh/examples/other/other#word-cloud" - ], - "links_en": [ - "/g2/en/examples/other/other#word-cloud", - "/f2/en/examples/other/other#word-cloud" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "candlestick", - "name": "烛形图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "timeseries"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*nOPdTrLtpdMAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/candlestick/demo#k-and-area", - "/f2/zh/examples/candlestick/basic#k" - ], - "links_en": [ - "/g2/en/examples/candlestick/demo#k-and-area", - "/f2/zh/examples/candlestick/demo#k-and-area" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "compactBox", - "name": "紧凑树", - "level": 2, - "isLeaf": true, - "tags": ["relational-tree"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*WGHWQYjLmXoAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/tree/compactBox#tbCompactBox"], - "links_en": ["/g6/en/examples/tree/compactBox#tbCompactBox"], - "linkNames": ["G6"] - }, - { - "id": "dendrogram", - "name": "系统树", - "level": 2, - "isLeaf": true, - "tags": ["relational-tree"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*r51nTJ-Ha5MAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/tree/dendrogram#tbDendrogram"], - "links_en": ["/g6/en/examples/tree/dendrogram#tbDendrogram"], - "linkNames": ["G6"] - }, - { - "id": "mindmap", - "name": "脑图", - "level": 2, - "isLeaf": true, - "tags": ["relational-tree"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*VFXlT6A_g7wAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/tree/mindmap"], - "links_en": ["/g6/en/examples/tree/mindmap"], - "linkNames": ["G6"] - }, - { - "id": "indented", - "name": "缩进树", - "level": 2, - "isLeaf": true, - "tags": ["relational-tree"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*ywVeSJIfeK8AAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/tree/indented"], - "links_en": ["/g6/en/examples/tree/indented"], - "linkNames": ["G6"] - }, - { - "id": "radialtree", - "name": "辐射树", - "level": 2, - "isLeaf": true, - "tags": ["relational-tree"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*vUkTSpv9YqkAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/tree/radialtree"], - "links_en": ["/g6/en/examples/tree/radialtree"], - "linkNames": ["G6"] - }, - { - "id": "flowdiagram", - "name": "流程图", - "level": 2, - "isLeaf": true, - "tags": ["relational"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*35XETpuMRpsAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/dagreFlow"], - "links_en": ["/g6/en/examples/net/dagreFlow"], - "linkNames": ["G6"] - }, - { - "id": "fruchtermancluster", - "name": "Fruchterman\n聚类", - "level": 2, - "isLeaf": true, - "tags": ["relational"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*8qAMTomesZcAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/furchtermanLayout#fruchtermanClustering"], - "links_en": [ - "/g6/en/examples/net/furchtermanLayout#fruchtermanClustering" - ], - "linkNames": ["G6"] - }, - { - "id": "fruchterman", - "name": "Fruchterman", - "level": 2, - "isLeaf": true, - "tags": ["relational"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*XD22Q7uxddEAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/furchtermanLayout"], - "links_en": ["/g6/en/examples/net/furchtermanLayout"], - "linkNames": ["G6"] - }, - { - "id": "forcedirected", - "name": "力导向图", - "level": 2, - "isLeaf": true, - "tags": ["relational"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*dokGR7uP50oAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/forceDirected"], - "links_en": ["/g6/en/examples/net/forceDirected"], - "linkNames": ["G6"] - }, - { - "id": "circular", - "name": "环形图", - "level": 2, - "isLeaf": true, - "tags": ["relational"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*2ZNjRqRzJggAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/circular"], - "links_en": ["/g6/en/examples/net/circular"], - "linkNames": ["G6"] - }, - { - "id": "spiral", - "name": "螺旋线图", - "level": 2, - "isLeaf": true, - "tags": ["relational"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*5NkUTJyXfIcAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/circular#spiralCircular"], - "links_en": ["/g6/en/examples/net/circular#spiralCircular"], - "linkNames": ["G6"] - }, - { - "id": "radial", - "name": "辐射图", - "level": 2, - "isLeaf": true, - "tags": ["relational"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*KON0Rbv5XtEAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/radialLayout"], - "links_en": ["/g6/en/examples/net/radialLayout"], - "linkNames": ["G6"] - }, - { - "id": "concentric", - "name": "同心圆", - "level": 2, - "isLeaf": true, - "tags": ["relational"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*zxlhRobv7VEAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/concentricLayout"], - "links_en": ["/g6/en/examples/net/concentricLayout"], - "linkNames": ["G6"] - }, - { - "id": "grid", - "name": "网格图", - "level": 2, - "isLeaf": true, - "tags": ["relational"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*wlkBRKmjVNgAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/gridLayout"], - "links_en": ["/g6/en/examples/net/gridLayout"], - "linkNames": ["G6"] - }, - { - "id": "bubbles", - "name": "气泡图", - "level": 2, - "isLeaf": true, - "tags": ["relational"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*EaIlRqda-VcAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/forceDirected#forceBubbles"], - "links_en": ["/g6/en/examples/net/forceDirected#forceBubbles"], - "linkNames": ["G6"] - }, - - { - "id": "symbollayer", - "name": "符号地图", - "level": 2, - "isLeaf": true, - "tags": ["geography", "category"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Af7tQJ_sFdwAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/point/image"], - "links_en": ["/L7/en/examples/point/image"], - "linkNames": ["L7"] - }, - { - "id": "chartmap", - "name": "复合图表\n地图", - "level": 2, - "isLeaf": true, - "tags": ["geography"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*KEmSSIB3scwAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/point/chart"], - "links_en": ["/L7/en/examples/point/chart"], - "linkNames": ["L7"] - }, - { - "id": "columnmap", - "name": "3D 柱状\n地图", - "level": 2, - "isLeaf": true, - "tags": ["geography", "numeric"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*1X4mS4yNGSgAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/point/column"], - "links_en": ["/L7/en/examples/point/column"], - "linkNames": ["L7"] - }, - { - "id": "scattermap", - "name": "散点地图", - "level": 2, - "isLeaf": true, - "tags": ["geography"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*c2EOQqwR-toAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/point/scatter"], - "links_en": ["/L7/en/examples/point/scatter"], - "linkNames": ["L7"] - }, - { - "id": "pathmap", - "name": "路径地图", - "level": 2, - "isLeaf": true, - "tags": ["geography"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*J3sVRrzk3egAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/line/path"], - "links_en": ["/L7/en/examples/line/path"], - "linkNames": ["L7"] - }, - { - "id": "isolinemap", - "name": "等值线地图", - "level": 2, - "isLeaf": true, - "tags": ["category", "geography"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*hHKHSa1PH-MAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/line/isoline"], - "links_en": ["/L7/en/examples/line/isoline"], - "linkNames": ["L7"] - }, - { - "id": "custommakermap", - "name": "自定义\n Maker", - "level": 2, - "isLeaf": true, - "tags": ["geography"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*_FJCRpEzM8YAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/point/marker"], - "links_en": ["/L7/en/examples/point/marker"], - "linkNames": ["L7"] - }, - { - "id": "arc3dmap", - "name": "3D 弧线地图", - "level": 2, - "isLeaf": true, - "tags": ["relational", "geography"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*5cnzS4A3968AAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/line/arc"], - "links_en": ["/L7/en/examples/line/arc"], - "linkNames": ["L7"] - }, - { - "id": "choroplethmap", - "name": "分类填充图", - "level": 2, - "isLeaf": true, - "tags": ["category", "geography"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*TSGQRowxmmAAAAAAAAAAAABkARQnAQ", - "links": [ - "/L7/zh/examples/polygon/fill", - "/g2/zh/examples/map/map#choropleth-map" - ], - "links_en": [ - "/L7/en/examples/polygon/fill", - "/g2/en/examples/map/map#choropleth-map" - ], - "linkNames": ["L7", "G2"] - }, - { - "id": "extrudemap", - "name": "3D 填充地图", - "level": 2, - "isLeaf": true, - "tags": ["category", "geography"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*l9D1QK5-z-8AAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/polygon/3d"], - "links_en": ["/L7/en/examples/polygon/3d"], - "linkNames": ["L7"] - }, - { - "id": "hexagonalheatmap", - "name": "蜂窝热力图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "geography"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*YbKcRbypQ_oAAAAAAAAAAABkARQnAQ", - "links": [ - "/L7/zh/examples/heatmap/hexagon", - "/g2/zh/examples/map/map#hex-choropleth-map" - ], - "links_en": [ - "/L7/en/examples/heatmap/hexagon", - "/g2/en/examples/map/map#hex-choropleth-map" - ], - "linkNames": ["L7", "G2"] - }, - { - "id": "3dhexagonalheatmap", - "name": "3D 蜂窝\n热力图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "geography"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*l9D1QK5-z-8AAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/heatmap/hexagon#light"], - "links_en": ["/L7/en//examples/heatmap/hexagon#light"], - "linkNames": ["L7"] - }, - { - "id": "classicalheatmap", - "name": "经典热力图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "geography"], - "imgSrc": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*HxpoRIcBA80AAAAAAAAAAABkARQnAQ", - "links": [ - "/L7/zh/examples/heatmap/heatmap", - "/g2/zh/examples/map/map#with-heatmap" - ], - "links_en": [ - "/L7/en/examples/heatmap/heatmap", - "/g2/en/examples/map/map#with-heatmap" - ], - "linkNames": ["L7", "G2"] - }, - { - "id": "gridbinheatmap", - "name": "网格\n热力图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "geography"], - "imgSrc": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*tAGKS6EClQ4AAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/heatmap/grid#grid1"], - "links_en": ["/L7/en/examples/heatmap/grid#grid1"], - "linkNames": ["L7"] - }, - - { - "id": "circlepacking", - "name": "圆堆积图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category", "relational-tree"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*nbfsS6Fe8mgAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/relation/relation#circle-packing"], - "links_en": ["/g2/en/examples/relation/relation#circle-packing"], - "linkNames": ["G2"] - }, - { - "id": "polartreemap", - "name": "极坐标树图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category", "relational-tree"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*HGyHQbd3esQAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/relation/relation#polar-treemap"], - "links_en": ["/g2/en/examples/relation/relation#polar-treemap"], - "linkNames": ["G2"] - }, - { - "id": "sunburstdiagram", - "name": "旭日图", - "level": 2, - "isLeaf": true, - "tags": ["numeric", "category", "relational-tree"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*6vuVTqshFqgAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/relation/relation#sunburst"], - "links_en": ["/g2/en/examples/relation/relation#sunburst"], - "linkNames": ["G2"] - } - ], - "edges": [ - { - "source": "geography", - "target": "custommakermap" - }, - { - "source": "category", - "target": "isolinemap" - }, - { - "source": "geography", - "target": "isolinemap" - }, - { - "source": "category", - "target": "extrudemap" - }, - { - "source": "geography", - "target": "extrudemap" - }, - { - "source": "category", - "target": "sunburstdiagram" - }, - { - "source": "numeric", - "target": "sunburstdiagram" - }, - { - "source": "tree", - "target": "sunburstdiagram" - }, - { - "source": "category", - "target": "polartreemap" - }, - { - "source": "numeric", - "target": "polartreemap" - }, - { - "source": "tree", - "target": "polartreemap" - }, - { - "source": "numeric", - "target": "circlepacking" - }, - { - "source": "category", - "target": "circlepacking" - }, - { - "source": "tree", - "target": "circlepacking" - }, - { - "source": "relational", - "target": "tree" - }, - - { - "source": "numeric", - "target": "basiclinechart" - }, - { - "source": "timeseries", - "target": "basiclinechart" - }, - { - "source": "numeric", - "target": "multilinechart" - }, - { - "source": "timeseries", - "target": "multilinechart" - }, - { - "source": "numeric", - "target": "basicareachart" - }, - { - "source": "timeseries", - "target": "basicareachart" - }, - { - "source": "timeseries", - "target": "stackareachart" - }, - { - "source": "numeric", - "target": "stackareachart" - }, - { - "source": "timeseries", - "target": "percentstackareachart" - }, - { - "source": "numeric", - "target": "percentstackareachart" - }, - { - "source": "timeseries", - "target": "intervalareachart" - }, - { - "source": "numeric", - "target": "intervalareachart" - }, - { - "source": "numeric", - "target": "streamchart" - }, - { - "source": "timeseries", - "target": "streamchart" - }, - - { - "source": "numeric", - "target": "basichistogram" - }, - { - "source": "category", - "target": "basichistogram" - }, - { - "source": "timeseries", - "target": "basichistogram" - }, - { - "source": "numeric", - "target": "grouphistogram" - }, - { - "source": "category", - "target": "grouphistogram" - }, - { - "source": "numeric", - "target": "stackhistogram" - }, - { - "so urce": "category", - "target": "stackhistogram" - }, - { - "source": "numeric", - "target": "percentstackhistogram" - }, - { - "source": "category", - "target": "percentstackhistogram" - }, - { - "source": "numeric", - "target": "intervalhistogram" - }, - { - "source": "category", - "target": "intervalhistogram" - }, - { - "source": "numeric", - "target": "waterfall" - }, - { - "source": "category", - "target": "waterfall" - }, - { - "source": "numeric", - "target": "histogramunit" - }, - { - "source": "category", - "target": "histogramunit" - }, - { - "source": "timeseries", - "target": "histogramunit" - }, - { - "source": "numeric", - "target": "basicbarchart" - }, - { - "source": "category", - "target": "basicbarchart" - }, - { - "source": "timeseries", - "target": "basicbarchart" - }, - { - "source": "numeric", - "target": "stackbarchart" - }, - { - "source": "category", - "target": "stackbarchart" - }, - { - "source": "timeseries", - "target": "stackbarchart" - }, - { - "source": "numeric", - "target": "percentstackbarchart" - }, - { - "source": "category", - "target": "percentstackbarchart" - }, - { - "source": "timeseries", - "target": "percentstackbarchart" - }, - { - "source": "numeric", - "target": "groupbarchart" - }, - { - "source": "category", - "target": "groupbarchart" - }, - { - "source": "timeseries", - "target": "groupbarchart" - }, - { - "source": "numeric", - "target": "intervalbarchart" - }, - { - "source": "category", - "target": "intervalbarchart" - }, - { - "source": "timeseries", - "target": "intervalbarchart" - }, - { - "source": "numeric", - "target": "radiobarchart" - }, - { - "source": "category", - "target": "radiobarchart" - }, - { - "source": "numeric", - "target": "symetricgroupbarchart" - }, - { - "source": "category", - "target": "symetricgroupbarchart" - }, - { - "source": "numeric", - "target": "basicpiechart" - }, - { - "source": "category", - "target": "basicpiechart" - }, - { - "source": "numeric", - "target": "ringpiechart" - }, - { - "source": "category", - "target": "ringpiechart" - }, - { - "source": "numeric", - "target": "nestpiechart" - }, - { - "source": "category", - "target": "nestpiechart" - }, - { - "source": "numeric", - "target": "nightingalechart" - }, - { - "source": "category", - "target": "nightingalechart" - }, - { - "source": "category", - "target": "scatterplotunit" - }, - { - "source": "numeric", - "target": "scatterplotunit" - }, - { - "source": "numeric", - "target": "bubblescatterplot" - }, - { - "source": "category", - "target": "bubblescatterplot" - }, - { - "source": "numeric", - "target": "circulararcdiagram" - }, - { - "source": "relational", - "target": "circulararcdiagram" - }, - { - "source": "relational", - "target": "arcdiagram" - }, - { - "source": "numeric", - "target": "arcdiagram" - }, - { - "source": "numeric", - "target": "chorddiagram" - }, - { - "source": "relational", - "target": "chorddiagram" - }, - { - "source": "relational", - "target": "treemap" - }, - { - "source": "numeric", - "target": "treemap" - }, - { - "source": "numeric", - "target": "sankey" - }, - { - "source": "relational", - "target": "sankey" - }, - { - "source": "relational", - "target": "basicfunnel" - }, - { - "source": "numeric", - "target": "basicfunnel" - }, - { - "source": "category", - "target": "basicfunnel" - }, - { - "source": "category", - "target": "comparefunnel" - }, - { - "source": "numeric", - "target": "comparefunnel" - }, - { - "source": "relational", - "target": "comparefunnel" - }, - { - "source": "relational", - "target": "symetricfunnel" - }, - { - "source": "numeric", - "target": "symetricfunnel" - }, - { - "source": "category", - "target": "symetricfunnel" - }, - { - "source": "numeric", - "target": "bubblemap" - }, - { - "source": "category", - "target": "bubblemap" - }, - { - "source": "geography", - "target": "bubblemap" - }, - { - "source": "numeric", - "target": "binchart" - }, - { - "source": "category", - "target": "binchart" - }, - { - "source": "numberic", - "target": "colorblockheatmap" - }, - { - "source": "category", - "target": "colorblockheatmap" - }, - { - "source": "timeseries", - "target": "colorblockheatmap" - }, - { - "source": "timeseries", - "target": "basicheatmap" - }, - { - "source": "category", - "target": "basicheatmap" - }, - { - "source": "numeric", - "target": "basicheatmap" - }, - { - "source": "numeric", - "target": "instrument" - }, - { - "source": "category", - "target": "instrument" - }, - { - "source": "category", - "target": "radar" - }, - { - "source": "numeric", - "target": "radar" - }, - { - "source": "numeric", - "target": "stockklines" - }, - { - "source": "timeseries", - "target": "stockklines" - }, - { - "source": "numeric", - "target": "wordcloud" - }, - { - "source": "category", - "target": "wordcloud" - }, - { - "source": "numeric", - "target": "candlestick" - }, - { - "source": "timeseries", - "target": "candlestick" - }, - { - "source": "tree", - "target": "compactBox" - }, - { - "source": "tree", - "target": "dendrogram" - }, - { - "source": "tree", - "target": "mindmap" - }, - { - "source": "tree", - "target": "indented" - }, - { - "source": "tree", - "target": "radialtree" - }, - { - "source": "relational", - "target": "flowdiagram" - }, - { - "source": "relational", - "target": "fruchtermancluster" - }, - { - "source": "relational", - "target": "fruchterman" - }, - { - "source": "relational", - "target": "forcedirected" - }, - { - "source": "relational", - "target": "circular" - }, - - { - "source": "relational", - "target": "spiral" - }, - { - "source": "relational", - "target": "radial" - }, - { - "source": "relational", - "target": "concentric" - }, - { - "source": "relational", - "target": "grid" - }, - { - "source": "relational", - "target": "bubbles" - }, - { - "source": "geography", - "target": "dotmap" - }, - { - "source": "geography", - "target": "symbollayer" - }, - { - "source": "category", - "target": "symbollayer" - }, - { - "source": "geography", - "target": "clustermap" - }, - { - "source": "numeric", - "target": "clustermap" - }, - { - "source": "geography", - "target": "chartmap" - }, - { - "source": "geography", - "target": "columnmap" - }, - { - "source": "numeric", - "target": "columnmap" - }, - { - "source": "geography", - "target": "scattermap" - }, - { - "source": "geography", - "target": "pathmap" - }, - { - "source": "geography", - "target": "relationmap" - }, - { - "source": "relational", - "target": "relationmap" - }, - { - "source": "relational", - "target": "arc3dmap" - }, - { - "source": "geography", - "target": "arc3dmap" - }, - { - "source": "geography", - "target": "choroplethmap" - }, - { - "source": "category", - "target": "choroplethmap" - }, - { - "source": "geography", - "target": "hexagonalheatmap" - }, - { - "source": "numeric", - "target": "hexagonalheatmap" - }, - { - "source": "geography", - "target": "3dhexagonalheatmap" - }, - { - "source": "numeric", - "target": "3dhexagonalheatmap" - }, - { - "source": "geography", - "target": "classicalheatmap" - }, - { - "source": "numeric", - "target": "classicalheatmap" - }, - { - "source": "geography", - "target": "gridbinheatmap" - }, - { - "source": "numeric", - "target": "gridbinheatmap" - } - ] -} diff --git a/site/data/decision-tree-goal.json b/site/data/decision-tree-goal.json deleted file mode 100644 index 81b46da2b..000000000 --- a/site/data/decision-tree-goal.json +++ /dev/null @@ -1,1636 +0,0 @@ -{ - "nodes": [ - { - "id": "trend", - "name": "趋势", - "level": 0, - "childrenNum": 11, - "tag": "trend" - }, - { - "id": "compare", - "name": "比较", - "level": 0, - "childrenNum": 44, - "tag": "compare" - }, - { - "id": "percentage", - "name": "占比", - "level": 0, - "childrenNum": 15, - "tag": "percentage" - }, - { - "id": "flow", - "name": "流程", - "level": 0, - "childrenNum": 4, - "tag": "flow" - }, - { - "id": "distribution", - "name": "分布", - "level": 0, - "tag": "distribution", - "childrenNum": 11 - }, - { - "id": "relation", - "name": "关系", - "level": 0, - "tag": "relation", - "childrenNum": 33 - }, - { - "id": "composition", - "name": "组成", - "level": 0, - "childrenNum": 1, - "tag": "composition" - }, - - { - "id": "clustering", - "name": "聚类", - "level": 1, - "childrenNum": 5, - "tag": "clustering", - "isLeaf": false, - "tags": ["relation"] - }, - { - "id": "hierarchy", - "name": "层次", - "level": 1, - "childrenNum": 8, - "tag": "hierarchy", - "isLeaf": false, - "tags": ["relation"] - }, - - { - "id": "basiclinechart", - "name": "基础折线", - "level": 2, - "isLeaf": true, - "tags": ["trend"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*JXRgQ4tcm1kAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/line/basic", - "/g2/zh/examples/line/basic", - "/f2/zh/examples/line/basic" - ], - "links_en": [ - "/g2plot/en/examples/line/basic", - "/g2/en/examples/line/basic", - "/f2/en/examples/line/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "multilinechart", - "name": "多折线图", - "level": 2, - "isLeaf": true, - "tags": ["trend", "compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*gnbiSo8DaEwAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/line/multiple", - "/g2/zh/examples/line/multiple", - "/f2/zh/examples/line/multiple" - ], - "links_en": [ - "/g2plot/en/examples/line/multiple", - "/g2/en/examples/line/multiple", - "/f2/en/examples/line/multiple" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "basicareachart", - "name": "基础面积图", - "level": 2, - "isLeaf": true, - "tags": ["trend"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Zv4oSrF6JDYAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/area/basic", - "/g2/zh/examples/area/basic", - "/f2/zh/examples/area/basic" - ], - "links_en": [ - "/g2plot/en/examples/area/basic", - "/g2/en/examples/area/basic", - "/f2/en/examples/area/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "stackareachart", - "name": "堆叠面积图", - "level": 2, - "isLeaf": true, - "tags": ["trend", "compare", "percentage"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*YoCuRoNaN8kAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/area/stack", - "/g2/zh/examples/area/stacked#stacked", - "/g]f2/zh/examples/area/stacked#stacked" - ], - "links_en": [ - "/g2plot/en/examples/area/stacked", - "/g2/en/examples/area/stacked", - "/f2/en/examples/area/stacked" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "percentstackareachart", - "name": "百分比堆\n叠面积图", - "level": 2, - "isLeaf": true, - "tags": ["trend", "compare", "percentage"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*NMkWRLm2_8IAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/area/percentageArea", - "/g2/zh/examples/area/stacked#percentage", - "/f2/zh/examples/area/stacked#percent" - ], - "links_en": [ - "/g2plot/en/examples/area/percentageArea", - "/g2/en/examples/area/stacked#percentage", - "/f2/en/examples/area/stacked#percent" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "intervalareachart", - "name": "区间面积图", - "level": 2, - "isLeaf": true, - "tags": ["trend", "compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*wX5sTajQpn4AAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/area/range"], - "links_en": ["/g2/en/examples/area/range"], - "linkNames": ["G2"] - }, - { - "id": "streamchart", - "name": "河流图", - "level": 2, - "isLeaf": true, - "tags": ["trend", "compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*-lFRTootQesAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/area/stacked#streamgraph"], - "links_en": ["/g2/en/examples/area/stacked#streamgraph"], - "linkNames": ["G2"] - }, - { - "id": "basichistogram", - "name": "基础柱状图", - "level": 2, - "isLeaf": true, - "tags": ["compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*V9UkSqvdud4AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/basic", - "/g2/zh/examples/column/basic", - "/f2/zh/examples/column/basic" - ], - "links_en": [ - "/g2plot/en/examples/column/basic", - "/g2/en/examples/column/basic", - "/f2/en/examples/column/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "grouphistogram", - "name": "分组柱状图", - "level": 2, - "isLeaf": true, - "tags": ["compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*qjpuT6qOKG0AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/group", - "/g2/zh/examples/column/dodge", - "/f2/zh/examples/column/dodge" - ], - "links_en": [ - "/g2plot/en/examples/column/dodge", - "/g2/en/examples/column/dodge", - "/f2/en/examples/column/dodge" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "stackhistogram", - "name": "堆叠柱状图", - "level": 2, - "isLeaf": true, - "tags": ["compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*l8T0QYLvYocAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/stack#stacked", - "/g2/zh/examples/column/stack#stacked", - "/f2/zh/examples/column/stack#stacked" - ], - "links_en": [ - "/g2plot/en/examples/column/stack#stacked", - "/g2/en/examples/column/stack#stacked", - "/f2/en/examples/column/stack#stacked" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "percentstackhistogram", - "name": "百分比堆\n叠柱状图", - "level": 2, - "isLeaf": true, - "tags": ["compare", "percentage"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*nl5pTowaN5EAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/percentageStack", - "/g2/zh/examples/column/stack#stacked-percentage", - "/f2/zh/examples/column/stack#percent" - ], - "links_en": [ - "/g2plot/en/examples/column/stack#stacked-percentage", - "/g2/en/examples/column/stack#stacked-percentage", - "/f2/en/examples/column/stack#stacked-percentage" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "intervalhistogram", - "name": "区间柱状图", - "level": 2, - "isLeaf": true, - "tags": ["compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*5FIvRblZNooAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/column/basic#ranged", - "/f2/zh/examples/column/basic#ranged" - ], - "links_en": [ - "/g2/en/examples/column/basic#ranged", - "/f2/zh/examples/column/basic#ranged" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "waterfall", - "name": "瀑布图", - "level": 2, - "isLeaf": true, - "tags": ["compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*QLMTR4jmABYAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/column/basic#waterfall"], - "links_en": ["/g2/en/examples/column/basic#waterfall"], - "linkNames": ["G2"] - }, - { - "id": "histogramunit", - "name": "直方图", - "level": 2, - "isLeaf": true, - "tags": ["compare", "distribution"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*WI97SJBgaCwAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/column/histogram", - "/g2/zh/examples/column/histogram#histogram" - ], - "links_en": [ - "/g2plot/en/examples/column/histogram#histogram", - "/g2/en/examples/column/histogram#histogram" - ], - "linkNames": ["G2Plot", "G2"] - }, - { - "id": "basicbarchart", - "name": "基础条形图", - "level": 2, - "isLeaf": true, - "tags": ["compare", "percentage"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*RENoRrj3PugAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/bar/basic", - "/g2/zh/examples/bar/basic", - "/f2/zh/examples/bar/basic" - ], - "links_en": [ - "/g2plot/en/examples/bar/basic", - "/g2/en/examples/bar/basic", - "/f2/en/examples/bar/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "stackbarchart", - "name": "堆叠条形图", - "level": 2, - "isLeaf": true, - "tags": ["compare", "percentage"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*JKcNRbvHZAwAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/bar/stack", - "/g2/zh/examples/bar/stack", - "/f2/zh/examples/bar/stack" - ], - "links_en": [ - "/g2plot/en/examples/bar/stack#stacked", - "/g2/en/examples/bar/stack#stacked", - "/f2/en/examples/bar/stack" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "percentstackbarchart", - "name": "百分比堆\n叠条形图", - "level": 2, - "isLeaf": true, - "tags": ["compare", "percentage"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*nl5pTowaN5EAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/bar/percentageStack", - "/g2/zh/examples/bar/stack#bar-percentage-stacked-marked", - "/f2/zh/examples/bar/stack#bar-percentage-stacked-marked" - ], - "links_en": [ - "/g2plot/en/examples/bar/stack#bar-percentage-stacked-marked", - "/g2/en/examples/bar/stack#bar-percentage-stacked-marked", - "/f2/en/examples/bar/stack#bar-percentage-stacked-marked" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "groupbarchart", - "name": "分组条形图", - "level": 2, - "isLeaf": true, - "tags": ["compare", "percentage"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*ERLHR55JdTgAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/bar/group", - "/g2/zh/examples/bar/dodge", - "/f2/zh/examples/bar/stack#percent" - ], - "links_en": [ - "/g2plot/en/examples/bar/group", - "/g2/en/examples/bar/dodge", - "/f2/en/examples/bar/dodge" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "intervalbarchart", - "name": "区间条形图", - "level": 2, - "isLeaf": true, - "tags": ["compare", "percentage"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*G6vWT52rdz4AAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/bar/basic#ranged"], - "links_en": ["/g2/en/examples/bar/basic#ranged"], - "linkNames": ["G2"] - }, - { - "id": "radiobarchart", - "name": "玉珏图", - "level": 2, - "isLeaf": true, - "tags": ["compare", "percentage"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*5EwoQYlQ4q4AAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/bar/basic#radial-bar"], - "links_en": ["/g2/en/examples/bar/basic#radial-bar"], - "linkNames": ["G2"] - }, - { - "id": "symetricgroupbarchart", - "name": "对称分组\n条形图", - "level": 2, - "isLeaf": true, - "tags": ["compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*-y0dTbzSPycAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/bar/dodge#bar5"], - "links_en": ["/g2/en/examples/bar/dodge#bar5"], - "linkNames": ["G2"] - }, - { - "id": "basicpiechart", - "name": "基础饼图", - "level": 2, - "isLeaf": true, - "tags": ["percentage"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*ka5WSJgUllkAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/pie/basic", - "/g2/zh/examples/pie/basic", - "/f2/zh/examples/pie/basic" - ], - "links_en": [ - "/g2plot/en/examples/pie/basic", - "/g2/en/examples/pie/basic", - "/f2/en/examples/pie/basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "ringpiechart", - "name": "环图", - "level": 2, - "isLeaf": true, - "tags": ["percentage"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*NkK1T7VLgjkAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/pie/ring", - "/g2/zh/examples/pie/donut", - "/f2/zh/examples/pie/donut" - ], - "links_en": [ - "/g2plot/en/examples/pie/ring", - "/g2/en/examples/pie/donut#donut", - "/f2/en/examples/pie/donut#donut" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "nestpiechart", - "name": "嵌套饼图", - "level": 2, - "isLeaf": true, - "tags": ["percentage"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*JFtYRK6qeeUAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/pie/nested"], - "links_en": ["/g2/en/examples/pie/nested"], - "linkNames": ["G2"] - }, - { - "id": "nightingalechart", - "name": "南丁格尔图", - "level": 2, - "isLeaf": true, - "tags": ["percentage"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*FBnUR449kzYAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/pie/rose#color-rose", - "/f2/zh/examples/pie/rose#rose" - ], - "links_en": [ - "/g2/en/examples/pie/rose#color-rose", - "/f2/en/examples/pie/rose#color-rose" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "scatterplotunit", - "name": "散点图", - "level": 2, - "isLeaf": true, - "tags": ["compare", "distribution", "relation"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*UQo_Rav7tO4AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/point/scatter", - "/f2/zh/examples/point/scatter" - ], - "links_en": [ - "/g2/en/examples/point/scatter#scatter", - "/f2/en/examples/point/scatter#scatter" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "bubblescatterplot", - "name": "散点\n气泡图", - "level": 2, - "isLeaf": true, - "tags": ["compare", "distribution", "relation"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*tJcRQa5kI10AAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/point/scatter#bubble", - "/f2/zh/examples/point/scatter#bubble" - ], - "links_en": [ - "/g2/en/examples/point/scatter#bubble", - "/f2/en/examples/point/scatter#bubble" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "circulararcdiagram", - "name": "环形弧线图", - "level": 2, - "isLeaf": true, - "tags": ["relation"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*DltUTa3ASJ8AAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/arcDiagram#circularArcDiagram"], - "links_en": ["/g6/en/examples/net/arcDiagram#circularArcDiagram"], - "linkNames": ["G6"] - }, - { - "id": "arcdiagram", - "name": "弧线图", - "level": 2, - "isLeaf": true, - "tags": ["relation"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*aVzrSI3NAtAAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/arcDiagram"], - "links_en": ["/g6/en/examples/net/arcDiagram"], - "linkNames": ["G6"] - }, - { - "id": "chorddiagram", - "name": "和弦图", - "level": 2, - "isLeaf": true, - "tags": ["relation"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*KEDoQrZdzXUAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/relation/relation#chord"], - "links_en": ["/g2/en/examples/relation/relation#chord"], - "linkNames": ["G2"] - }, - { - "id": "treemap", - "name": "矩阵树图", - "level": 2, - "isLeaf": true, - "tags": ["percentage", "compare", "relation"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*nUuaSpgmG6UAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/relation/relation#treemap-children", - "/f2/zh/examples/relation/relation#treemap" - ], - "links_en": [ - "/g2/en/examples/relation/relation#treemap-children", - "/f2/en/examples/relation/relation#treemap" - ], - "linkNames": ["G2"] - }, - { - "id": "sankey", - "name": "桑基图", - "level": 2, - "isLeaf": true, - "tags": ["flow", "trend", "relation"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*iuHTTJRzTW4AAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/relation/relation#sankey"], - "links_en": ["/g2/en/examples/relation/relation#sankey"], - "linkNames": ["G2"] - }, - { - "id": "basicfunnel", - "name": "基础漏斗图", - "level": 2, - "isLeaf": true, - "tags": ["flow", "compare", "relation"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*TqKWT57XsrIAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/funnel/funnel"], - "links_en": ["/g2/en/examples/funnel/funnel"], - "linkNames": ["G2"] - }, - { - "id": "comparefunnel", - "name": "对比漏斗图", - "level": 2, - "isLeaf": true, - "tags": ["flow", "compare", "relation"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Q5tSQJMDvCoAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/funnel/funnel#comparision"], - "links_en": ["/g2/en/examples/funnel/funnel#comparision"], - "linkNames": ["G2"] - }, - { - "id": "symetricfunnel", - "name": "对称漏斗图", - "level": 2, - "isLeaf": true, - "tags": ["flow", "compare", "relation"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*GyMBTqqGY_wAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/funnel/funnel#symmetric"], - "links_en": ["/g2/en/examples/funnel/funnel#symmetric"], - "linkNames": ["G2"] - }, - { - "id": "binchart", - "name": "箱型图", - "level": 2, - "isLeaf": true, - "tags": ["distribution", "compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*xhSaRb16RzYAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/box/box"], - "links_en": ["/g2/en/examples/box/box"], - "linkNames": ["G2"] - }, - { - "id": "colorblockheatmap", - "name": "色块热力图", - "level": 2, - "isLeaf": true, - "tags": ["distribution", "compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*eS0LS5wt6wwAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/heatmap/heatmap#basic", - "/f2/zh/examples/heatmap/heatmap#basic" - ], - "links_en": [ - "/g2/en/examples/heatmap/heatmap#basic", - "/f2/en/examples/heatmap/heatmap#basic" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "basicheatmap", - "name": "基础热力图", - "level": 2, - "isLeaf": true, - "tags": ["distribution", "compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Te9gRYpVq0cAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/heatmap/heatmap#image"], - "links_en": ["/g2/en/examples/heatmap/heatmap#image"], - "linkNames": ["G2"] - }, - { - "id": "instrument", - "name": "仪表盘", - "level": 2, - "isLeaf": true, - "tags": ["compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*McoQQpjJFwkAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/gauge/basic", - "/g2/zh/examples/gauge/gauge", - "/f2/zh/examples/gallery/gauge" - ], - "links_en": [ - "/g2plot/en/examples/gauge/basic", - "/g2/en/examples/gauge/gauge#basic", - "/f2/en/examples/gauge/gauge#basic" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "radar", - "name": "雷达图", - "level": 2, - "isLeaf": true, - "tags": ["compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*NxMmSabzJGQAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2plot/zh/examples/radar/basic", - "/g2/zh/examples/radar/radar", - "/f2/zh/examples/radar/radar" - ], - "links_en": [ - "/g2plot/zh/examples/radar/basic", - "/g2/en/examples/radar/radar", - "/f2/en/examples/radar/radar" - ], - "linkNames": ["G2Plot", "G2", "F2"] - }, - { - "id": "stockklines", - "name": "股票k线图", - "level": 2, - "isLeaf": true, - "tags": ["compare", "trend"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*GbzaQLwYrFUAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/candlestick/demo#basic", - "/f2/zh/examples/candlestick/basic" - ], - "links_en": [ - "/g2/en/examples/candlestick/demo", - "/f2/en/examples/candlestick/demo" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "wordcloud", - "name": "词云图", - "level": 2, - "isLeaf": true, - "tags": ["compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*iHCmSaZ1tCwAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/other/other#word-cloud", - "/f2/zh/examples/other/other#word-cloud" - ], - "links_en": [ - "/g2/en/examples/other/other#word-cloud", - "/f2/en/examples/other/other#word-cloud" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "candlestick", - "name": "烛形图", - "level": 2, - "isLeaf": true, - "tags": ["trend"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*nOPdTrLtpdMAAAAAAAAAAABkARQnAQ", - "links": [ - "/g2/zh/examples/candlestick/demo#k-and-area", - "/f2/zh/examples/candlestick/basic#k" - ], - "links_en": [ - "/g2/en/examples/candlestick/demo#k-and-area", - "/f2/zh/examples/candlestick/demo#k-and-area" - ], - "linkNames": ["G2", "F2"] - }, - { - "id": "compactBox", - "name": "紧凑树", - "level": 2, - "isLeaf": true, - "tags": ["relation-hierarchy"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*WGHWQYjLmXoAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/tree/compactBox#tbCompactBox"], - "links_en": ["/g6/en/examples/tree/compactBox#tbCompactBox"], - "linkNames": ["G6"] - }, - { - "id": "dendrogram", - "name": "系统树", - "level": 2, - "isLeaf": true, - "tags": ["relation-hierarchy"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*r51nTJ-Ha5MAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/tree/dendrogram#tbDendrogram"], - "links_en": ["/g6/en/examples/tree/dendrogram#tbDendrogram"], - "linkNames": ["G6"] - }, - { - "id": "mindmap", - "name": "脑图", - "level": 2, - "isLeaf": true, - "tags": ["relation-hierarchy"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*VFXlT6A_g7wAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/tree/mindmap"], - "links_en": ["/g6/en/examples/tree/mindmap"], - "linkNames": ["G6"] - }, - { - "id": "indented", - "name": "缩进树", - "level": 2, - "isLeaf": true, - "tags": ["relation-hierarchy"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*ywVeSJIfeK8AAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/tree/indented"], - "links_en": ["/g6/en/examples/tree/indented"], - "linkNames": ["G6"] - }, - { - "id": "radialtree", - "name": "辐射树", - "level": 2, - "isLeaf": true, - "tags": ["relation-hierarchy"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*vUkTSpv9YqkAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/tree/radialtree"], - "links_en": ["/g6/en/examples/tree/radialtree"], - "linkNames": ["G6"] - }, - { - "id": "flowdiagram", - "name": "流程图", - "level": 2, - "isLeaf": true, - "tags": ["relation"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*35XETpuMRpsAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/dagreFlow"], - "links_en": ["/g6/en/examples/net/dagreFlow"], - "linkNames": ["G6"] - }, - { - "id": "fruchtermancluster", - "name": "Fruchterman\n聚类", - "level": 2, - "isLeaf": true, - "tags": ["relation-clustering"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*8qAMTomesZcAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/furchtermanLayout#fruchtermanClustering"], - "links_en": [ - "/g6/en/examples/net/furchtermanLayout#fruchtermanClustering" - ], - "linkNames": ["G6"] - }, - { - "id": "fruchterman", - "name": "Fruchterman", - "level": 2, - "isLeaf": true, - "tags": ["relation"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*XD22Q7uxddEAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/furchtermanLayout"], - "links_en": ["/g6/en/examples/net/furchtermanLayout"], - "linkNames": ["G6"] - }, - { - "id": "forcedirected", - "name": "力导向图", - "level": 2, - "isLeaf": true, - "tags": ["relation"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*dokGR7uP50oAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/forceDirected"], - "links_en": ["/g6/en/examples/net/forceDirected"], - "linkNames": ["G6"] - }, - { - "id": "circular", - "name": "环形图", - "level": 2, - "isLeaf": true, - "tags": ["relation"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*2ZNjRqRzJggAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/circular"], - "links_en": ["/g6/en/examples/net/circular"], - "linkNames": ["G6"] - }, - { - "id": "spiral", - "name": "螺旋线图", - "level": 2, - "isLeaf": true, - "tags": ["relation"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*5NkUTJyXfIcAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/circular#spiralCircular"], - "links_en": ["/g6/en/examples/net/circular#spiralCircular"], - "linkNames": ["G6"] - }, - { - "id": "radial", - "name": "辐射图", - "level": 2, - "isLeaf": true, - "tags": ["relation"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*KON0Rbv5XtEAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/radialLayout"], - "links_en": ["/g6/en/examples/net/radialLayout"], - "linkNames": ["G6"] - }, - { - "id": "concentric", - "name": "同心圆", - "level": 2, - "isLeaf": true, - "tags": ["relation"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*zxlhRobv7VEAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/concentricLayout"], - "links_en": ["/g6/en/examples/net/concentricLayout"], - "linkNames": ["G6"] - }, - { - "id": "grid", - "name": "网格图", - "level": 2, - "isLeaf": true, - "tags": ["relation"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*wlkBRKmjVNgAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/gridLayout"], - "links_en": ["/g6/en/examples/net/gridLayout"], - "linkNames": ["G6"] - }, - { - "id": "bubbles", - "name": "气泡图", - "level": 2, - "isLeaf": true, - "tags": ["relation", "compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*EaIlRqda-VcAAAAAAAAAAABkARQnAQ", - "links": ["/g6/zh/examples/net/forceDirected#forceBubbles"], - "links_en": ["/g6/en/examples/net/forceDirected#forceBubbles"], - "linkNames": ["G6"] - }, - - { - "id": "symbollayer", - "name": "符号地图", - "level": 2, - "isLeaf": true, - "tags": ["distribution", "compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Af7tQJ_sFdwAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/point/image"], - "links_en": ["/L7/en/examples/point/image"], - "linkNames": ["L7"] - }, - { - "id": "chartmap", - "name": "复合图表\n地图", - "level": 2, - "isLeaf": true, - "tags": ["composition", "distribution", "compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*KEmSSIB3scwAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/point/chart"], - "links_en": ["/L7/en/examples/point/chart"], - "linkNames": ["L7"] - }, - { - "id": "columnmap", - "name": "3D 柱状\n地图", - "level": 2, - "isLeaf": true, - "tags": ["distribution", "compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*1X4mS4yNGSgAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/point/column"], - "links_en": ["/L7/en/examples/point/column"], - "linkNames": ["L7"] - }, - { - "id": "scattermap", - "name": "散点地图", - "level": 2, - "isLeaf": true, - "tags": ["distribution"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*c2EOQqwR-toAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/point/scatter"], - "links_en": ["/L7/en/examples/point/scatter"], - "linkNames": ["L7"] - }, - { - "id": "pathmap", - "name": "路径地图", - "level": 2, - "isLeaf": true, - "tags": ["trend"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*J3sVRrzk3egAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/line/path"], - "links_en": ["/L7/en/examples/line/path"], - "linkNames": ["L7"] - }, - { - "id": "isolinemap", - "name": "等值线地图", - "level": 2, - "isLeaf": true, - "tags": ["compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*hHKHSa1PH-MAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/line/isoline"], - "links_en": ["/L7/en/examples/line/isoline"], - "linkNames": ["L7"] - }, - { - "id": "custommakermap", - "name": "自定义\n Maker", - "level": 2, - "isLeaf": true, - "tags": ["distribution"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*_FJCRpEzM8YAAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/point/marker"], - "links_en": ["/L7/en/examples/point/marker"], - "linkNames": ["L7"] - }, - { - "id": "arc3dmap", - "name": "3D 弧线地图", - "level": 2, - "isLeaf": true, - "tags": ["relation"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*5cnzS4A3968AAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/line/arc"], - "links_en": ["/L7/en/examples/line/arc"], - "linkNames": ["L7"] - }, - { - "id": "choroplethmap", - "name": "分类填充图", - "level": 2, - "isLeaf": true, - "tags": ["compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*TSGQRowxmmAAAAAAAAAAAABkARQnAQ", - "links": [ - "/L7/zh/examples/polygon/fill", - "/g2/zh/examples/map/map#choropleth-map" - ], - "links_en": [ - "/L7/en/examples/polygon/fill", - "/g2/en/examples/map/map#choropleth-map" - ], - "linkNames": ["L7", "G2"] - }, - { - "id": "extrudemap", - "name": "3D 填充地图", - "level": 2, - "isLeaf": true, - "tags": ["compare"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*l9D1QK5-z-8AAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/polygon/3d"], - "links_en": ["/L7/en/examples/polygon/3d"], - "linkNames": ["L7"] - }, - { - "id": "hexagonalheatmap", - "name": "蜂窝热力图", - "level": 2, - "isLeaf": true, - "tags": ["compare", "relation-clustering"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*YbKcRbypQ_oAAAAAAAAAAABkARQnAQ", - "links": [ - "/L7/zh/examples/heatmap/hexagon", - "/g2/zh/examples/map/map#hex-choropleth-map" - ], - "links_en": [ - "/L7/en/examples/heatmap/hexagon", - "/g2/en/examples/map/map#hex-choropleth-map" - ], - "linkNames": ["L7", "G2"] - }, - { - "id": "3dhexagonalheatmap", - "name": "3D 蜂窝\n热力图", - "level": 2, - "isLeaf": true, - "tags": ["compare", "relation-clustering"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*l9D1QK5-z-8AAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/heatmap/hexagon#light"], - "links_en": ["/L7/en//examples/heatmap/hexagon#light"], - "linkNames": ["L7"] - }, - { - "id": "classicalheatmap", - "name": "经典热力图", - "level": 2, - "isLeaf": true, - "tags": ["compare", "relation-clustering"], - "imgSrc": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*HxpoRIcBA80AAAAAAAAAAABkARQnAQ", - "links": [ - "/L7/zh/examples/heatmap/heatmap", - "/g2/zh/examples/map/map#with-heatmap" - ], - "links_en": [ - "/L7/en/examples/heatmap/heatmap", - "/g2/en/examples/map/map#with-heatmap" - ], - "linkNames": ["L7", "G2"] - }, - { - "id": "gridbinheatmap", - "name": "网格\n热力图", - "level": 2, - "isLeaf": true, - "tags": ["compare", "relation-clustering"], - "imgSrc": "https://gw.alipayobjects.com/mdn/antv_site/afts/img/A*tAGKS6EClQ4AAAAAAAAAAABkARQnAQ", - "links": ["/L7/zh/examples/heatmap/grid#grid1"], - "links_en": ["/L7/en/examples/heatmap/grid#grid1"], - "linkNames": ["L7"] - }, - - { - "id": "circlepacking", - "name": "圆堆积图", - "level": 2, - "isLeaf": true, - "tags": ["relation-hierarchy"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*nbfsS6Fe8mgAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/relation/relation#circle-packing"], - "links_en": ["/g2/en/examples/relation/relation#circle-packing"], - "linkNames": ["G2"] - }, - { - "id": "polartreemap", - "name": "极坐标树图", - "level": 2, - "isLeaf": true, - "tags": ["percentage", "compare", "relation-hierarchy"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*HGyHQbd3esQAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/relation/relation#polar-treemap"], - "links_en": ["/g2/en/examples/relation/relation#polar-treemap"], - "linkNames": ["G2"] - }, - { - "id": "sunburstdiagram", - "name": "旭日图", - "level": 2, - "isLeaf": true, - "tags": ["relation-hierarchy"], - "imgSrc": "https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*6vuVTqshFqgAAAAAAAAAAABkARQnAQ", - "links": ["/g2/zh/examples/relation/relation#sunburst"], - "links_en": ["/g2/en/examples/relation/relation#sunburst"], - "linkNames": ["G2"] - } - ], - "edges": [ - { - "source": "compare", - "target": "isolinemap" - }, - { - "source": "compare", - "target": "extrudemap" - }, - { - "source": "distribution", - "target": "custommakermap" - }, - { - "source": "hierarchy", - "target": "sunburstdiagram" - }, - { - "source": "percentage", - "target": "polartreemap" - }, - { - "source": "compare", - "target": "polartreemap" - }, - { - "source": "hierarchy", - "target": "polartreemap" - }, - { - "source": "hierarchy", - "target": "circlepacking" - }, - { - "source": "relation", - "target": "hierarchy" - }, - { - "source": "relation", - "target": "clustering" - }, - { - "source": "trend", - "target": "basiclinechart" - }, - { - "source": "trend", - "target": "multilinechart" - }, - { - "source": "compare", - "target": "multilinechart" - }, - { - "source": "trend", - "target": "basicareachart" - }, - { - "source": "trend", - "target": "stackareachart" - }, - { - "source": "compare", - "target": "stackareachart" - }, - { - "source": "percentage", - "target": "stackareachart" - }, - { - "source": "trend", - "target": "percentstackareachart" - }, - { - "source": "compare", - "target": "percentstackareachart" - }, - { - "source": "percentage", - "target": "percentstackareachart" - }, - { - "source": "trend", - "target": "intervalareachart" - }, - { - "source": "compare", - "target": "intervalareachart" - }, - { - "source": "trend", - "target": "streamchart" - }, - { - "source": "compare", - "target": "streamchart" - }, - - { - "source": "compare", - "target": "basichistogram" - }, - { - "source": "compare", - "target": "grouphistogram" - }, - { - "source": "compare", - "target": "stackhistogram" - }, - { - "source": "compare", - "target": "percentstackhistogram" - }, - { - "source": "percentage", - "target": "percentstackhistogram" - }, - { - "source": "compare", - "target": "intervalhistogram" - }, - { - "source": "compare", - "target": "waterfall" - }, - { - "source": "compare", - "target": "histogramunit" - }, - { - "source": "distribution", - "target": "histogramunit" - }, - { - "source": "compare", - "target": "basicbarchart" - }, - { - "source": "percentage", - "target": "basicbarchart" - }, - { - "source": "compare", - "target": "stackbarchart" - }, - { - "source": "percentage", - "target": "stackbarchart" - }, - { - "source": "compare", - "target": "percentstackbarchart" - }, - { - "source": "percentage", - "target": "percentstackbarchart" - }, - { - "source": "compare", - "target": "groupbarchart" - }, - { - "source": "percentage", - "target": "groupbarchart" - }, - { - "source": "compare", - "target": "intervalbarchart" - }, - { - "source": "percentage", - "target": "intervalbarchart" - }, - { - "source": "compare", - "target": "radiobarchart" - }, - { - "source": "percentage", - "target": "radiobarchart" - }, - { - "source": "compare", - "target": "symetricgroupbarchart" - }, - { - "source": "percentage", - "target": "basicpiechart" - }, - { - "source": "percentage", - "target": "ringpiechart" - }, - { - "source": "percentage", - "target": "nestpiechart" - }, - { - "source": "percentage", - "target": "nightingalechart" - }, - { - "source": "comare", - "target": "scatterplotunit" - }, - { - "source": "distribution", - "target": "scatterplotunit" - }, - { - "source": "relation", - "target": "scatterplotunit" - }, - { - "source": "comare", - "target": "bubblescatterplot" - }, - { - "source": "distribution", - "target": "bubblescatterplot" - }, - { - "source": "relation", - "target": "bubblescatterplot" - }, - { - "source": "relation", - "target": "circulararcdiagram" - }, - { - "source": "relation", - "target": "arcdiagram" - }, - { - "source": "relation", - "target": "chorddiagram" - }, - { - "source": "compare", - "target": "treemap" - }, - { - "source": "relation", - "target": "treemap" - }, - { - "source": "percentage", - "target": "treemap" - }, - { - "source": "flow", - "target": "sankey" - }, - { - "source": "relation", - "target": "sankey" - }, - { - "source": "trend", - "target": "sankey" - }, - { - "source": "flow", - "target": "basicfunnel" - }, - { - "source": "compare", - "target": "basicfunnel" - }, - { - "source": "relation", - "target": "basicfunnel" - }, - { - "source": "flow", - "target": "comparefunnel" - }, - { - "source": "compare", - "target": "comparefunnel" - }, - { - "source": "relation", - "target": "comparefunnel" - }, - { - "source": "flow", - "target": "symetricfunnel" - }, - { - "source": "compare", - "target": "symetricfunnel" - }, - { - "source": "relation", - "target": "symetricfunnel" - }, - { - "source": "compare", - "target": "bubblemap" - }, - { - "source": "distribution", - "target": "bubblemap" - }, - { - "source": "compare", - "target": "binchart" - }, - { - "source": "distribution", - "target": "binchart" - }, - { - "source": "compare", - "target": "colorblockheatmap" - }, - { - "source": "distribution", - "target": "colorblockheatmap" - }, - { - "source": "compare", - "target": "basicheatmap" - }, - { - "source": "distribution", - "target": "basicheatmap" - }, - { - "source": "compare", - "target": "instrument" - }, - { - "source": "compare", - "target": "radar" - }, - { - "source": "trend", - "target": "stockklines" - }, - { - "source": "compare", - "target": "stockklines" - }, - { - "source": "compare", - "target": "wordcloud" - }, - { - "source": "trend", - "target": "candlestick" - }, - { - "source": "hierarchy", - "target": "compactBox" - }, - { - "source": "hierarchy", - "target": "dendrogram" - }, - { - "source": "hierarchy", - "target": "mindmap" - }, - { - "source": "hierarchy", - "target": "indented" - }, - { - "source": "hierarchy", - "target": "radialtree" - }, - { - "source": "relation", - "target": "flowdiagram" - }, - { - "source": "clustering", - "target": "fruchtermancluster" - }, - { - "source": "relation", - "target": "fruchterman" - }, - { - "source": "relation", - "target": "forcedirected" - }, - { - "source": "relation", - "target": "circular" - }, - - { - "source": "relation", - "target": "spiral" - }, - { - "source": "relation", - "target": "radial" - }, - { - "source": "relation", - "target": "concentric" - }, - { - "source": "distribution", - "target": "concentric" - }, - { - "source": "distribution", - "target": "grid" - }, - { - "source": "relation", - "target": "grid" - }, - { - "source": "relation", - "target": "bubbles" - }, - { - "source": "compare", - "target": "bubbles" - }, - { - "source": "distribution", - "target": "dotmap" - }, - { - "source": "distribution", - "target": "symbollayer" - }, - { - "source": "compare", - "target": "symbollayer" - }, - { - "source": "clustering", - "target": "clustermap" - }, - { - "source": "compare", - "target": "clustermap" - }, - { - "source": "compare", - "target": "chartmap" - }, - { - "source": "composition", - "target": "chartmap" - }, - { - "source": "distribution", - "target": "chartmap" - }, - { - "source": "distribution", - "target": "columnmap" - }, - { - "source": "compare", - "target": "columnmap" - }, - { - "source": "distribution", - "target": "scattermap" - }, - { - "source": "trend", - "target": "pathmap" - }, - { - "source": "relation", - "target": "relationmap" - }, - { - "source": "relation", - "target": "arc3dmap" - }, - { - "source": "compare", - "target": "choroplethmap" - }, - { - "source": "compare", - "target": "hexagonalheatmap" - }, - { - "source": "clustering", - "target": "hexagonalheatmap" - }, - { - "source": "compare", - "target": "3dhexagonalheatmap" - }, - { - "source": "clustering", - "target": "3dhexagonalheatmap" - }, - { - "source": "compare", - "target": "classicalheatmap" - }, - { - "source": "clustering", - "target": "classicalheatmap" - }, - { - "source": "compare", - "target": "gridbinheatmap" - }, - { - "source": "clustering", - "target": "gridbinheatmap" - } - ] -} diff --git a/site/data/famous-persons.json b/site/data/famous-persons.json deleted file mode 100644 index c7f44d435..000000000 --- a/site/data/famous-persons.json +++ /dev/null @@ -1,30 +0,0 @@ -[ - { - "name": "Leland Wilkinson", - "text": "伊利诺伊大学计算机科学客座教授H2O.ai 首席科学家,G2 项目顾问", - "msg": "I am thrill with G2. It is amazingly faithful to the GG system and has the potential to generate more graphics.", - "image": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*PmHhRqLpMC8AAAAAAAAAAAAADmJ7AQ/original", - "color": "#1783FF" - }, - { - "name": "陈为", - "text": "浙江大学计算机学院 CAD & CG 国家重点实验室教授", - "msg": "在多年可视化设计与开发的基础上,蚂蚁金服推出了 AntV 产品,这是工业界基础可视化语法与实践方面发出的最强声音,也是工业界与学术界一道推进可视化研发进展的最佳利器。", - "image": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*tf_6R6uH9GsAAAAAAAAAAAAADmJ7AQ/original", - "color": "#00C9C9" - }, - { - "name": "林峰", - "text": "爱烹饪的可视化攻城狮", - "msg": "G2 是面粉,Echarts 是面条,皆微小而美好,因小食材怀大梦想,助力共筹东方巨龙崛起之盛宴,迎四海饕客。", - "image": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*ssmVSLzYA-kAAAAAAAAAAAAADmJ7AQ/original", - "color": "#F0884D" - }, - { - "name": "它山", - "text": "Ant Design / AntV 设计负责人", - "msg": "设计,让数据美而简单,让可视化更普惠。好策略、好资产助力好报表、好产品。", - "image": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*gwZ1S6Yc8IkAAAAAAAAAAAAADmJ7AQ/original", - "color": "#D580FF" - } -] diff --git a/site/data/historyContributors.tsx b/site/data/historyContributors.tsx deleted file mode 100644 index db64823ec..000000000 --- a/site/data/historyContributors.tsx +++ /dev/null @@ -1,186 +0,0 @@ -const historyContributors: { - name: string; - jobTitle: string; - avatar: string; - weibo: string; - github: string; -}[] = [ - { - name: '巴思', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*WiTATJQpbLIAAAAAAAAAAABkARQnAQ', - weibo: 'https://weibo.com/145643593', - github: '', - }, - { - name: '沉鱼', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*IMNERLEzuS8AAAAAAAAAAABkARQnAQ', - weibo: '', - github: '', - }, - { - name: '董珊珊', - jobTitle: '设计师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*cOoVT53fMRAAAAAAAAAAAABkARQnAQ', - weibo: '', - github: '', - }, - { - name: '顾倾', - jobTitle: '设计师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*xAQvQoGpucAAAAAAAAAAAABkARQnAQ', - weibo: '', - github: '', - }, - { - name: '光生', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*bLcFRI5XuJAAAAAAAAAAAABkARQnAQ', - weibo: '', - github: 'github: github.com/zxc0328', - }, - { - name: '广知', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*pqeZRI4PPQcAAAAAAAAAAABkARQnAQ', - weibo: '', - github: '', - }, - { - name: '画康', - jobTitle: '设计师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*QnJdSq-ts6wAAAAAAAAAAABkARQnAQ', - weibo: 'https://weibo.com/u/1985143287', - github: '', - }, - { - name: '绝云', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*1jxSSK2O9XAAAAAAAAAAAABkARQnAQ', - weibo: 'https://weibo.com/omosirovincent', - github: 'https://github.com/leungwensen', - }, - { - name: '陆沉', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*eqF9SY80u2QAAAAAAAAAAABkARQnAQ', - weibo: '', - github: '', - }, - { - name: '罗宪', - jobTitle: '动效设计师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*F6RgRLWn0PwAAAAAAAAAAABkARQnAQ', - weibo: '', - github: '', - }, - { - name: '米法', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*yvrBSIRx4OQAAAAAAAAAAABkARQnAQ', - weibo: '', - github: 'https://github.com/paleface001', - }, - { - name: '芈乐', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*SZd2QaFV8KkAAAAAAAAAAABkARQnAQ', - weibo: '', - github: 'https://github.com/weepy3641', - }, - { - name: '青湳', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*SVnYRaJ705sAAAAAAAAAAABkARQnAQ', - weibo: '', - github: 'https://github.com/elaine1234', - }, - { - name: '轻声', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*ULIwSqt8mscAAAAAAAAAAABkARQnAQ', - weibo: '', - github: 'https://github.com/laispace', - }, - { - name: '乌诺', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*NNrXRqwWfooAAAAAAAAAAABkARQnAQ', - weibo: '', - github: '', - }, - { - name: '亦叶', - jobTitle: '设计师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*al5RSKvDIYQAAAAAAAAAAABkARQnAQ', - weibo: '', - github: '', - }, - { - name: '有田', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*cVYyTJfysRsAAAAAAAAAAABkARQnAQ', - weibo: 'https://weibo.com/u/1869365461', - github: 'https://github.com/TomHuangCN', - }, - { - name: '早弦', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*1VQ3QrVIyMIAAAAAAAAAAABkARQnAQ', - weibo: 'https://www.weibo.com/markwhu', - github: 'https://github.com/fkysly', - }, - { - name: '张初尘', - jobTitle: '产品经理', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*-p3YQIlUtocAAAAAAAAAAABkARQnAQ', - weibo: 'https://weibo.com/u/1824917073', - github: 'https://github.com/lilyal', - }, - { - name: '长哲', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*z2OZQq5QGfYAAAAAAAAAAABkARQnAQ', - weibo: '', - github: 'https://github.com/bzhangzju', - }, - { - name: '祯逸', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*7WXcTYVBdmAAAAAAAAAAAABkARQnAQ', - weibo: '', - github: '', - }, - { - name: '诸岳', - jobTitle: '工程师', - avatar: - 'https://gw.alipayobjects.com/mdn/rms_23b644/afts/img/A*EkmcTa-uJDUAAAAAAAAAAABkARQnAQ', - weibo: 'https://www.weibo.com/u/6987384726', - github: 'https://github.com/dengfuping', - }, -]; - -export default historyContributors; diff --git a/site/data/home.ts b/site/data/home.ts new file mode 100644 index 000000000..02487482a --- /dev/null +++ b/site/data/home.ts @@ -0,0 +1,287 @@ +export type Locale = 'zh' | 'en'; + +export type LocalizedText = Record<Locale, string>; + +export const qaSuggestions: LocalizedText[] = [ + { + zh: '数据标签遮挡了怎么办?', + en: 'How to solve the data label is covered?', + }, + { + zh: '帮我生成一个折线图', + en: 'Create a line chart for me', + }, + { + zh: '图例位置调整到底部,并且居中', + en: 'Move the legend to the bottom and center it', + }, +]; + +export interface HomeLink { + title: LocalizedText; + description: LocalizedText; + href: string; + label?: string; + image?: string; +} + +export interface ShowcaseItem extends HomeLink { + product: string; + titleNote?: Partial<LocalizedText>; + image: string; + mediaTone?: 'dark'; +} + +export const aiSolutions: HomeLink[] = [ + { + label: 'Context', + title: { zh: '准确、实时的产品知识', en: 'Accurate product knowledge' }, + description: { + zh: '根据产品与 query 召回最新官方文档、API Schema 和示例等内容。', + en: 'Retrieve current official docs, API schemas, and examples for each product and query.', + }, + href: 'https://github.com/antvis/context', + }, + { + label: 'Skills', + title: { + zh: 'AI 可视化技能库', + en: 'AI Visualization Skills', + }, + description: { + zh: '面向 AI Agent 的可视化技能库,帮助大模型智能选择图表。', + en: 'Visualization skills for AI agents, helping language models choose the right charts.', + }, + href: 'https://github.com/antvis/chart-visualization-skills', + }, + { + label: 'MCP', + title: { + zh: 'AI 图表渲染服务', + en: 'AI Chart Rendering', + }, + description: { + zh: '基于 MCP 协议提供图表渲染服务,让 AI 直接输出专业图表图片。', + en: 'An MCP-based rendering service that lets AI generate professional chart images.', + }, + href: 'https://github.com/antvis/mcp-server-antv', + }, + { + label: 'AVA', + title: { + zh: '智能可视化', + en: 'Augmented Visual Analysis', + }, + description: { + zh: '为更简便的可视分析而生的技术框架。', + en: 'A framework that makes visual analytics easier.', + }, + href: 'https://ava.antv.antgroup.com/', + }, + { + label: 'GPT Vis', + title: { zh: 'AI 原生可视化', en: 'AI-native Visualization' }, + description: { + zh: '面向大模型时代的 AI 原生可视化库,框架无关,开箱即用。', + en: 'An AI-native visualization library for the LLM era. Framework-agnostic and ready to use.', + }, + href: 'https://gpt-vis.antv.vision/', + }, + { + label: 'Infographic', + title: { + zh: '信息图可视化', + en: 'Infographic Visualization', + }, + description: { + zh: '新一代信息图可视化引擎,让文字信息栩栩如生。', + en: 'A next-generation declarative infographic engine that brings words to life.', + }, + href: 'https://infographic.antv.vision/', + }, +]; + +export const showcases: ShowcaseItem[] = [ + { + product: 'G2', + title: { zh: '统计图表', en: 'Statistical charts' }, + description: { + zh: '基于图形语法的统计可视化引擎,以声明式、可组合的方式构建专业交互图表。', + en: 'A declarative and composable grammar for professional interactive statistical charts.', + }, + href: 'https://g2.antv.antgroup.com/examples/animation/group/#interval', + image: + 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*3xCLRLNfv7EAAAAAAAAAAAAADmJ7AQ/original', + }, + { + product: 'S2', + title: { zh: '多维表格', en: 'Multidimensional tables' }, + description: { + zh: '开箱即用的多维可视分析表格,适配复杂分析和业务报表场景。', + en: 'Practical multidimensional tables for complex analysis and business reporting.', + }, + href: 'https://s2.antv.vision/zh/examples/case/proportion/#single-population-proportion', + image: + 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*uxT9RowSdT4AAAAAAAAAAAAADmJ7AQ/original', + }, + { + product: 'F2', + title: { zh: '统计图表', en: 'Mobile charts' }, + titleNote: { zh: '(移动端)' }, + description: { + zh: '轻量、高性能的移动可视化引擎,适配 H5、小程序和多端交互。', + en: 'A lightweight, high performance engine for mobile and multi-device experiences.', + }, + href: 'https://f2.antv.antgroup.com/examples/creative/case/#timeline', + image: + 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*M6ubT4Mv7pcAAAAAAAAAAAAADmJ7AQ/original', + }, + { + product: 'G6', + title: { zh: '图可视化', en: 'Graph visualization' }, + description: { + zh: '面向关系数据的图可视化引擎,提供丰富布局、分析能力与大规模图渲染。', + en: 'Graph visualization with rich layouts, analysis, and large-scale rendering.', + }, + href: 'https://g6.antv.antgroup.com/examples/scene-case/default/#why-do-cats', + image: + 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*ug4vTJA7QbMAAAAAAAAAAAAADmJ7AQ/original', + }, + { + product: 'X6', + title: { zh: '图编辑', en: 'Diagramming' }, + description: { + zh: '面向流程图和节点编辑场景的图编辑引擎,支持灵活定制与复杂编排。', + en: 'A customizable diagramming engine for workflows and complex node editing.', + }, + href: 'https://x6.antv.antgroup.com/examples/showcase/practices/#agentFlow', + image: + 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*0H-HQJrdpMsAAAAAAAAAAAAADmJ7AQ/original', + }, + { + product: 'L7', + title: { zh: '地理可视化', en: 'Geospatial visualization' }, + description: { + zh: '支持大规模空间数据、多图层与 WebGL 渲染的地理可视化引擎。', + en: 'Large-scale geospatial visualization with multilayer WebGL rendering.', + }, + href: 'https://l7.antv.antgroup.com/examples/gallery/animate/#build_sweep', + image: + 'https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*TVs2R4bBH6wAAAAAAAAAAAAAARQnAQ', + mediaTone: 'dark', + }, + { + product: 'ADC', + title: { zh: '可视化组件', en: 'AntV React component library' }, + titleNote: { zh: '(React)' }, + description: { + zh: '简单好用的 React 图表库,让图表开发更简单。', + en: 'Simple and easy to use React chart library.', + }, + href: 'https://ant-design-charts.antgroup.com/', + image: + 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*dBDRR43tju8AAAAAAAAAAAAADmJ7AQ/original', + }, + { + product: 'T8', + title: { zh: '非结构化数据', en: 'Unstructured Data' }, + description: { + zh: '一套声明式的 JSON Schema 语法,用于描述数据解读报告。', + en: 'A declarative JSON Schema syntax for describing data interpretation reports.', + }, + href: 'https://t8.antv.vision/', + image: + 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*PhnTR5FpXL0AAAAAQlAAAAgAemJ7AQ/fmt.webp', + }, +]; + +export const experts = [ + { + name: 'Leland Wilkinson', + role: { + zh: '伊利诺伊大学计算机科学客座教授,G2 项目顾问', + en: 'Adjunct professor of computer science and advisor to G2', + }, + quote: { + zh: 'G2 忠实继承了图形语法体系,并具备生成更多图形表达的潜力。', + en: 'G2 is amazingly faithful to the grammar of graphics and has the potential to generate many more visual forms.', + }, + image: + 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*PmHhRqLpMC8AAAAAAAAAAAAADmJ7AQ/original', + }, + { + name: '陈为', + role: { + zh: '浙江大学计算机学院 CAD & CG 国家重点实验室教授', + en: 'Professor at Zhejiang University State Key Lab of CAD & CG', + }, + quote: { + zh: 'AntV 是工业界在基础可视化语法与实践方面发出的有力声音,也是产学共同推进可视化研发的重要工具。', + en: 'AntV is a strong industry contribution to visualization grammar and practice, connecting research with production.', + }, + image: + 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*tf_6R6uH9GsAAAAAAAAAAAAADmJ7AQ/original', + }, + { + name: '林峰', + role: { + zh: '可视化开发者与社区贡献者', + en: 'Visualization engineer and community contributor', + }, + quote: { + zh: 'G2 从小而清晰的语法出发,帮助开发者组合出丰富而有生命力的图形表达。', + en: 'G2 starts from a small, clear grammar and helps developers compose expressive visual forms.', + }, + image: + 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*ssmVSLzYA-kAAAAAAAAAAAAADmJ7AQ/original', + }, + { + name: '它山', + role: { + zh: 'Ant Design / AntV 设计负责人', + en: 'Design lead for Ant Design and AntV', + }, + quote: { + zh: '设计让数据美而简单,也让可视化更普惠。好的策略与资产,能够支撑更好的报表和产品。', + en: 'Design makes data beautiful and clear. Strong principles and assets lead to better reports and products.', + }, + image: + 'https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*gwZ1S6Yc8IkAAAAAAAAAAAAADmJ7AQ/original', + }, +]; + +export const ecosystem = [ + { + name: 'Sive', + description: { zh: 'AI 可视化研发平台', en: 'AI visualization workspace' }, + href: 'https://sive.antv.antgroup.com/', + }, + { + name: 'Ant Design Charts', + description: { zh: '可视化图表库', en: 'Visualization chart library' }, + href: 'https://charts.ant.design/', + }, + { + name: 'Editor', + description: { + zh: '用自然语言研发图表', + en: 'Build charts with natural language', + }, + href: 'https://sive.antv.antgroup.com/', + }, +]; + +export const foundation = [ + ['G2', '统计图表', 'Statistical charts', 'https://g2.antv.antgroup.com/'], + [ + 'S2', + '多维表格', + 'Multidimensional tables', + 'https://s2.antv.antgroup.com/', + ], + ['F2', '移动统计图', 'Mobile charts', 'https://f2.antv.antgroup.com/'], + ['G6', '关系图', 'Graphs', 'https://g6.antv.antgroup.com/'], + ['X6', '图编辑', 'Diagramming', 'https://x6.antv.antgroup.com/'], + ['L7', '地图', 'Maps', 'https://l7.antv.antgroup.com/'], + ['Infographic', '信息图', 'Infographics', 'https://infographic.antv.vision/'], +] as const; diff --git a/site/data/link-charts.json b/site/data/link-charts.json deleted file mode 100644 index 6169d1789..000000000 --- a/site/data/link-charts.json +++ /dev/null @@ -1,106 +0,0 @@ -[ - { - "title": "多维表格", - "subTitle": "开箱即用的多维可视分析表格", - "image": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*uxT9RowSdT4AAAAAAAAAAAAADmJ7AQ/original", - "link": "https://s2.antv.vision/examples/case/proportion/#single-population-proportion", - "antv": "S2", - "color": "#00C7C7" - }, - { - "title": "关系图", - "subTitle": "便捷的关系数据可视化引擎与图分析工具", - "image": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*7Ca9SZkhRJsAAAAAAAAAAAAADmJ7AQ/original", - "link": "https://g6.antv.antgroup.com/examples/layout/force-directed/#d3-force", - "antv": "G6", - "color": "rgba(249,106,65)" - }, - { - "title": "散点图 (3D图表)", - "subTitle": "数据驱动,高度易用,可扩展的可视化图形语法", - "image": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*8LDVQoK3odIAAAAAAAAAAAAADmJ7AQ/original", - "link": "https://g2.antv.antgroup.com/examples/threed/scatter/#orthographic-projection", - "antv": "G2", - "color": "#2486FF" - }, - { - "title": "关系图", - "subTitle": "便捷的关系数据可视化引擎与图分析工具", - "image": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*ug4vTJA7QbMAAAAAAAAAAAAADmJ7AQ/original", - "link": "https://g6.antv.antgroup.com/examples/scene-case/default/#why-do-cats", - "antv": "G6", - "color": "rgba(249,106,65)" - }, - { - "title": "统计图表", - "subTitle": "数据驱动,高度易用,可扩展的可视化图形语法", - "image": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*oj5gRqZMxZQAAAAAAAAAAAAADmJ7AQ/original", - "link": "https://g2.antv.antgroup.com/examples/general/dual#dual-axis-bar", - "antv": "G2", - "color": "#2486FF" - }, - { - "title": "统计图表 (移动端)", - "subTitle": "专注于移动端的可视化解决方案,兼容 H5/小程序/Weex 等多端环境", - "image": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*M6ubT4Mv7pcAAAAAAAAAAAAADmJ7AQ/original", - "link": "https://f2.antv.antgroup.com/examples/creative/plugin/#rough", - "antv": "F2", - "color": "rgba(198,86,253)" - }, - { - "title": "地图", - "subTitle": "高性能/高渲染质量的地理空间数据可视化框架", - "image": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*H0KDRaIpfIUAAAAAAAAAAAAADmJ7AQ/original", - "link": "https://l7.antv.antgroup.com/examples/point/bubble#point", - "antv": "L7", - "color": "#1074FF" - }, - { - "title": "树形图表 (移动端)", - "subTitle": "一款可以快速、流畅运行于移动设备中的图可视化引擎", - "image": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*xYWPSa_ev60AAAAAAAAAAAAADmJ7AQ/original", - "link": "https://f6.antv.vision/docs/examples/tree/radialtree", - "antv": "F6", - "color": "#00C7C7" - }, - { - "title": "思维导图", - "subTitle": "极易定制、开箱即用、数据驱动的图编辑引擎", - "image": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*0H-HQJrdpMsAAAAAAAAAAAAADmJ7AQ/original", - "link": "https://x6.antv.vision/examples/showcase/practices#dag", - "antv": "X6", - "color": "#A658F5" - }, - { - "title": "树形图表", - "subTitle": "便捷的关系数据可视化引擎与图分析工具", - "image": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*cEgmQov_Kf0AAAAAAAAAAAAADmJ7AQ/original", - "link": "https://g6.antv.antgroup.com/examples/scene-case/default/#fund-flow", - "antv": "G6", - "color": "rgba(249,106,65)" - }, - { - "title": "热力图", - "subTitle": "数据驱动,高度易用,可扩展的可视化图形语法", - "image": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*kC58R7TEdd0AAAAAAAAAAAAADmJ7AQ/original", - "link": "https://g2.antv.antgroup.com/examples/general/heatmap/#mouse-heatmap", - "antv": "G2", - "color": "#2486FF" - }, - { - "title": "地图 (3D图表)", - "subTitle": "高性能/高渲染质量的地理空间数据可视化框架", - "image": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*ZPy6QYS-idMAAAAAAAAAAAAADmJ7AQ/original", - "link": "https://l7.antv.antgroup.com/examples/line/path/#bus_light", - "antv": "L7", - "color": "#1074FF" - }, - { - "title": "矩形式树图 (移动端)", - "subTitle": "一款可以快速、流畅运行于移动设备中的图可视化引擎", - "image": "https://gw.alipayobjects.com/zos/antfincdn/veD1IGEyne/20211116113745.jpg", - "link": "https://f2.antv.antgroup.com/examples/relation/treemap/#treemap", - "antv": "F2", - "color": "rgba(198,86,253)" - } -] diff --git a/site/data/project-card-popover.json b/site/data/project-card-popover.json deleted file mode 100644 index 8613e74bc..000000000 --- a/site/data/project-card-popover.json +++ /dev/null @@ -1,20 +0,0 @@ -[ - { - "text": "产品首页", - "href": "home", - "img": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*3xXDTZYurmUAAAAAAAAAAAAADmJ7AQ/original", - "activeImg": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*hk1CQLLIQG0AAAAAAAAAAAAADmJ7AQ/original" - }, - { - "text": "图表示例", - "href": "example", - "img": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*hRxETKoSog4AAAAAAAAAAAAADmJ7AQ/original", - "activeImg": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*1U6cR7srIOIAAAAAAAAAAAAADmJ7AQ/original)" - }, - { - "text": "使用文档", - "href": "api", - "img": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*_xFsQbWE_AYAAAAAAAAAAAAADmJ7AQ/original", - "activeImg": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*A9VnTpferioAAAAAAAAAAAAADmJ7AQ/original" - } -] diff --git a/site/data/theme-charts.json b/site/data/theme-charts.json deleted file mode 100644 index 534188c5f..000000000 --- a/site/data/theme-charts.json +++ /dev/null @@ -1,27 +0,0 @@ -[ - { - "text": "日常分析", - "img": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*_QoYRowGM50AAAAAAAAAAAAADmJ7AQ/original", - "activeImg": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*q5g5Qp2D7GYAAAAAAAAAAAAADmJ7AQ/original", - "darkImg": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*g4qrR4bQMOYAAAAAAAAAAAAADmJ7AQ/original", - "theme": "light" - }, - { - "text": "数据监控", - "img": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*Sc7hSIITxFQAAAAAAAAAAAAADmJ7AQ/original", - "activeImg": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*6e2CT6K6XYgAAAAAAAAAAAAADmJ7AQ/original", - "background": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*StbsSZEU_HoAAAAAAAAAAAAADmJ7AQ/original", - "backgroundChart": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*WeCjR59uRiwAAAAAAAAAAAAADmJ7AQ/original", - "darkImg": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*OSwyT5CsqVQAAAAAAAAAAAAADmJ7AQ/original", - "theme": "dark" - }, - { - "text": "活动战报", - "img": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*NcJ0Q6nslIMAAAAAAAAAAAAADmJ7AQ/original", - "activeImg": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*ZnG8QZrNVxkAAAAAAAAAAAAADmJ7AQ/original", - "darkImg": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*6FVKSq7g520AAAAAAAAAAAAADmJ7AQ/original", - "background": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*gjWcSYzg5kMAAAAAAAAAAAAADmJ7AQ/original", - "backgroundChart": "https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*SPGHSrSfT1UAAAAAAAAAAAAADmJ7AQ/original", - "theme": "dark" - } -] diff --git a/site/data/theme-colors1.json b/site/data/theme-colors1.json deleted file mode 100644 index 256f7cd14..000000000 --- a/site/data/theme-colors1.json +++ /dev/null @@ -1,370 +0,0 @@ -{ - "categorical": { - "text": "分类色板", - "msg": "主要用于描述分类数据,如苹果、香蕉、梨,常用一个颜色代表一个值以区分不同类型,取色时色相分布均衡,相邻颜色之间明暗需考虑差异性,常用于饼图的不同分类、填充地图中的不同国家、关系图中的不同角色等。", - "colors": [ - "#1783FF", - "#00C9C9", - "#F0884D", - "#D580FF", - "#7863FF", - "#60C42D", - "#BD8F24", - "#FF80CA", - "#2491B3", - "#17C76F", - "#AABA01", - "#BC7CFC", - "#237CBC", - "#2DE379", - "#CE8032", - "#FF7AF4", - "#545FD3", - "#AFE410", - "#D8C608", - "#FFA1E0" - ] - }, - "sequential": { - "text": "单一顺序色板", - "msg": "单色顺序色板,均基于分类色板生长而来,一般使用同一色相,通过明度或饱和度的渐变,常用来表示同一事物中的数值大小或梯度变化,如排行榜等级变化、一个国家或地区的新增人口数对比、风险等级变化等。", - "colors": [ - [ - "#8accff", - "#6bb3ff", - "#499bff", - "#1783ff", - "#006ce4", - "#0056ca", - "#0042b0", - "#002e97", - "#001d7e" - ], - [ - "#43e5e4", - "#00c9c9", - "#00aeaf", - "#009495", - "#007a7c", - "#006164", - "#00494d", - "#003237", - "#002322" - ], - [ - "#ffbe7f", - "#ffa366", - "#f0884d", - "#d26e35", - "#b4551c", - "#973c01", - "#7a2300", - "#5f0400", - "#470000" - ], - [ - "#ffb8ff", - "#f39cff", - "#d580ff", - "#b865e1", - "#9b4ac4", - "#7e2fa8", - "#63108d", - "#470072", - "#2c0058" - ], - [ - "#c7a8ff", - "#ad90ff", - "#9279ff", - "#7863ff", - "#5d4de5", - "#4038cc", - "#1b24b3", - "#00109a", - "#000083" - ], - [ - "#7bde48", - "#60c42d", - "#44ab06", - "#249200", - "#007a00", - "#006200", - "#004c00", - "#003500", - "#002600" - ], - [ - "#f5c258", - "#d9a83f", - "#bd8f24", - "#a27700", - "#875f00", - "#6d4900", - "#553300", - "#401e00", - "#300800" - ], - [ - "#ffbcff", - "#ff9ee8", - "#ff80ca", - "#df63ad", - "#c04591", - "#a12575", - "#83005b", - "#660042", - "#49002a" - ], - [ - "#81dfff", - "#65c5e8", - "#47aacd", - "#2491b3", - "#007899", - "#006080", - "#004a68", - "#003451", - "#00203b" - ], - [ - "#45e287", - "#17c76f", - "#00ad57", - "#009340", - "#007a2a", - "#006112", - "#004900", - "#003300", - "#002600" - ], - [ - "#c4d32f", - "#aaba01", - "#90a100", - "#778900", - "#5e7200", - "#485c00", - "#344600", - "#263100", - "#1e1e00" - ], - [ - "#f2aeff", - "#d795ff", - "#bc7cfc", - "#a264e1", - "#884dc7", - "#6f36ad", - "#561e94", - "#3d027c", - "#220064" - ], - [ - "#a7edff", - "#89d0ff", - "#6ab3f7", - "#4a97d9", - "#237cbc", - "#0062a0", - "#004984", - "#003269", - "#001d4f" - ], - [ - "#59ff95", - "#2de379", - "#00c55e", - "#00a843", - "#008b29", - "#006f0b", - "#005400", - "#003a00", - "#002900" - ], - [ - "#ffd987", - "#ffba6a", - "#ef9d4e", - "#ce8032", - "#ae6414", - "#8e4a00", - "#703000", - "#541600", - "#3c0000" - ], - [ - "#ffb7ff", - "#ff98ff", - "#ff7af4", - "#df5cd5", - "#bf3cb7", - "#a0149a", - "#82007e", - "#640062", - "#470048" - ], - [ - "#c4c2ff", - "#a8a8ff", - "#8c8fff", - "#7077ef", - "#545fd3", - "#3648b8", - "#09339e", - "#001f84", - "#000d6b" - ], - [ - "#afe410", - "#92c800", - "#76ad00", - "#5a9200", - "#3f7800", - "#255f00", - "#124700", - "#112f00", - "#001e00" - ], - [ - "#f6e237", - "#d8c608", - "#baab00", - "#9e9000", - "#817700", - "#675e00", - "#4e4700", - "#3a3000", - "#2d1a00" - ], - [ - "#ffbdfd", - "#ffa1e0", - "#e185c3", - "#c46aa8", - "#a7508d", - "#8b3672", - "#6f1a59", - "#540041", - "#3b002a" - ] - ] - }, - "diverging": { - "text": "邻近顺序色板", - "msg": "邻近顺序色板,均基于分类色板生长而来,为加大辨识度也可使用邻近色相,通过明度或饱和度的渐变,常用来表示同一事物中的数值大小或梯度变化,如排行榜等级变化、一个国家或地区的新增人口数对比、风险等级变化等。", - "colors": [ - [ - "#1783ff", - "#499bff", - "#6bb3ff", - "#8accff", - "#e5e5e5", - "#ffbe7f", - "#ffa366", - "#f0884d", - "#d26e35" - ], - [ - "#009495", - "#00aeaf", - "#00c9c9", - "#43e5e4", - "#e5e5e5", - "#ffb8ff", - "#f39cff", - "#d580ff", - "#b865e1" - ], - [ - "#d26e35", - "#f0884d", - "#ffa366", - "#ffbe7f", - "#e5e5e5", - "#c7a8ff", - "#ad90ff", - "#9279ff", - "#7863ff" - ], - [ - "#b865e1", - "#d580ff", - "#f39cff", - "#ffb8ff", - "#e5e5e5", - "#7bde48", - "#60c42d", - "#44ab06", - "#249200" - ], - [ - "#7863ff", - "#9279ff", - "#ad90ff", - "#c7a8ff", - "#e5e5e5", - "#f5c258", - "#d9a83f", - "#bd8f24", - "#a27700" - ], - [ - "#249200", - "#44ab06", - "#60c42d", - "#7bde48", - "#e5e5e5", - "#ffbcff", - "#ff9ee8", - "#ff80ca", - "#df63ad" - ], - [ - "#a27700", - "#bd8f24", - "#d9a83f", - "#f5c258", - "#e5e5e5", - "#81dfff", - "#65c5e8", - "#47aacd", - "#2491b3" - ], - [ - "#df63ad", - "#ff80ca", - "#ff9ee8", - "#ffbcff", - "#e5e5e5", - "#45e287", - "#17c76f", - "#00ad57", - "#009340" - ], - [ - "#2491b3", - "#47aacd", - "#65c5e8", - "#81dfff", - "#e5e5e5", - "#8accff", - "#6bb3ff", - "#499bff", - "#1783ff" - ], - [ - "#009340", - "#00ad57", - "#17c76f", - "#45e287", - "#e5e5e5", - "#43e5e4", - "#00c9c9", - "#00aeaf", - "#009495" - ] - ] - } -} diff --git a/site/data/theme-colors2.json b/site/data/theme-colors2.json deleted file mode 100644 index 6f7c8761c..000000000 --- a/site/data/theme-colors2.json +++ /dev/null @@ -1,370 +0,0 @@ -{ - "categorical": { - "text": "分类色板", - "msg": "主要用于描述分类数据,如苹果、香蕉、梨,常用一个颜色代表一个值以区分不同类型,取色时色相分布均衡,相邻颜色之间明暗需考虑差异性,常用于饼图的不同分类、填充地图中的不同国家、关系图中的不同角色等。", - "colors": [ - "#00CFE2", - "#4E98FF", - "#E49629", - "#CE6CFF", - "#8D7BFF", - "#53B81F", - "#CE9C29", - "#EC5FB2", - "#0F8EB6", - "#00A56E", - "#A0AE02", - "#B36AFD", - "#237CBC", - "#1BD468", - "#CE8032", - "#FF7AFF", - "#545FD3", - "#A3D50C", - "#D1BE00", - "#FC8DD7" - ] - }, - "sequential": { - "text": "单一顺序色板", - "msg": "单色顺序色板,均基于分类色板生长而来,一般使用同一色相,通过明度或饱和度的渐变,常用来表示同一事物中的数值大小或梯度变化,如排行榜等级变化、一个国家或地区的新增人口数对比、风险等级变化等。", - "colors": [ - [ - "#45eafd", - "#00cfe2", - "#00b4c7", - "#009aad", - "#008194", - "#00697b", - "#005163", - "#003a4d", - "#002737" - ], - [ - "#89c9ff", - "#6cb0ff", - "#4e98ff", - "#2981e5", - "#006acb", - "#0054b1", - "#004098", - "#002c80", - "#001b69" - ], - [ - "#ffce62", - "#ffb246", - "#e49629", - "#c57b00", - "#a66100", - "#884800", - "#6c2f00", - "#521700", - "#3d0000" - ], - [ - "#ff9cff", - "#e884ff", - "#ce6cff", - "#b554e5", - "#9b3ccc", - "#8322b4", - "#6a009c", - "#520084", - "#39006d" - ], - [ - "#e9d0ff", - "#cab3ff", - "#ab96ff", - "#8d7bff", - "#6f61e0", - "#5047c2", - "#2f2fa5", - "#001888", - "#00026d" - ], - [ - "#8cef5a", - "#70d33e", - "#53b81f", - "#349d00", - "#048300", - "#006a00", - "#005200", - "#003a00", - "#002700" - ], - [ - "#ffd260", - "#ebb645", - "#ce9c29", - "#b18201", - "#956a00", - "#795200", - "#603b00", - "#492500", - "#361000" - ], - [ - "#ff94e6", - "#ff79cc", - "#ec5fb2", - "#d04499", - "#b52681", - "#9a006a", - "#7f0053", - "#65003d", - "#4c0029" - ], - [ - "#79dbff", - "#5cc1eb", - "#3da7d0", - "#0f8eb6", - "#00769d", - "#005e84", - "#00486c", - "#003255", - "#00203e" - ], - [ - "#51d59a", - "#33bd84", - "#00a56e", - "#008e59", - "#007745", - "#006231", - "#004c1f", - "#00380d", - "#002800" - ], - [ - "#dbe750", - "#bdca31", - "#a0ae02", - "#849300", - "#687800", - "#4d5f00", - "#364700", - "#262f00", - "#1c1a00" - ], - [ - "#ffbfff", - "#f0a2ff", - "#d186ff", - "#b36afd", - "#954fdf", - "#7834c1", - "#5a16a4", - "#3d0088", - "#1c006d" - ], - [ - "#78c0ff", - "#5ea9ec", - "#4392d4", - "#237cbc", - "#0067a5", - "#00528e", - "#003e77", - "#002c62", - "#001b4d" - ], - [ - "#4af081", - "#1bd468", - "#00b94f", - "#009e37", - "#00831d", - "#006a00", - "#005100", - "#003900", - "#002900" - ], - [ - "#ffd987", - "#ffba6a", - "#ef9d4e", - "#ce8032", - "#ae6414", - "#8e4a00", - "#6f3000", - "#541600", - "#3c0000" - ], - [ - "#ffb5ff", - "#ff97ff", - "#ff7aff", - "#e05de1", - "#c23ec4", - "#a41aa7", - "#86008c", - "#6a0071", - "#4d0057" - ], - [ - "#c3c2ff", - "#a7a8ff", - "#8c8fff", - "#7077ee", - "#545fd3", - "#3649b8", - "#0a339e", - "#001f84", - "#000d6b" - ], - [ - "#c1f33b", - "#a3d50c", - "#85b800", - "#689c00", - "#4b8000", - "#2f6500", - "#194c00", - "#113300", - "#011f00" - ], - [ - "#efd933", - "#d1be00", - "#b4a300", - "#978900", - "#7c7000", - "#625800", - "#4b4100", - "#382b00", - "#2c1600" - ], - [ - "#ffa7f2", - "#fc8dd7", - "#e073bd", - "#c45aa3", - "#a9408a", - "#8f2572", - "#74005a", - "#5b0044", - "#42002e" - ] - ] - }, - "diverging": { - "text": "邻近顺序色板", - "msg": "邻近顺序色板,均基于分类色板生长而来,为加大辨识度也可使用邻近色相,通过明度或饱和度的渐变,常用来表示同一事物中的数值大小或梯度变化,如排行榜等级变化、一个国家或地区的新增人口数对比、风险等级变化等。", - "colors": [ - [ - "#009aad", - "#00b4c7", - "#00cfe2", - "#45eafd", - "#e5e5e5", - "#ffce62", - "#ffb246", - "#e49629", - "#c57b00" - ], - [ - "#2981e5", - "#4e98ff", - "#6cb0ff", - "#89c9ff", - "#e5e5e5", - "#ff9cff", - "#e884ff", - "#ce6cff", - "#b554e5" - ], - [ - "#c57b00", - "#e49629", - "#ffb246", - "#ffce62", - "#e5e5e5", - "#e9d0ff", - "#cab3ff", - "#ab96ff", - "#8d7bff" - ], - [ - "#b554e5", - "#ce6cff", - "#e884ff", - "#ff9cff", - "#e5e5e5", - "#8cef5a", - "#70d33e", - "#53b81f", - "#349d00" - ], - [ - "#8d7bff", - "#ab96ff", - "#cab3ff", - "#e9d0ff", - "#e5e5e5", - "#ffd260", - "#ebb645", - "#ce9c29", - "#b18201" - ], - [ - "#349d00", - "#53b81f", - "#70d33e", - "#8cef5a", - "#e5e5e5", - "#ff94e6", - "#ff79cc", - "#ec5fb2", - "#d04499" - ], - [ - "#b18201", - "#ce9c29", - "#ebb645", - "#ffd260", - "#e5e5e5", - "#79dbff", - "#5cc1eb", - "#3da7d0", - "#0f8eb6" - ], - [ - "#d04499", - "#ec5fb2", - "#ff79cc", - "#ff94e6", - "#e5e5e5", - "#51d59a", - "#33bd84", - "#00a56e", - "#008e59" - ], - [ - "#0f8eb6", - "#3da7d0", - "#5cc1eb", - "#79dbff", - "#e5e5e5", - "#45eafd", - "#00cfe2", - "#00b4c7", - "#009aad" - ], - [ - "#008e59", - "#00a56e", - "#33bd84", - "#51d59a", - "#e5e5e5", - "#89c9ff", - "#6cb0ff", - "#4e98ff", - "#2981e5" - ] - ] - } -} diff --git a/site/data/theme-colors3.json b/site/data/theme-colors3.json deleted file mode 100644 index fac85c955..000000000 --- a/site/data/theme-colors3.json +++ /dev/null @@ -1,370 +0,0 @@ -{ - "categorical": { - "text": "分类色板", - "msg": "主要用于描述分类数据,如苹果、香蕉、梨,常用一个颜色代表一个值以区分不同类型,取色时色相分布均衡,相邻颜色之间明暗需考虑差异性,常用于饼图的不同分类、填充地图中的不同国家、关系图中的不同角色等。", - "colors": [ - "#FFD081", - "#BE6FFF", - "#FF5ABA", - "#2AB9E9", - "#8196FF", - "#FF8F57", - "#32CC25", - "#7F78FF", - "#A3C31D", - "#48D097", - "#0F8EB6", - "#F98460", - "#E24CF0", - "#FF7DB3", - "#12A983", - "#FF7AFF", - "#96D021", - "#7798DB", - "#D4C73E", - "#D0A748" - ] - }, - "sequential": { - "text": "单一顺序色板", - "msg": "单色顺序色板,均基于分类色板生长而来,一般使用同一色相,通过明度或饱和度的渐变,常用来表示同一事物中的数值大小或梯度变化,如排行榜等级变化、一个国家或地区的新增人口数对比、风险等级变化等。", - "colors": [ - [ - "#ffd081", - "#e2b567", - "#c59b4e", - "#a98136", - "#8e681d", - "#735100", - "#593a00", - "#422400", - "#2f1000" - ], - [ - "#f4a0ff", - "#d987ff", - "#be6fff", - "#a457e4", - "#8a3fca", - "#7026b1", - "#570798", - "#3d007f", - "#220068" - ], - [ - "#ff8fed", - "#ff75d3", - "#ff5aba", - "#e33da2", - "#c8198a", - "#ad0073", - "#92005c", - "#780047", - "#5e0032" - ], - [ - "#78f2ff", - "#55d5ff", - "#2ab9e9", - "#009dcc", - "#0083b0", - "#006995", - "#00507a", - "#003861", - "#002348" - ], - [ - "#b7c9ff", - "#9cafff", - "#8196ff", - "#667ee4", - "#4a66c9", - "#2c50af", - "#003b95", - "#00277c", - "#001564" - ], - [ - "#ffc98d", - "#ffac72", - "#ff8f57", - "#df733d", - "#bf5824", - "#9f3d08", - "#802200", - "#640000", - "#490000" - ], - [ - "#56e744", - "#32cc25", - "#00b100", - "#009700", - "#007e00", - "#006500", - "#004d00", - "#003600", - "#002800" - ], - [ - "#d1c3ff", - "#b6a9ff", - "#9a90ff", - "#7f78ff", - "#6361e4", - "#474ac9", - "#2535ae", - "#002195", - "#000e7c" - ], - [ - "#bedd3e", - "#a3c31d", - "#89a900", - "#6f9000", - "#567800", - "#3e6100", - "#294a00", - "#1c3400", - "#152000" - ], - [ - "#67ecb1", - "#48d097", - "#22b57e", - "#009a65", - "#00804e", - "#006738", - "#004f22", - "#00370e", - "#002600" - ], - [ - "#75d8ff", - "#59bee8", - "#3ba6cf", - "#0f8eb6", - "#00779e", - "#006086", - "#004b6f", - "#003659", - "#002343" - ], - [ - "#ffbe96", - "#ffa17b", - "#f98460", - "#d96846", - "#b94c2e", - "#993116", - "#7b1100", - "#5d0000", - "#440000" - ], - [ - "#ffaaff", - "#ff8bff", - "#ff6cff", - "#e24cf0", - "#c227d2", - "#a300b4", - "#850097", - "#66007b", - "#490060" - ], - [ - "#ffb6ec", - "#ff99cf", - "#ff7db3", - "#e06198", - "#c2447d", - "#a42664", - "#87004c", - "#6a0035", - "#4e001f" - ], - [ - "#5adcb3", - "#3cc29b", - "#12a983", - "#00906c", - "#007956", - "#006141", - "#004b2d", - "#00351a", - "#002502" - ], - [ - "#ffb8ff", - "#ff99ff", - "#ff7aff", - "#de5be0", - "#be3bc1", - "#9f11a3", - "#800086", - "#62006a", - "#44004f" - ], - [ - "#b3ed44", - "#96d021", - "#7ab400", - "#5e9900", - "#417e00", - "#266500", - "#0c4c00", - "#073400", - "#002100" - ], - [ - "#a8c8ff", - "#8faff4", - "#7798db", - "#5f81c2", - "#476baa", - "#2e5692", - "#0e427b", - "#002e65", - "#001c50" - ], - [ - "#f2e35b", - "#d4c73e", - "#b7ac1d", - "#9a9100", - "#7e7700", - "#635f00", - "#4b4700", - "#363000", - "#291a00" - ], - [ - "#ebc060", - "#d0a748", - "#b58e30", - "#9b7715", - "#816000", - "#684a00", - "#513500", - "#3c2100", - "#2d0c00" - ] - ] - }, - "diverging": { - "text": "邻近顺序色板", - "msg": "邻近顺序色板,均基于分类色板生长而来,为加大辨识度也可使用邻近色相,通过明度或饱和度的渐变,常用来表示同一事物中的数值大小或梯度变化,如排行榜等级变化、一个国家或地区的新增人口数对比、风险等级变化等。", - "colors": [ - [ - "#a98136", - "#c59b4e", - "#e2b567", - "#ffd081", - "#e5e5e5", - "#ff8fed", - "#ff75d3", - "#ff5aba", - "#e33da2" - ], - [ - "#a457e4", - "#be6fff", - "#d987ff", - "#f4a0ff", - "#e5e5e5", - "#78f2ff", - "#55d5ff", - "#2ab9e9", - "#009dcc" - ], - [ - "#e33da2", - "#ff5aba", - "#ff75d3", - "#ff8fed", - "#e5e5e5", - "#b7c9ff", - "#9cafff", - "#8196ff", - "#667ee4" - ], - [ - "#009dcc", - "#2ab9e9", - "#55d5ff", - "#78f2ff", - "#e5e5e5", - "#ffc98d", - "#ffac72", - "#ff8f57", - "#df733d" - ], - [ - "#667ee4", - "#8196ff", - "#9cafff", - "#b7c9ff", - "#e5e5e5", - "#56e744", - "#32cc25", - "#00b100", - "#009700" - ], - [ - "#df733d", - "#ff8f57", - "#ffac72", - "#ffc98d", - "#e5e5e5", - "#d1c3ff", - "#b6a9ff", - "#9a90ff", - "#7f78ff" - ], - [ - "#009700", - "#00b100", - "#32cc25", - "#56e744", - "#e5e5e5", - "#bedd3e", - "#a3c31d", - "#89a900", - "#6f9000" - ], - [ - "#7f78ff", - "#9a90ff", - "#b6a9ff", - "#d1c3ff", - "#e5e5e5", - "#67ecb1", - "#48d097", - "#22b57e", - "#009a65" - ], - [ - "#6f9000", - "#89a900", - "#a3c31d", - "#bedd3e", - "#e5e5e5", - "#ffd081", - "#e2b567", - "#c59b4e", - "#a98136" - ], - [ - "#009a65", - "#22b57e", - "#48d097", - "#67ecb1", - "#e5e5e5", - "#f4a0ff", - "#d987ff", - "#be6fff", - "#a457e4" - ] - ] - } -} diff --git a/site/externals.d.ts b/site/externals.d.ts deleted file mode 100644 index fb059c81e..000000000 --- a/site/externals.d.ts +++ /dev/null @@ -1,5 +0,0 @@ -declare module '*.less'; -declare module '*.png'; -declare module 'chroma-js'; -declare module 'video-react'; -declare module '@antv/gatsby-theme-antv/site/templates/markdown.module.less'; diff --git a/site/font/Alibaba-PuHuiTi-Heavy.otf b/site/font/Alibaba-PuHuiTi-Heavy.otf deleted file mode 100644 index 28c3b45bd..000000000 Binary files a/site/font/Alibaba-PuHuiTi-Heavy.otf and /dev/null differ diff --git a/site/utils.ts b/site/utils.ts deleted file mode 100644 index e9e177542..000000000 --- a/site/utils.ts +++ /dev/null @@ -1,8 +0,0 @@ -/** - * Translate函数 - */ -import { useLocale } from 'dumi'; - -export const getLang = () => { - return useLocale().id; -}; diff --git a/src/content.config.ts b/src/content.config.ts new file mode 100644 index 000000000..65ae3d146 --- /dev/null +++ b/src/content.config.ts @@ -0,0 +1,9 @@ +import { defineCollection } from 'astro:content'; +import { antvDocsLoader, antvDocsSchema } from '@antv/site/content'; + +export const collections = { + docs: defineCollection({ + loader: antvDocsLoader({ base: './docs' }), + schema: antvDocsSchema, + }), +}; diff --git a/tsconfig.json b/tsconfig.json index 0e1ec37b4..18da92137 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,20 +1,15 @@ { - "include": ["site", ".dumi/theme", ".dumi/pages", "./typing.d.ts"], + "extends": "astro/tsconfigs/strict", "compilerOptions": { - "target": "esnext", - "module": "commonjs", - "lib": ["dom", "es2017"], - "jsx": "react", - "strict": false, - "esModuleInterop": true, - "experimentalDecorators": true, - "emitDecoratorMetadata": true, - "noEmit": true, - "resolveJsonModule": true, - "skipLibCheck": true, - "baseUrl": ".", - "paths": { - "site/*": ["./site/*"] - } - } + "lib": ["ES2022", "DOM", "DOM.Iterable"], + "module": "ESNext", + "moduleResolution": "Bundler", + "target": "ES2022" + }, + "include": [ + ".astro/types.d.ts", + "src/**/*.ts", + "site/Home.astro", + "site/data/**/*.ts" + ] } diff --git a/typing.d.ts b/typing.d.ts deleted file mode 100644 index d1dc2b9b3..000000000 --- a/typing.d.ts +++ /dev/null @@ -1,32 +0,0 @@ -import type { useIntl, FormattedMessage, useLocale } from 'react-intl'; - -declare module 'dumi' { - export const useIntl: typeof useIntl; - export const FormattedMessage: typeof FormattedMessage; - export const useLocale: typeof useLocale; -} - -declare module '@antv/dumi-theme-antv' { - const exports: any; - export = exports; -} - -declare module '@antv/dumi-theme-antv/*' { - const exports: { - useChinaMirrorHost: any; - Header: any; - Footer: any; - [key: string]: any; - }; - export = exports; -} - -declare module '@antv/dumi-theme-antv/dist/common/SEO' { - const SEO: any; - export default SEO; -} - -declare module '@antv/dumi-theme-antv/dist/slots/Article' { - const Article: any; - export default Article; -}