|
| Inicio → WINDEV 2025 → Javascript AMCharts dans champ HTML en mode IE11 ou webbrowser |
| Javascript AMCharts dans champ HTML en mode IE11 ou webbrowser |
| Iniciado por Francois, 02,nov. 2019 15:48 - 1 respuesta |
| |
| | | |
|
| |
Miembro registrado
72 mensajes |
|
| Publicado el 02,noviembre 2019 - 15:48 |
Bonjour,
Version utilisée: Windev 24 77f (donc la dernière)
J'essaie d'utiliser la super librairie graphique AMCharts, mais hélas avec un succès mitigé.
Les graphiques s'affichent mais tout ce qui est interactif (survol souris, clic,...) ne fonctionne pas.
Oui, j'ai activé le mode IE11 avec les réglages dans la base de registre, avec la valeur 0 (dernière version IE)
Oui, les champs sont bien actifs.
Le résultat (tout en code HTML 5) devrait être le suivant:
https://codepen.io/francoisG/pen/yLLppjP
Mais lorsque j'insère ce même code html sous Windev, les bulles d'aide de survol ne s'affichent pas, et et le scroll en haut est inactif.
J'ai tout essayé: champ HTML (avec fonctions Javascript activées bien sur), champ dotnet webbrowser, champ activex Microsoft Web Browser: résultats identiques.
Le code html est le suivant:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>amCharts V4 Example
</title>
<style type="text/css"> body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; overflow: hidden; margin: 0; } #chartdiv { width: 100%; height: 100vh; }
</style>
</head>
<body>
<div id="chartdiv">
</div>
<script src="https://www.amcharts.com/lib/4/core.js"></script>
<script src="https://www.amcharts.com/lib/4/charts.js"></script>
<script src="https://www.amcharts.com/lib/4/themes/animated.js"></script>
<script type="text/javascript">
// Themes begin
am4core.useTheme(am4themes_animated);
// Themes end
var chart = am4core.create("chartdiv", am4charts.XYChart);
chart.paddingRight = 20;
chart.dateFormatter.inputDateFormat = "yyyy-MM-dd";
var dateAxis = chart.xAxes.push(new am4charts.DateAxis());
dateAxis.renderer.grid.template.location = 0;
var valueAxis = chart.yAxes.push(new am4charts.ValueAxis());
valueAxis.tooltip.disabled = true;
var series = chart.series.push(new am4charts.CandlestickSeries());
series.dataFields.dateX = "date";
series.dataFields.valueY = "close";
series.dataFields.openValueY = "open";
series.dataFields.lowValueY = "low";
series.dataFields.highValueY = "high";
series.simplifiedProcessing = true;
series.tooltipText = "Open:${openValueY.value}\nLow:${lowValueY.value}\nHigh:${highValueY.value}\nClose:${valueY.value}";
chart.cursor = new am4charts.XYCursor();
// a separate series for scrollbar
var lineSeries = chart.series.push(new am4charts.LineSeries());
lineSeries.dataFields.dateX = "date";
lineSeries.dataFields.valueY = "close";
// need to set on default state, as initially series is "show"
lineSeries.defaultState.properties.visible = false;
// hide from legend too (in case there is one)
lineSeries.hiddenInLegend = true;
lineSeries.fillOpacity = 0.5;
lineSeries.strokeOpacity = 0.5;
var scrollbarX = new am4charts.XYChartScrollbar();
scrollbarX.series.push(lineSeries);
chart.scrollbarX = scrollbarX;
chart.data = [ {
"date": "2011-08-28",
"open": "129.88",
"high": "134.18",
"low": "129.54",
"close": "134.08"
}, {
"date": "2011-08-29",
"open": "132.67",
"high": "138.25",
"low": "132.30",
"close": "136.25"
}, {
"date": "2011-08-30",
"open": "139.49",
"high": "139.65",
"low": "137.41",
"close": "138.48"
}, {
"date": "2011-09-03",
"open": "139.94",
"high": "145.73",
"low": "139.84",
"close": "144.16"
}, {
"date": "2011-09-04",
"open": "144.97",
"high": "145.84",
"low": "136.10",
"close": "136.76"
}, {
"date": "2011-09-05",
"open": "135.56",
"high": "137.57",
"low": "132.71",
"close": "135.01"
}];
</script>
</body>
</html> |
| |
| |
| | | |
|
| | |
| |
Miembro registrado
72 mensajes |
|
| Publicado el 05,abril 2020 - 13:54 |
Je me réponds: seul un navigateur intégré à base Chromium fonctionne avec AMCharts, du type cefsharp
--
www.ibfolio.com |
| |
| |
| | | |
|
| | | | |
| | |
|