1

私のflotchartは正しくレンダリングされていません。2つのターゲットブラウザ(ie8とfirefox)で、このグラフはデータの前にグリッド線でレンダリングされます

ChromeとSafariでは、線がまったく表示されません。これは望ましい結果です。Internet Explorer 8では、グラフはVMLとしてレンダリングされ、グリッド線をvmlオブジェクトとして分離できました。残念ながら、これらのオブジェクトの非表示に関連するCSSは、CSS2に限定されている間は注意が必要であり、Firefoxでは機能しません。グラフの一部は個別の要素としてレンダリングされません。

これがグラフコードですhttp://jsfiddle.net/gamm/t3Vqh/2/

var dataset = [overdue, open, completed];

var options = {
    series: {
        stack: true,
        bars: {
            show: true
        }
    },
    bars: {
        align: "center",
        horizontal: false,
        barWidth: .8,
        lineWidth: 0
    },
    grid: {
        borderWidth: 0,
        borderColor: null,
        backgroundColor: null,
        labelMargin: 10,
        minBorderMargin: 10
    },
    yaxis: {
        tickColor: "FFFFFF"
    },
    xaxis: {
        tickColor: "FFFFFF",
        ticks: [
            [1, "Public Works"],
            [2, "Sanitation"],
            [3, "Mayor"],
            [4, "L&I"],
            [5, "Police"]
        ]
    },
    legend: {
        position: 'ne',
        show: true
    }
};

$.plot($("#example-section15 #flotcontainer"), dataset, options);
4

1 に答える 1

1

ここで起こっていることが2つあります。

  1. Flotは常にシリーズフィルの上にグリッド線を描画しているようです。線はデフォルトで非常に軽いため、これはバグとは見なされませんでした。バー(または線など)に境界線がある場合、その影響ははるかに目立たなくなります。

  2. IEに黒い線があるのは、「FFFFFF」が有効な色仕様ではないためです。代わりに「#ffffff」(または「transparent」)を使用すると、IEは他のブラウザと同じように見え、より寛容になります。これはIE8やExcanvasに限定されません。IE10でさえそのフォーマットで窒息します。

前者は間違いなくバグであるため、Githubで問題として提出する価値があるかもしれません。

于 2013-03-21T19:34:44.533 に答える