AmCharts 4:无法自定义我的系列(颜色,strokeWidth)

问题描述 投票:0回答:1

EDIT:好的,这是我的css页面的路径规则,因为我经常使用svg。删除了该规则,问题就消失了!

我正面临着很烦人的事情,我不明白。

我正在使用amChart多个系列制作XY图表。没那么难。问题是,我无法自定义我的系列!项目符号和图例都可以,但不是系列。

这里是一个屏幕截图,可帮助您更好地理解:

[MyWeirdChart(新OP无法嵌入图像,抱歉)

如您所见,我将自定义项目符号插入到我的系列中,而我的图例正是我想要的图表,但BUT系列保持不变。

这是我的JS绘图功能:

function drawChart(dateArray, casesArray, deathsArray, healedArray, hospitalizationsArray, reanimationsArray) {
    am4core.useTheme(am4themes_animated);
    var chart = am4core.create("chartdiv", am4charts.XYChart);
    chart.data = generateChartData(dateArray, casesArray, deathsArray, healedArray, hospitalizationsArray, reanimationsArray);

    var dateAxis = chart.xAxes.push(new am4charts.DateAxis());
    var valueAxis = chart.yAxes.push(new am4charts.ValueAxis());

    function pushSeries(field, name, color) {
        let series = chart.series.push(new am4charts.LineSeries());
        series.dataFields.valueY = field;
        series.dataFields.dateX = "date";
        series.name = name;
        series.tooltipText = name + ": [b]{valueY}[/]";
        series.stroke = am4core.color(color);
        series.strokeWidth = 3;
        series.fill = am4core.color(color);
        series.fillOpacity = 0.5;

        let bullet = series.bullets.push(new am4charts.CircleBullet());
        bullet.circle.stroke = am4core.color(color);
        bullet.circle.strokeWidth = 2;
        bullet.circle.fill = am4core.color(color);
        bullet.circle.fillOpacity = 0.5;
        bullet.circle.radius = 3;

    }

    pushSeries("cases", "Cas confirmés", "#32B3E3");
    pushSeries("healed", "Guéris", "#00C750");
    pushSeries("hospitalizations", "Hospitalisations", "#FFBB33");
    pushSeries("reanimations", "Réanimations", "#FE3446");
    pushSeries("deaths", "Morts", "black");

    chart.cursor = new am4charts.XYCursor();
    chart.scrollbarX = new am4core.Scrollbar();
    chart.legend = new am4charts.Legend();
    chart.cursor.maxTooltipDistance = 0;
}

我错过了什么吗?我浏览了论坛和文档,现在很无奈。我的代码在我的webpack app.js文件中。但我将amCharts包含在HTML脚本中,

<script src="https://www.amcharts.com/lib/4/core.js"></script>
<script src="https://www.amcharts.com/lib/4/charts.js"></script>
<script src="https://www.amcharts.com/lib/4/themes/animated.js"></script>

不适用于webpack导入。但是我想如果这是问题所在,我将根本无法绘制图表。

series amcharts
1个回答
0
投票

[确定,这是我的CSS页面上的路径规则,因为我经常使用svg。删除了该规则,问题就消失了!

© www.soinside.com 2019 - 2024. All rights reserved.