Руководство по Amcharts

Когда я добавляю guides в valueAxesSettings, но он не работает, даже я выбираю valueAxesSettings в valueAxes. Кроме того, какая разница между valueAxesSettings и valueAxes, в качестве ссылки сказано If you change a property after the chart is initialized, you should call stockChart.validateNow() method in order for it to work.? что это значит?Руководство по Amcharts

<!DOCTYPE HTML> 
<html> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=utf-8"> 
<title>My first stock chart</title> 
<link rel="stylesheet" href="amcharts/style.css" type="text/css"> 

<script src="//www.amcharts.com/lib/3/amcharts.js"></script> 
<script src="//www.amcharts.com/lib/3/serial.js"></script> 
<script src="//www.amcharts.com/lib/3/themes/light.js"></script> 
<script src="//www.amcharts.com/lib/3/amstock.js"></script> 

<style> 
    #chartdiv { 
     width: 100%; 
     height: 500px; 
     font-size: 11px; 
    } 
</style> 

<script type="text/javascript"> 
     AmCharts.makeChart("chartdiv", { 
      "type": "stock", 
      "dataDateFormat": "YYYY-MM-DD", 
      "dataSets": [ { 
       "dataProvider": [ { 
        "date": "2011-06-01", 
        "val": 10 
       }, { 
        "date": "2011-06-02", 
        "val": 11 
       }, { 
        "date": "2011-06-03", 
        "val": 12 
       }, { 
        "date": "2011-06-04", 
        "val": 11 
       }, { 
        "date": "2011-06-05", 
        "val": 10 
       }, { 
        "date": "2011-06-06", 
        "val": 11 
       }, { 
        "date": "2011-06-07", 
        "val": 13 
       }, { 
        "date": "2011-06-08", 
        "val": 14 
       }, { 
        "date": "2011-06-09", 
        "val": 17 
       }, { 
        "date": "2011-06-10", 
        "val": 13 
       } ], 
       "fieldMappings": [ { 
        "fromField": "val", 
        "toField": "value" 
       } ], 
       "categoryField": "date" 
      } ], 

      "panels": [ { 

       "legend": {}, 

       "stockGraphs": [ { 
        "id": "graph1", 
        "valueField": "value", 
        "type": "line", 
        "title": "MyGraph", 
        "fillAlphas": 0 
       } ] 
      } ], 

      "panelsSettings": { 
       "startDuration": 1 
      }, 

      "categoryAxesSettings": { 
       "dashLength": 5 
      }, 

      "valueAxesSettings": { 
       "dashLength": 13, 
       "guides": { 
        "value": 10, 
        "tovalue": 12, 
        "lineColor": "#CC0000", 
        "lineAlpha": 1, 
        "fillAlpha": 0.2, 
        "fillColor": "#CC0000", 
        "dashLength": 2, 
        "inside": true, 
       } 
      }, 

      "chartScrollbarSettings": { 
       "graph": "graph1", 
       "graphType": "line", 
       "position": "bottom" 
      }, 

      "chartCursorSettings": { 
       "valueBalloonsEnabled": true 
      }, 

      "periodSelector": { 
       "periods": [ { 
        "period": "DD", 
        "count": 1, 
        "label": "1 day" 
       }, { 
        "period": "DD", 
        "selected": true, 
        "count": 5, 
        "label": "5 days" 
       }, { 
        "period": "MM", 
        "count": 1, 
        "label": "1 month" 
       }, { 
        "period": "YYYY", 
        "count": 1, 
        "label": "1 year" 
       }, { 
        "period": "YTD", 
        "label": "YTD" 
       }, { 
        "period": "MAX", 
        "label": "MAX" 
       } ] 
      } 
     }); 
</script> 
</head> 
<body> 
<div id="chartdiv"></div> 
</body> 
</html>

источник

2016-09-27 user6703592

Когда вы меняете свойства после инициализации графика, вам нужно вызвать validateNow(), чтобы график был перерисован с использованием новых (измененных) настроек. Вы также вызываете validateData(), но это необязательно. – Anurag

Чтобы развернуть комментарий @ Anurag, вы используете 'validateData', когда вы меняете данные диаграммы. 'validateNow' не обрабатывает это по умолчанию, если вы не установите для первого параметра значение true, например. 'validateNow (true, false)' является эквивалентом 'validateData()'. – xorspark

valueAxesSettings глобальная версия valueAxes - все, что вы установили в valueAxesSettings будет применяться к valueAxes объектов всех фондовых групп по. Если вы хотите, чтобы отменить или установить определенный параметр в одном из valueAxes ваших панелей, вы можете установить valueAxes внутри панель:

