リトマス-高騰する高所
7795 ワード
について
LitmusChainは、Kubernetes開発者とSRESが簡単にカオステストを実行するために必要なツールの完全なセットを提供し、Kubernetesネイティブの方法で.LitmusChaosはKubernetesのカオス工学のフレームワークです.
このプロジェクトは基本的な設計目標として「宣言的カオス」を持ち,カオス実験を発展させるためにコミュニティを中心にしている.
リトマス含んでいる
カオス演算子
カオスCrds
カオス実験かカオスシュブ
カオススケジューラ
カオスメートル法輸出者
カオスイベント輸出者
ポータル
このブログでは、主にリトマス解析について話します。
さて、解析論についての幅広い議論をしましょう.
1実験の解析と成長
2 .リトマスユーザーがいる最も人気のある場所
3マップの構造と依存性
4 .データを読み込んで、反応アプリで図書館から基本的な地図を貸すこと
参考文献
ユーザーについての解析論
我々のコミュニティは、これらの日に大きな高さに達していることを共有して満足しており、我々はこのマイルストーンを達成して満足しており、我々は常に私たちをサポートするためのユーザーに感謝しています.最近、我々はユーザーから大きな反応を得ていて、活発なユーザーがたくさんいます.我々は、我々の資源と我々の仕事を世界的に拡大しようとしています.
注意:上記解析データは2020年8月25日に注目された.
現在の状況では、我々は14 K +をインストールし、合計実験を108 K +を実行し、合計実験35とGithubスター1 K +をカウントし、カウントしている.
リトマス成長
以下のグラフは、オペレーター実験解析に基づくリトマスコミュニティの成長を示しています.
実験
一般的な:ポッド削除、コンテナキル、ポッドネットワーク待ち時間、ポッドネットワーク損失、ポッドネットワーク腐敗、ポッドCPUホッグ、ポッドメモリホッグ、ディスクフィル、ディスク損失、ノードCPUホッグ、ノードメモリホッグ、ノードドレイン、Kubeletサービスキル、ポッドネットワーク重複、ノード汚染、Dockerサービスキル、ポッドAutoscaler.
Kubernetesアプリケーションポッド、Kubernetesアプリケーションサービス、Kubernetesクラスタレベルポッド-キア、EC 2終了します.
OpenEBS :ターゲットコンテナの故障、ターゲットのネットワーク遅延、ターゲットのネットワーク損失、ターゲットのPODの障害、プールポッドの故障、プールコンテナの故障、プールネットワークの遅延、プールのネットワーク損失、制御平面のカオス、Cstorプールの混乱、プールのディスク損失、NFSのプロビジョナーを殺す.
カフカ:ブローカーポッド失敗、ブローカーディスク失敗、Coredns Corednsポッド削除、Cassandraカッサンドラポッド削除.
リトマスユーザーがいる最も人気のある場所
我々は現在、リムマスユーザーが位置している170 +都市と35 +国世界を横断している.現在、トップ10国は、インド、アメリカ、中国、オランダ、フランス、ウクライナ、ドイツ、日本、アイルランド、台湾です.
シティワイズユーザー
ここでは、マップ内の特定の都市からのユーザーを含む世界的な統計情報が表示されます.
田舎のユーザー
ここでは、マップ内の特定の国からのユーザーを含む当社の世界的な統計情報を見ることができます.
マップの構造と依存性
ジオマップを作成するには、基本的な反応の知識を持っている必要があります.我々は、開発のための反応とtypescriptを使用している.
地図の為にreact-simple-maps
シティワイズプロットreact-google-charts
国ごとのプロット.
私のアプローチは、地理的に都市地図を使用してデータをプロットすることでしたので、それは適切な可視化を持って地図上のドットを表示するには良いです.
データを読み込んで、反応アプリとコードで図書館から基本的な地図を貸すこと
コード構造は次のとおりです.
┬ Litmus-Portal
├─┬ backend
| └ frontend
| ├─┬ src
| └── components
| ├─┬ GeoMap
│ ├── CityMap.tsx
| ├── CountryMao.tsx
| ├── index.ts
│ └── geo.json
シチープ
CityMapコンポーネントカオスマップの都市賢明なカウントに基づいて地図をレンダリングします.マーカーの投影をカスタマイズしたいのでマーカープロパティを利用します.
名前のインターフェイスを定義することによって起動し、コンポーネントがマウントされると、座標&データが非同期に読み込まれます(useEffect ()).また、geoをフェッチします.座標をマップするJSON.
投影マーカーについては、サークルの不透明度と同じ色を保ちます.
必要なライブラリを以下に与え、geourlはマッピング目的のための世界地図の座標です.
import React, { useEffect, useState } from 'react';
import { useSelector } from 'react-redux';
import {
ComposableMap,
Geographies,
Geography,
Marker,
ZoomableGroup,
} from 'react-simple-maps';
import { RootState } from '../../redux/reducers';
import datageo from './geo.json';
const geoUrl = datageo;
Replyコンポーネントには、マップコンポーネントに属するプロパティを格納する状態オブジェクトが組み込まれています.状態オブジェクトが変更されると、コンポーネントが再表示されます.
const [mapData, setMapData] = useState<CityData[]>([]);
const geoCity = useSelector(
(state: RootState) => state.communityData.google.geoCity
);
useEffect(() => {
const cityData: CityData[] = [];
geoCity.map((e) =>
cityData.push({
name: e.name,
coordinates: [parseFloat(e.longitude), parseFloat(e.latitude)],
})
);
setMapData(cityData);
マーカー付きマップの追加
各都市地図上のデータを表示するには、私はマーカーマップイベントリスナーを構成可能なマップとズーム可能なグループと一緒に追加しました.
<ComposableMap style={{width: 640, height: 340,}}>
<ZoomableGroup zoom={1.3}>
<Geographies geography={geoUrl}>
{({ geographies }) =>
geographies.map((geo) => (
<Geography
key={geo.rsmKey}
geography={geo}
fill="#CFCFCF"
stroke="#CFCFCF"
/>
))
}
</Geographies>
{mapData &&
mapData.map(({ name, coordinates }) => (
<Marker key={`${name}_${coordinates}`} coordinates={coordinates}>
<g
stroke="#858CDD"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
transform="translate(-12, -24)"
>
<circle cx="12" cy="10" r="4" />
</g>
</Marker>
))}
</ZoomableGroup>
</ComposableMap>
国民投票
CountryMapコンポーネントは、国の賢明なカウント数に基づいてマップをレンダリングします.
このアプローチはCityMapsと同じですが、データの国を賢くレンダリングし、ホバリング効果を追加します.
元々、データは2 D配列の状態に列国とユーザで格納されているので、マップコンポーネントに属するプロパティを格納するcountrymap変数を受け取りました.状態オブジェクトが変更されると、コンポーネントが再表示されます.
const CountryMap = () => {
const data: string[][] = useSelector(
(state: RootState) => state.communityData.google.geoCountry
);
const parsedData = data.map((item) => [item[0], parseInt(item[1], 10)]);
parsedData.unshift(['Country', 'Count'])
勾配の表示
データの強度についてのアイデアをユーザに与えるために,すべての値のmin=最小値と最大値の最大値を持つ線形勾配を示すことができる.
各国のホバーにデータを表示するには、OnMouseEnterとOnMouseReaveイベントリスナーを追加できます.
<Chart
style={{ margin: 'auto' }}
width="640px"
height="340px"
chartType="GeoChart"
data={parsedData}
options={{
colorAxis: { colors: ['#2CCA8F', 'gray', '#5B44BA']
},
backgroundColor: '#ffffff',
datalessRegionColor: '#CFCFCF',
defaultColor: '#CFCFCF',
}}
rootProps={{ 'data-testid': '1' }}
/>
我々は、リトマスコミュニティに貢献するユーザーを探しています。
参照とリンク
LitmusChaos
Litmus ChaosHub
Github Repo Litmus
Connect with us on Slack
我々は、我々はユーザーの成長に貢献していると私たちと一緒に上昇し、輝きを支援して満足している.
Reference
この問題について(リトマス-高騰する高所), 我々は、より多くの情報をここで見つけました
https://dev.to/oumkale/litmus-soaring-height-nbd
テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol
┬ Litmus-Portal
├─┬ backend
| └ frontend
| ├─┬ src
| └── components
| ├─┬ GeoMap
│ ├── CityMap.tsx
| ├── CountryMao.tsx
| ├── index.ts
│ └── geo.json
import React, { useEffect, useState } from 'react';
import { useSelector } from 'react-redux';
import {
ComposableMap,
Geographies,
Geography,
Marker,
ZoomableGroup,
} from 'react-simple-maps';
import { RootState } from '../../redux/reducers';
import datageo from './geo.json';
const geoUrl = datageo;
const [mapData, setMapData] = useState<CityData[]>([]);
const geoCity = useSelector(
(state: RootState) => state.communityData.google.geoCity
);
useEffect(() => {
const cityData: CityData[] = [];
geoCity.map((e) =>
cityData.push({
name: e.name,
coordinates: [parseFloat(e.longitude), parseFloat(e.latitude)],
})
);
setMapData(cityData);
<ComposableMap style={{width: 640, height: 340,}}>
<ZoomableGroup zoom={1.3}>
<Geographies geography={geoUrl}>
{({ geographies }) =>
geographies.map((geo) => (
<Geography
key={geo.rsmKey}
geography={geo}
fill="#CFCFCF"
stroke="#CFCFCF"
/>
))
}
</Geographies>
{mapData &&
mapData.map(({ name, coordinates }) => (
<Marker key={`${name}_${coordinates}`} coordinates={coordinates}>
<g
stroke="#858CDD"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
transform="translate(-12, -24)"
>
<circle cx="12" cy="10" r="4" />
</g>
</Marker>
))}
</ZoomableGroup>
</ComposableMap>
const CountryMap = () => {
const data: string[][] = useSelector(
(state: RootState) => state.communityData.google.geoCountry
);
const parsedData = data.map((item) => [item[0], parseInt(item[1], 10)]);
parsedData.unshift(['Country', 'Count'])
<Chart
style={{ margin: 'auto' }}
width="640px"
height="340px"
chartType="GeoChart"
data={parsedData}
options={{
colorAxis: { colors: ['#2CCA8F', 'gray', '#5B44BA']
},
backgroundColor: '#ffffff',
datalessRegionColor: '#CFCFCF',
defaultColor: '#CFCFCF',
}}
rootProps={{ 'data-testid': '1' }}
/>
Reference
この問題について(リトマス-高騰する高所), 我々は、より多くの情報をここで見つけました https://dev.to/oumkale/litmus-soaring-height-nbdテキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol