1
私はいくつかのCSSスタイルをZingChartコンテキストメニューに追加しようとしていますが、デフォルトのインラインスタイルがそれらをオーバーライドしています。コンテキストメニューのすべてのスタイルをクリアすることは可能ですか？ZingChartコンテキストメニュースタイルの問題
A
答えて
2
現在、スタイルを消去する方法はありません。 JSON syntaxで調整できます。 CSSを使用する必要がある場合。私はこれが唯一の選択肢ではありません期待していたコンテキストメニューのスタイルに
var myTheme = {
palette:{
line:[
['#FBFCFE', '#00BAF2', '#00BAF2', '#00a7d9'], /* light blue */
['#FBFCFE', '#E80C60', '#E80C60', '#d00a56'], /* light pink */
['#FBFCFE', '#9B26AF', '#9B26AF', '#8b229d'], /* light purple */
['#FBFCFE', '#E2D51A', '#E2D51A', '#E2D51A'], /* med yellow */
['#FBFCFE', '#FB301E', '#FB301E', '#e12b1b'], /* med red */
['#FBFCFE', '#00AE4D', '#00AE4D', '#00AE4D'], /* med green */
]
},
graph:{
backgroundColor:'#FBFCFE',
\t title: {
\t fontFamily: 'Lato',
\t fontSize: 14,
\t // border: "1px solid black",
\t padding: "15",
\t fontColor : "#1E5D9E",
\t adjustLayout:true
\t },
\t subtitle: {
\t fontFamily: 'Lato',
\t fontSize: 12,
\t fontColor: "#777",
\t padding: "5"
\t },
\t plot: {
\t backgroundColor:'#FBFCFE',
\t marker: {
\t size: 4
\t }
\t },
tooltip : {
visible:true,
text: "%kl<br><span style='color:%color'>%t: </span>%v<br>",
backgroundColor : "white",
borderColor : "#e3e3e3",
borderRadius : "5px",
bold : true,
fontSize : "12px",
fontColor : "#2f2f2f",
textAlign : 'left',
padding : '15px',
shadow : true,
shadowAlpha : 0.2,
shadowBlur : 5,
shadowDistance : 4,
shadowColor : "#a1a1a1"
},
\t plotarea: {
\t backgroundColor: 'transparent',
\t borderRadius: "0 0 0 10",
\t borderRight: "0px",
\t borderTop: "0px",
\t margin:"dynamic",
\t borderLeft:'1px solid #1E5D9E',
\t borderBottom:'1px solid #1E5D9E',
\t },
\t scaleX: {
\t zooming:true,
\t offsetY: -20,
\t lineWidth: 0,
\t padding: 20,
\t margin: 20,
\t label:{
\t text:"Scale-X"
\t },
\t item: {
\t padding: 5,
\t fontColor : "#1E5D9E",
\t fontFamily: 'Montserrat',
\t rules: [
\t {
\t rule: "%i == 0",
\t visible: false
\t }
\t ]
\t },
\t tick: {
\t lineColor: '#D1D3D4',
\t rules: [
\t {
\t rule: "%i == 0",
\t visible: false
\t }
\t ]
\t },
\t guide: {
\t visible: true,
\t lineColor : '#D7D8D9',
\t lineStyle: 'dotted',
\t lineGapSize: '4px',
\t rules: [
\t {
\t rule: "%i == 0",
\t visible: false
\t }
\t ]
\t }
\t },
\t scaleY: {
\t zooming:true,
\t lineWidth: 0,
\t label:{
\t text:"Scale-Y"
\t },
\t item: {
\t padding: "0 10 0 0",
\t fontColor : "#1E5D9E",
\t fontFamily: 'Montserrat',
\t rules: [
\t {
\t rule: "%i == 0",
\t offsetX:10,
\t offsetY:10,
\t backgroundColor:'none'
\t }
\t ]
\t },
\t tick: {
\t lineColor: '#D1D3D4',
\t rules: [
\t {
\t rule: "%i == 0",
\t visible:false
\t }
\t ]
\t },
\t guide: {
\t visible: true,
\t lineColor : '#D7D8D9',
\t lineStyle: 'dotted',
\t lineGapSize: '4px',
\t rules: [
\t {
\t rule: "%i == 0",
\t visible: false
\t }
\t ]
\t }
\t },
\t scrollX:{
\t bar:{
\t backgroundColor:'none',
\t borderLeft:'none',
\t borderTop:'none',
\t borderBottom:'none'
\t },
\t handle:{
\t backgroundColor:'#1E5D9E',
\t height:5
\t }
\t },
\t scrollY:{
\t borderWidth:0,
\t bar:{
\t backgroundColor:'none',
\t width:14,
\t borderLeft:'none',
\t borderTop:'none',
\t borderBottom:'none'
\t },
\t handle:{
\t borderWidth:0,
\t backgroundColor:'#1E5D9E',
\t width:5
\t }
\t },
\t zoom:{
\t backgroundColor:'#1E5D9E',
\t alpha:.33,
\t borderColor:'#000',
\t borderWidth:1
\t },
\t preview:{
\t borderColor:'#1E5D9E',
\t borderWidth:1,
\t adjustLayout:true,
\t handle:{
\t backgroundColor:'#1E5D9E',
\t borderColor:'#1E5D9E'
\t },
\t mask:{
\t backgroundColor:'#FFF',
\t alpha:.95,
\t }
\t }
}
};
var myConfig = {
\t type: "line",
\t title: {
\t text: "Average requests Per Minute",
\t },
\t subtitle: {
\t text: "06/10/16 - 06/23/16",
\t },
\t plotarea: {
\t marginTop:10,
\t marginBottom:80
\t },
\t scaleX: {
\t zooming:true,
\t labels:['6/10','6/11','6/12','6/13','6/14','6/15','6/16','6/17','6/18','6/19','6/20','6/21','6/22','6/23']
\t },
\t scaleY: {
\t zooming:true,
\t },
\t preview:{},
\t scrollX:{},
\t scrollY:{},
\t series : [
\t \t {
\t \t text: "Internal",
\t \t \t values : [6,6,3.5, 4.5, 4.5, 4.5, 2.5, 4.5, 4.5, 5, 5, 4, 5, 5],
\t \t },
\t \t {
\t \t text: "External",
\t \t \t values : [4.5, 4.5, 3.5, 3.5, 3.5, 2.5, 3.5, 3.5, 2.5, 2.5, 2, 3, 3, 2],
\t \t },
\t \t {
\t \t text: "Outbound",
\t \t \t values : [2.5, 1.5, 1.5, 2.5, 1.5, 1.5, 1.5, 1, 1, 1, 1, 2, 2, 3],
\t \t }
\t ]
};
zingchart.render({
\t id : 'myChart',
data: {
gui:{
contextMenu:{
button:{
visible: true,
lineColor: "#2D66A4",
backgroundColor: "#2D66A4"
},
gear: {
alpha: 1,
backgroundColor: "#2D66A4"
},
position: "right",
backgroundColor:"#306EAA", /*sets background for entire contextMenu*/
docked: true,
item:{
backgroundColor:"#306EAA",
borderColor:"#306EAA",
borderWidth: 0,
fontFamily: "Lato",
color:"#fff"
}
}
},
graphset:[myConfig]
},
\t height: 390,
\t width: '100%',
\t defaults: myTheme
});<!DOCTYPE html>
<html>
\t <head>
\t \t <script src= "https://cdn.zingchart.com/zingchart.min.js"></script></head>
\t <body>
\t <section>
\t \t <div id='myChart'></div>
\t \t </section>
\t </body>
</html>関連する問題
- 1. ZingChartズーム日付の問題
- 2. ZingChartの円グラフオプション
- 3. ZingChartバースペースが
- 4. Zingchartクリックイベント処理
- 5. ZingChart単列棒グラフグループラベル
- 6. ZingChartのTrellis Pie Chartのタイトル
- 7. ZingChart - ValueBoxのプロパティを変更
- 8. zingchartデータのグループ化とダウンサンプリング
- 9. ZingChart - ラベルとしての形状
- 10. Javaの問題の時間制限は、問題をコーディング問題
- 11. Zingchart - 関数をツールチップに渡す
- 12. ang2にzingchartを実装する方法
- 13. ZingChart JS - 可視ノードを取得
- 14. ZingChartでリセットタイムアウトを防ぐ方法
- 15. "zingchart-angularjsは利用できません"
- 16. ZingChart pieツールチップが表示されない
- 17. CodeIgniterのフォントの問題 - CORSの問題
- 18. テクスチャスケーリングの問題へのレンダリングの問題（？）
- 19. Djangoの問題：選択フィールドの問題
- 20. リンクの問題DirectX：リンカーの問題
- 21. jQuery Lavalampのアクティブな問題の問題
- 22. ケプラーデータ - Pythonの問題のない問題
- 23. テロリックコンボボックスレンダリングの問題（影の問題）
- 24. MediaPlayerボリュームの問題 - AudioStreamの問題
- 25. Cycle2 AutoHeightの次の問題/ Prev問題
- 26. cufonキャンバスの問題の問題
- 27. Angular2ルーティングの問題（URLルートオーダーの問題）
- 28. WP CSSの問題/ URLの問題
- 29. データバインドの問題リストボックスの問題
- 30. ERROR_LINE（）の問題Azure SQLデータウェアハウスの問題
を調整するだけで最も人気のstackoverflowの答えを使用して...！重要
デモ。しかし、ありがとう。 –