Javascript 如何使用AnyChart生成自定义颜色？
如何使用AnyChart生成自定义颜色 这就是我目前所拥有的。我已经对这一行进行了注释，它指的是调色板-“试图在这里影响调色板”Javascript 如何使用AnyChart生成自定义颜色？,javascript,anychart,Javascript,Anychart,如何使用AnyChart生成自定义颜色 这就是我目前所拥有的。我已经对这一行进行了注释，它指的是调色板-“试图在这里影响调色板” anychart.onDocumentReady(function () { //Trying to affect palette here //led.palette = anychart.palettes.earth; // create a stage stage = anychart.graphics.create("diagramCont
anychart.onDocumentReady(function () {
//Trying to affect palette here
//led.palette = anychart.palettes.earth;
// create a stage
stage = anychart.graphics.create("diagramContainer");
// create data
var data = [170, 210, 130, 310];
// set the gauge type
led = anychart.gauges.led();
// set data for the gauge
led.data(data);
// add the default pointer
led.addPointer(2);
// set the size and position
led.bounds("50%", 0, "25%", "100%");
// sets background settings.
led.background({fill: "#FFFFFF 0.0"});
// sets left bound.
led.left("28%");
// sets height.
led.height("35%");
// set the container id
led.container(stage);
// initiate the gauge drawing
led.draw();
})) 调色板不是一个属性，它是一种方法，就像AnyChart中的几乎所有内容一样，下面是它的实现方式：
调色板不是一个属性，它是一个方法，就像AnyChart中的几乎所有内容一样，它是如何完成的：
以下是任意图表中带有自定义颜色的完整代码
<!doctype html>
<html>
<head>
<script src="https://cdn.anychart.com/js/7.14.3/anychart-bundle.min.js"></script>
<link rel="stylesheet" href="https://cdn.anychart.com/css/7.14.3/anychart-ui.min.css" />
<style>
html, body, #container {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<div id="container"></div>
<script type="text/javascript">
anychart.onDocumentReady(function() {
// create column chart
chart = anychart.column3d();
chart.background({fill: "#000000 3.5"});
//chart.Color("blue");
// turn on chart animation
chart.animation(true);
// set chart title text settings
chart.title('Top 10 Cosmetic Products by Revenue');
// create area series with passed data
chart.column([
['Rouge', '80'],
['Foundation', '9'],
['Mascara', '10'],
['Lip gloss', '11'],
['Pomade', '12'],
['Nail polish', '14'],
['Eyebrow pencil', '17'],
['Eyeliner', '21'],
['Eyeshadows', '24']
]).fill('red');
chart.tooltip()
.position('top')
.anchor('bottom')
.offsetX(0)
.offsetY(5)
.format('{%Value}%');
// set scale minimum
chart.yScale().minimum(0);
// set yAxis labels formatter
chart.yAxis().labels().format('{%Value}{groupsSeparator: }');
chart.tooltip().positionMode('point');
chart.interactivity().hoverMode('byX');
chart.xAxis().title('Products by Revenue');
chart.yAxis().title('Revenue in Dollars');
// set container id for the chart
chart.container('container');
var yLabels1 = chart.yAxis().labels();
yLabels1.format(function(){
return this.value + "%";
});
// initiate chart drawing
chart.draw();
});
</script>
</body>
</html
html，正文，#容器{
宽度：100%；
身高：100%；
保证金：0；
填充：0；
}
anychart.onDocumentReady（函数（）{
//创建柱形图
chart=anychart.column3d（）；
背景图（{fill:#0000003.5}）；
//图表。颜色（“蓝色”）；
//启用图表动画
图表.动画（真实）；
//设置图表标题文本设置
图表标题（“收入前十名化妆品”）；
//使用传递的数据创建面积系列
图表栏([
[胭脂，'80']，
['Foundation'，'9']，
[‘睫毛膏’、‘10’]，
[‘唇彩’、‘11’]，
['Pomade'，'12']，
[‘指甲油’、‘14’]，
[‘眉笔’，‘17’]，
[‘眼线’、‘21’]，
[‘眼影’、‘24’]
]).填充（“红色”）；
chart.tooltip（）
.位置（“顶部”）
.anchor（'底部'）
.offsetX（0）
.offsetY（5）
.format（“{%Value}%”）；
//设置最小刻度
chart.yScale（）最小值（0）；
//设置yAxis标签格式化程序
chart.yAxis（）.labels（）.format（“{%Value}{groupsSeparator:}”）；
chart.tooltip（）.positionMode（'point'）；
chart.interactivity（）.hoverMode（'byX'）；
chart.xAxis（）.title（“按收入划分的产品”）；
chart.yAxis（）.title（‘美元收入’）；
//设置图表的容器id
图表.集装箱（“集装箱”）；
var yLabels1=chart.yAxis（）.labels（）；
yLabels1.format（函数（）{
返回此值。值+“%”；
});
//启动图表绘制
chart.draw（）；
});
这里是任意图表中带有自定义颜色的完整代码
<!doctype html>
<html>
<head>
<script src="https://cdn.anychart.com/js/7.14.3/anychart-bundle.min.js"></script>
<link rel="stylesheet" href="https://cdn.anychart.com/css/7.14.3/anychart-ui.min.css" />
<style>
html, body, #container {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<div id="container"></div>
<script type="text/javascript">
anychart.onDocumentReady(function() {
// create column chart
chart = anychart.column3d();
chart.background({fill: "#000000 3.5"});
//chart.Color("blue");
// turn on chart animation
chart.animation(true);
// set chart title text settings
chart.title('Top 10 Cosmetic Products by Revenue');
// create area series with passed data
chart.column([
['Rouge', '80'],
['Foundation', '9'],
['Mascara', '10'],
['Lip gloss', '11'],
['Pomade', '12'],
['Nail polish', '14'],
['Eyebrow pencil', '17'],
['Eyeliner', '21'],
['Eyeshadows', '24']
]).fill('red');
chart.tooltip()
.position('top')
.anchor('bottom')
.offsetX(0)
.offsetY(5)
.format('{%Value}%');
// set scale minimum
chart.yScale().minimum(0);
// set yAxis labels formatter
chart.yAxis().labels().format('{%Value}{groupsSeparator: }');
chart.tooltip().positionMode('point');
chart.interactivity().hoverMode('byX');
chart.xAxis().title('Products by Revenue');
chart.yAxis().title('Revenue in Dollars');
// set container id for the chart
chart.container('container');
var yLabels1 = chart.yAxis().labels();
yLabels1.format(function(){
return this.value + "%";
});
// initiate chart drawing
chart.draw();
});
</script>
</body>
</html
html，正文，#容器{
宽度：100%；
身高：100%；
保证金：0；
填充：0；
}
anychart.onDocumentReady（函数（）{
//创建柱形图
chart=anychart.column3d（）；
背景图（{fill:#0000003.5}）；
//图表。颜色（“蓝色”）；
//启用图表动画
图表.动画（真实）；
//设置图表标题文本设置
图表标题（“收入前十名化妆品”）；
//使用传递的数据创建面积系列
图表栏([
[胭脂，'80']，
['Foundation'，'9']，
[‘睫毛膏’、‘10’]，
[‘唇彩’、‘11’]，
['Pomade'，'12']，
[‘指甲油’、‘14’]，
[‘眉笔’，‘17’]，
[‘眼线’、‘21’]，
[‘眼影’、‘24’]
]).填充（“红色”）；
chart.tooltip（）
.位置（“顶部”）
.anchor（'底部'）
.offsetX（0）
.offsetY（5）
.format（“{%Value}%”）；
//设置最小刻度
chart.yScale（）最小值（0）；
//设置yAxis标签格式化程序
chart.yAxis（）.labels（）.format（“{%Value}{groupsSeparator:}”）；
chart.tooltip（）.positionMode（'point'）；
chart.interactivity（）.hoverMode（'byX'）；
chart.xAxis（）.title（“按收入划分的产品”）；
chart.yAxis（）.title（‘美元收入’）；
//设置图表的容器id
图表.集装箱（“集装箱”）；
var yLabels1=chart.yAxis（）.labels（）；
yLabels1.format（函数（）{
返回此值。值+“%”；
});
//启动图表绘制
chart.draw（）；
});
我认为您可以直接修改现有调色板中的颜色项目：
let palette = anychart.palettes.distinctColors();
palette.items(
['#00FF00', '#FFFF00', '#FFA500', '#FF0000','#F0F0F0', '#101010']
);
// create a tag cloud chart
var chart = anychart.tagCloud(data);
chart.background({fill: "#2F2F2F 3.5"});
chart.palette(palette);
//...
chart.draw()
我认为您可以直接修改现有调色板中的颜色项目：
let palette = anychart.palettes.distinctColors();
palette.items(
['#00FF00', '#FFFF00', '#FFA500', '#FF0000','#F0F0F0', '#101010']
);
// create a tag cloud chart
var chart = anychart.tagCloud(data);
chart.background({fill: "#2F2F2F 3.5"});
chart.palette(palette);
//...
chart.draw()