docloud バックグラウンド管理プロジェクト (フロントエンド)_html/css_WEB-ITnose

以下の内容は本題と関係ありません、読みたくない方は無視していただいて結構です

!--無視開始--!

私は皆さんに強力なエディターをお勧めしたいと思います。それは、高速な応答、優れたエクスペリエンス、高いスタイルと豊富な機能を兼ね備えた Sublime Text 3 です。上記の機能に加えて、最も重要な機能の 1 つも備えています。便利で高速なプラグイン拡張、多数のプラグインをサポートし、すべてのプラグインをコマンド ラインでサポートするだけで簡単なコマンドでプラグインを完了できます。インストール。開発効率を向上させたい場合は、Sublime が最適です。

!――無視の末路――！

以下は、プロジェクト開発中に遭遇する問題、または学習したフロントエンド技術です:

1. Height:100% 設定は無効です

解決策: html, body {margin: 0; 100 %}

2. div を中央揃えにする

解決策:

2 つの解決策

1. 最初のケースでは、div 幅が固定されている場合、幅を div に設定し、次に margin: 0 auto;

2 番目のケースでは、div の幅が固定されていないか、div の幅を制限したくない場合は、div に display:inline-block を設定し、それに text-align:center を追加します。親要素;

3. 純粋な CSS の実装 奇数行と偶数行

解決策:

css: tr:nth-child(odd){background-color: # の :nth-child(odd) セレクターを使用するだけです。 eee}

4. CSSでやる 簡単な操作

解決策:

calc関数を使う: th{width: calc(100%/7);}

5. jsオブジェクトを走査する

解決策:

for (var k in j sObj) {

console.info("key:" + k + ",value:" + jsObj[k]);

}

6. ie Date.getTime を解きます。互換性の問題

解決策:

IEはyyyy-mm-ddの日付形式に対応していないので、「-」を「/」に置き換えると問題が解決します

function getTime(dateStr){
dateStr = dateStr. replace("-", "/") ;
return Date.parse(dateStr);
}

データ分析の背景なので、使用しているプラ​​グインはhighchartsです。 highcharts の使用経験をいくつか示します:

データの変更と表示を容易にするために、一般にグローバル パラメーターが定義されます

//图表参数var chart = {    chart: {        zoomType: 'x',        spacingRight: 20    },    title: {        text: '曲线图'    },    xAxis: {        type: 'datetime',        title: {            text: '时间'        },        dateTimeLabelFormats: {            second: '%H:%M:%s',            minute: '%d日 %H:%M',            hour: '%m月%d日%H点',            day: '%Y年%m月%d',            week: '%Y-%m-%d',            month: '%Y年%m月',            year: '%Y年'        }    },    yAxis: {        title: {            text: '体温'        }    }};

内部のパラメーターはすべて名前でよく知られているため、詳細については、関連ドキュメントを参照してください。ここでの xAxis の type: 'datetime' は、x 軸が時間に従って表示されることを意味します。

これはチャートの初期化方法です:

var ser = []; var ser = [];ser[0] = {    type:'line',    name: "参数名",    data: [        ["X值","Y值"],        ["X值","Y值"],        ["X值","Y值"]    ]};chart.series = ser;           $('#container').highcharts(chart);

X 軸が時間に従って表示される場合、X 値はバインドする前に X 軸で昇順に並べ替えることを忘れないでください。