"panels": [{ 
    "valueAxes":[{ 
    //settings specific to this panel 
    }], 
    // ... 
}, { 
    "valueAxes": [{ 
    //settings specific to this panel 
    }] 
}

Свойства guides является массивом. Вы устанавливаете его как один объект, который является неправильным. Кроме того, свойство называется toValue, а не «tovalue» - важно иметь корпус. Вот исправленный valueAxesSettings объект:

"valueAxesSettings": { 
    "dashLength": 13, 
    "guides": [{ 
     "value": 10, 
     "toValue": 12, 
     "lineColor": "#CC0000", 
     "lineAlpha": 1, 
     "fillAlpha": 0.2, 
     "fillColor": "#CC0000", 
     "dashLength": 2, 
     "inside": true 
    }] 
    },

Демо:

AmCharts.makeChart("chartdiv", { 
 
    "type": "stock", 
 
    "dataDateFormat": "YYYY-MM-DD", 
 
    "dataSets": [{ 
 
    "dataProvider": [{ 
 
     "date": "2011-06-01", 
 
     "val": 10 
 
    }, { 
 
     "date": "2011-06-02", 
 
     "val": 11 
 
    }, { 
 
     "date": "2011-06-03", 
 
     "val": 12 
 
    }, { 
 
     "date": "2011-06-04", 
 
     "val": 11 
 
    }, { 
 
     "date": "2011-06-05", 
 
     "val": 10 
 
    }, { 
 
     "date": "2011-06-06", 
 
     "val": 11 
 
    }, { 
 
     "date": "2011-06-07", 
 
     "val": 13 
 
    }, { 
 
     "date": "2011-06-08", 
 
     "val": 14 
 
    }, { 
 
     "date": "2011-06-09", 
 
     "val": 17 
 
    }, { 
 
     "date": "2011-06-10", 
 
     "val": 13 
 
    }], 
 
    "fieldMappings": [{ 
 
     "fromField": "val", 
 
     "toField": "value" 
 
    }], 
 
    "categoryField": "date" 
 
    }], 
 

 
    "panels": [{ 
 

 
    "valueAxes": [{ 
 

 
    }], 
 

 
    "legend": {}, 
 

 
    "stockGraphs": [{ 
 
     "id": "graph1", 
 
     "valueField": "value", 
 
     "type": "line", 
 
     "title": "MyGraph", 
 
     "fillAlphas": 0 
 
    }] 
 
    }], 
 

 
    "panelsSettings": { 
 
    "startDuration": 1 
 
    }, 
 

 
    "categoryAxesSettings": { 
 
    "dashLength": 5 
 
    }, 
 

 
    "valueAxesSettings": { 
 
    "dashLength": 13, 
 
    "guides": [{ 
 
     "value": 10, 
 
     "toValue": 12, 
 
     "lineColor": "#CC0000", 
 
     "lineAlpha": 1, 
 
     "fillAlpha": 0.2, 
 
     "fillColor": "#CC0000", 
 
     "dashLength": 2, 
 
     "inside": true 
 
    }] 
 
    }, 
 

 
    "chartScrollbarSettings": { 
 
    "graph": "graph1", 
 
    "graphType": "line", 
 
    "position": "bottom" 
 
    }, 
 

 
    "chartCursorSettings": { 
 
    "valueBalloonsEnabled": true 
 
    }, 
 

 
    "periodSelector": { 
 
    "periods": [{ 
 
     "period": "DD", 
 
     "count": 1, 
 
     "label": "1 day" 
 
    }, { 
 
     "period": "DD", 
 
     "selected": true, 
 
     "count": 5, 
 
     "label": "5 days" 
 
    }, { 
 
     "period": "MM", 
 
     "count": 1, 
 
     "label": "1 month" 
 
    }, { 
 
     "period": "YYYY", 
 
     "count": 1, 
 
     "label": "1 year" 
 
    }, { 
 
     "period": "YTD", 
 
     "label": "YTD" 
 
    }, { 
 
     "period": "MAX", 
 
     "label": "MAX" 
 
    }] 
 
    } 
 
});

#chartdiv { 
 
    width: 100%; 
 
    height: 500px; 
 
    font-size: 11px; 
 
}

<script src="//www.amcharts.com/lib/3/amcharts.js"></script> 
 
<script src="//www.amcharts.com/lib/3/serial.js"></script> 
 
<script src="//www.amcharts.com/lib/3/themes/light.js"></script> 
 
<script src="//www.amcharts.com/lib/3/amstock.js"></script> 
 

 
<div id="chartdiv"></div>

Что касается validateNow, если вы измените свойство в вашем объекте биржевой диаграммы, вам нужно вызвать validateNow для перерисовки с новыми настройками. validateData в основном используется при внесении изменений в ваш набор данных/dataProvider.

источник

2016-09-27 18:24:54 xorspark

ответ

Смежные вопросы