小编Seb*_*han的帖子

这是我的代码.我需要在x和y轴刻度中将初始值设置为"0".我尝试过最新的版本比例选项.

graphOptions = {               
            ///Boolean - Whether grid lines are shown across the chart
            scaleShowGridLines: false,    
            tooltipTitleTemplate: "<%= label%>",
            //String - Colour of the grid lines
            scaleGridLineColor: "rgba(0,0,0,.05)",
            //Number - Width of the grid lines
            scaleGridLineWidth: 1,
            //Boolean - Whether to show horizontal lines (except X axis)
            scaleShowHorizontalLines: true,
            //Boolean - Whether to show vertical lines (except Y axis)
            scaleShowVerticalLines: true,
            //Boolean - Whether the line is curved between points
            bezierCurve: true,
            //Number - Tension of the bezier curve between …

我最近一直在寻找为网页创建图表的解决方案.

在使用(过时版本)Highcharts的糟糕体验之后,我试图为D3.js提供机会,我发现它非常方便.

由于我的项目时间紧迫,我正在尝试找到一个可重复使用的图表库,它位于D3之上.
到目前为止,我发现的唯一候选人是味噌项目的d3.chart和NVD3.js.

问题是d3.chart只是制作可重复使用图表的一个小框架,而NVD3非常广泛,但不是非常灵活且非常缺乏文档.

是否有替代这些库(或者我应该开始编写一个)？

在Chart.js(Chart.js)中,是否可以为高于或低于给定阈值的值设置不同的填充颜色？

我在Chart.js中找不到任何选项,有人之前做过这样的事吗？我更喜欢在Highcharts上使用Chart.js.

像这样:Highcharts的例子

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>

<div id="container" style="height: 400px"></div>

JS

$(function () {
    $('#container').highcharts({
        chart: {
            type: 'area'
        },
        xAxis: {
            categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun']
        },
        yAxis: {
            title: {
                text: '$'
            }
        },
        title: {
            text: 'Win/Loss'
        },
        series: [{
            name: 'Avg. ($)',
            data: [546, 342, -234, -540, 103, -345],
            threshold: -1,
            negativeFillColor: 'rgba(255,0,0,0.5)',
            fillColor: 'rgba(0,204,0,0.5)',
            lineColor: 'rgba(0,0,0,1)',
            marker: {
                fillColor: 'rgba(255,255,255,1)',
                lineColor: 'rgba(0,0,0,1)',
                lineWidth: 1
            }
        },{
            name: 'User ($)',
            data: …

我想用nvd3(这是用d3.js制作的可重复使用的图表的集合)制作折线图,其中y和x轴由一条线表示.

以下是官方nvd3网站的折线图示例:

http://nvd3.org/examples/line.html

我想要这样的东西,其中X轴线显示:

http://i.imgur.com/m4JfqWl.png?1

有nvd3的任何选项吗？它甚至可能吗？谢谢.

如何修改此代码http://jsfiddle.net/r6p7E/6/以查看每次我选择时使用相同颜色选择的部分？只有当我点击这个时,我希望它是黄色的.

代码:

  $(function () {

            Highcharts.theme = {
            colors: ['#242c4a'],
            chart: {
             width: 350,
                backgroundColor: {
                    linearGradient: [0, 0, 500, 500],
                    stops: [
                        [0, 'rgb(255, 255, 255)'],
                        [1, 'rgb(240, 240, 255)']
                    ]
                }, 
            },

        };

        // Apply the theme
        Highcharts.setOptions(Highcharts.theme);

        // Build the chart
        $('#container').highcharts({
            chart: {
                plotBackgroundColor: null,
                plotBorderWidth: null,
                plotShadow: false
            },
            title: {
                text: 'Our Projects'
            },

            plotOptions: {

                pie: {


                    borderColor: '#48588c',
                    borderWidth: 7,
                     slicedOffset: 10,                     
                    allowPointSelect: true,
                    cursor: 'pointer',
                    dataLabels: {
                        enabled: false …

Highcharts 有一个功能，您可以选择时间序列图的一部分来放大该部分（http://www.highcharts.com/demo/line-time-series）：

d3 是否提供类似的功能，或者是否有插件模块可以提供此功能？