标签: charts

我正在使用这个例子：http : //c3js.org/samples/chart_area_stacked.html

我将为许多数据集制作一个面积图，我想制作它以使面积图不透明。是否有任何我可以设置的属性或我可以添加的类来实现它？

我有一些像 (x1,y1), (x2,y2), (x3,y3)...

现在我想绘制一个曲线平滑的图表？

我正在尝试绘制如下

-(void)drawPrices
{
    NSInteger count = self.prices.count;
    
    UIBezierPath *path = [UIBezierPath bezierPath]; 
    path.lineCapStyle = kCGLineCapRound;

    for(int i=0; i<count-1; i++)
    {
        CGPoint controlPoint[2];
        
        CGPoint p = [self pointWithIndex:i inData:self.prices];
        if(i==0)
        {
            [path moveToPoint:p];
        }

        CGPoint nextPoint, previousPoint, m;
        nextPoint = [self pointWithIndex:i+1 inData:self.prices];
        previousPoint = [self pointWithIndex:i-1 inData:self.prices];
        
        if(i > 0) {
            m.x = (nextPoint.x - previousPoint.x) / 2;
            m.y = (nextPoint.y - previousPoint.y) / 2;
        } else {
            m.x = (nextPoint.x - p.x) / 2; …

嗨，我正在为我的网站寻找一个好的图表插件。我找到了 highcharts，它解决了我的大部分需求。现在我用这个插件构建了如下图表：

$(function () {
    $('#container').highcharts({
        chart: {
            zoomType: 'xy'
        },
        title: {
            text: 'Connect Values'
        },
        subtitle: {
            text: 'Value 1 and Value 2'
        },
        xAxis: [{
            categories: ['24.05.2015', '01.06.2015', '12.06.2015', '19.06.2015', '25.06.2015'],
            crosshair: true
        }],
        yAxis: [{ // Primary yAxis
            labels: {
                format: '{value}',
                style: {
                    color: Highcharts.getOptions().colors[1]
                }
            },
            title: {
                text: 'Value 1',
                style: {
                    color: Highcharts.getOptions().colors[1]
                }
            }
        }, { // Secondary yAxis
            title: {
                text: 'Value 2',
                style: {
                    color: Highcharts.getOptions().colors[0]
                }
            },
            labels: …

我一直试图在我的网页上显示一些复杂的数据，并选择了 chart.js 来做到这一点。因此，我需要将多个堆叠的条水平分组。

我已经为“普通”条找到了这个小提琴，但还不能完全改变它以与水平条一起使用。

Stackoverflow 问题：Chart.js 堆叠和分组条形图

原始小提琴（http://jsfiddle.net/2xjwoLq0/）有

Chart.defaults.groupableBar = Chart.helpers.clone(Chart.defaults.bar);

我只是用 .horizo​​ntalBar 替换了代码中随处可见的 .bar （很清楚这不会成功）。

Chart.defaults.groupableBar = Chart.helpers.clone(Chart.defaults.horizontalBar);

由于这不太奏效，我尝试在此处添加针对水平条的建议的第二个堆叠修饰符： 使用 chart.js 的水平堆叠条形图并翻转 X 和 Y 计算的函数 (calculateBarY/calculateBarX)

这很有效，因为堆栈不会正确地相互合并。

http://jsfiddle.net/2xjwoLq0/3/

如果有人能帮助我解决这个问题，我将不胜感激。

我正在使用这些类来制作图表：https : //github.com/danielgindi/Charts 。我目前有一个饼图显示两个选项，我想知道如何以编程方式突出显示其中一个选项。

我想设置一个连续整数步骤，即0,1,2,3,4,.......在我的图表中 valueAxis。我怎样才能做到这一点？

我一直在我的 Xamarin.ios 和 Xamarin.Android 项目中使用 OxyPlot 来绘制柱状图。这就是我使用 oxyplot 绘制柱状图的方式。

现在我需要一个堆积柱形图。我在文档中找不到它。oxyplot 有可能吗？如何？任何帮助表示赞赏..

public class MeasurementGraph 
{

    public PlotModel VitalModel { get; set; }
    public VitalGraph graph { get; set; }

    public MeasurementGraph (VitalGraph graph)
    {
        this.graph = graph;
        var model = new PlotModel { Title = "" };
        model.PlotAreaBorderColor = OxyColors.Transparent;

        model.Axes.Add (GetXAxis ());
        model.Axes.Add (GetYAxis ());
        model.Series.Add (GetValueSeries ());

        if (Math.Abs (graph.trendStart) > float.Epsilon && Math.Abs (graph.trendEnd) > float.Epsilon)
            model.Series.Add (GetXtraSeries ());
            VitalModel = model;
        }

    CategoryAxis GetXAxis ()
    { …

我有一个在 QML 中声明的 ChartView 项目，我需要一个类似橡皮筋的缩放功能。这可以通过半透明矩形和 MouseArea 项目来实现。问题在于一个矩形只能选择从左上角到右下角的区域，因为具有负 dim-s 的 Rectangle 项目要么不可见，要么被禁用。虽然可以对 Rectangle 应用变换

transform: Scale { origin.x: 0; origin.y: 0; xScale: -1}

我没有找到如何从外部操作 xScale/yScale 属性。

现在我画了 4 个矩形，每个象限一个，具有正确的 xScale/yScale 和暗淡（最后的代码）。

所以我想知道这个问题有更优雅/简单的解决方案吗？

ChartView {
    id: chartViewTop
    ...

    Rectangle{
        id: rubberBandRec1
        border.color: "black"
        border.width: 1
        opacity: 0.3
        visible: false
        transform: Scale { origin.x: 0; origin.y: 0; yScale: -1}
    }

    Rectangle{
        id: rubberBandRec2
        border.color: "black"
        border.width: 1
        opacity: 0.3
        visible: false
        transform: Scale { origin.x: 0; origin.y: 0; yScale: -1; xScale: -1}
    } …

我尝试使用chartjs 2显示example1和example2数据。当我创建图表时，它的工作良好并显示图形。但是当我将鼠标悬停在图形点上时，它显示了正确的信息，但图形显示了错误的信息。

它的节目是这样的

在上面的屏幕截图中，y-Axes 显示10但点悬停显示6 如何解决这个问题？

这是代码

var lables = [];
    s = [{
        'example1' : '{01-Mar-17 : 0, 02-Mar-17 : 6}',
        'example2' : '{01-Mar-17: 0, 02-Mar-17: 4}'
    }]; 
    var example1 = [];
    var example2 = [];
    $.each(s.example1,function(i,j){
        lables.push(i);
        example1.push(j);
    });
    $.each(s.example2,function(i,k){
        example2.push(k);
    });
    var ctx = document.getElementById('chartdata').getContext('2d');
    var myChart = new Chart(ctx, {
      type: 'line',
      data: {
        labels: lables,
        datasets: [{
            label: 'Example 1',
            fill: false,
            lineTension: 0.1,
            backgroundColor: convertHex('#00a3d0',40),
            borderColor: convertHex('#00a3d0',80),
            borderCapStyle: 'butt',
            borderDash: [], …

我想问一下是否可以在半圆环图上显示数据值？想要通过从这里的数组中获取其值来将数据值显示为图表底部的文本是链接：https : //jsfiddle.net/z638ttv0/16/

我在这里先向您的帮助表示感谢

var ctx = document.getElementById("myChart");
var myChart = new Chart(ctx, {
    type: 'doughnut',
    data: {
        labels: ["Red"],
        datasets: [{
            label: '# of Votes',
            data: [50,100-50],
            backgroundColor: [

                'rgba(255, 159, 64, 0.2)'
            ],
            borderColor: [

                'rgba(255, 159, 64, 1)'
            ],
            borderWidth: 1
        }]
    },
    options: {
        rotation: 1 * Math.PI,
        circumference: 1 * Math.PI
    }
});