highcharts 筆記

Pluser 發(fā)布于2019-08-19 17:10 / 3084人閱讀

摘要：重置設(shè)置寬度給替換方法只能通過修改源代碼。使用方法把的線改為的形狀軸有線始終從最左端開始

reset zoom 重置

$(function() {

function resetChartZoom() {
    chart.zoomOut();
}

var chart = new Highcharts.StockChart({
    
    chart: {
        renderTo: "container",
        borderWidth: 1,
        plotBorderWidth: 1,
        resetZoomButton: {
            theme: {
                display: "none"
            }
        },
        zoomType: "xy"
    },
    
    rangeSelector: {
        selected: 1
    },
    
    series: [{
        name: "USD to EUR",
        data: usdeur
    }]
});

$("#resetZoom").click(function() {
    resetChartZoom();
});});

設(shè)置寬度

$("#container").highcharts().setSize(this.value, 400, false);

給highcharts 替換logo

方法只能通過修改源代碼。

    showCredits: function (credits) {
        if (credits.enabled && !this.credits) {
            this.credits = this.renderer.text(
                credits.text,
                0,
                0
            )
            .on("click", function () {
                if (credits.href) {
                    location.href = credits.href;
                }
            })
            .attr({
                align: credits.position.align,
                zIndex: 8
            })
            .css(credits.style)
            .add()
            .align(credits.position);
            if (credits.image) {
                this.renderer.image(credits.image.url, 0, 0, credits.image.width, credits.image.height)
                    .attr({
                        align: credits.position.align,
                        zIndex: 8
                    })
                    .add()
                    .align(jQuery.extend(credits.position, {
                        x: credits.image.x,
                        y: credits.image.y
                    }));
            }
        }
    },

使用方法

Highcharts.setOptions({
        credits: {
            enabled: true,
            text: "",
            style: {
                color: "#ccc",
                fontSize: "12px"
            },
            image: {
                url: require.toUrl("common/img/credit.png"),
                width: 38,
                height: 13,
                x: -50,
                y: -15
            }
        },

把highcharts line 的線改為square 的形狀

Highcharts.seriesTypes.line.prototype.drawLegendSymbol = Highcharts.seriesTypes.area.prototype.drawLegendSymbol;

x 軸有categories, 線始終從最左端開始

var categories = ["info1", "info2", "info3"];
xAxis： {
    categories: categories,
    tickPosition: "inside",
    tickmarkPlacement: "on",
    min: 0.5,
    max: categories.length - 1.5
}