https://forum.world.st/can-t-find-out-how-use-Javascript-libs-such-as-HighStock-tp4369643p4369707.html
there. Also are some JS errors shown in console?
> Hi
> I'm very new to JavaScript as well as Aida/Web.
> The task is to show chart in HighStock JavaScript on a page that represents
> an object that holds the data.
> The chart lib has several js files, namely, a "js/highchart.js",
> "/adapter/prototype-adapter.js", "/adapter/mootools.js" and
> "/modules/exporting.js" and some /themes/xyz.js
> In WebStyle I manually added methods for those JavaScript, after the
> examples found in WebStyle such as jQurery, including xyzResource and
> ensureXYZ etc.
> And I added lines to WebElement intending to add those JavaScript into the
> <head>.
> After this I used scriptAfter: to insert the code for charting. The code is
> just a copy of original example code.
> Well, it doesn't work.
> Any advises?
>
> Yours,
>
> JG
>
> P.S.
> Here are some code:
>
> viewChart
>
> | e |
> e := WebElement new.
> e ensureId.
> e addTextH1: 'highstock charts'.
> e addInputFieldAspect: #id for: self.
> e addButtonText: 'chart' action: #chart.
> e addBreak.
> e add: self chartElement.
> e addBreak.
> self style pageFrameWith: e title: 'charts'
>
>
> chartElement
>
> | e |
> e := WebElement new.
> e ensureId.
> (e app style)
> ensureJQuery;
> ensureHighStock;
> ensureDarkBlueThemes;
> ensureDarkGreenThemes;
> ensureGrayThemes;
> ensureGridThemes;
> ensureSkiesThemes.
> "ensurePrototypeAdapter;
> ensureMooltoolsAdapter;"
> "ensureExportingModule;"
> "ensurePrototype;"
> "ensureHighStockProduction;"
> e addTextSmall: '*Charts to be improved'.
> e addBreak.
> e scriptAfter: self chartScript.
> e update.
> ^e
>
> chartScript
>
> ^'$(function() {
> var seriesOptions = [],
> yAxisOptions = [],
> seriesCounter = 0,
> names = [''MSFT'', ''AAPL'', ''GOOG''],
> colors = Highcharts.getOptions().colors;
>
> $.each(names, function(i, name) {
>
> $.getJSON(''
http://www.highcharts.com/samples/data/jsonp.php?filename=''+> name.toLowerCase() +''-c.json&callback=?'', function(data) {
>
> seriesOptions[i] = {
> name: name,
> data: data
> };
>
> // As we''re loading the data asynchronously, we don''t know what order
> it will arrive. So
> // we keep a counter and create the chart when all the data is loaded.
> seriesCounter++;
>
> if (seriesCounter == names.length) {
> createChart();
> }
> });
> });
>
>
>
> // create the chart when all data is loaded
> function createChart() {
>
> chart = new Highcharts.StockChart({
> chart: {
> renderTo: ''container''
> },
>
> rangeSelector: {
> selected: 4
> },
>
> yAxis: {
> labels: {
> formatter: function() {
> return (this.value > 0 ? ''+'' : '''') + this.value + ''%'';
> }
> },
> plotLines: [{
> value: 0,
> width: 2,
> color: ''silver''
> }]
> },
>
> plotOptions: {
> series: {
> compare: ''percent''
> }
> },
>
> tooltip: {
> pointFormat: ''{series.name}: *{point.y}* ({point.change}%)<br/>'',
> yDecimals: 2
> },
>
> series: seriesOptions
> });
> }
>
> });'
>
>
>
> WebStyle>>ensureHighStock
> "ensure jQuery JavaScript call in header of the page"
>
> | page url headerValue |
> self highStockProduction. "to ensure it"
> self highStockProductionResource.
> page := self app context page.
> url := '/highstock.js'.
> headerValue := ' src="' , url
> , '" language="JavaScript" type="text/javascript"'.
> (page headers
> contains: [:each | each key = 'script' and: [each value = headerValue]])
> ifFalse: [page addHeader: 'script' value: headerValue]
>
> highStockProductionResource
> "WebStyle new highStockProductionResource"
>
> ^self resources at: #highStockProduction
> ifAbsentPut:
> [WebMethodResource
> fromMethod: #highStockProduction
> on: self
> contentType: 'text/javascript'
> preferedUrl: '/highstock.js'
> site: self site]
>
> highStockProduction
>
> ^'/*
> Highstock JS v1.1.0 (2011-12-14)
>
> (c) 2009-2011 Torstein H?nsi
>
> License: www.highcharts.com/license
> */
> (function(){function H(a,b){var c;a||(a={});for(c in b)a[c]=b[c];return
> a}function Ka(){for(var
> a=0,b=arguments,c=b.length,d={};a<c;a++)d[b[a++]]=b[a];return d}function
> N(a,b){return parseInt(a,b||10)}function Bb(a){return typeof
> a==="string"}function sb(a){return typeof a==="object"}function Ub(a){return
> typeof a==="number"}function Ib(a){return ta.log(a)/ta.LN10}function
> pc(a){return ta.pow(10,a)}function Jb(a,b){for(var
> c=a.length;c--;)if(a[c]===b){a.splice(c,1);break}}function z(a){return a!==
> B&&a!==null}function O(a,b,c){var
> ................................................... some more
> .................................. ....
> '
>
>
> -----
> 南無佛 南無法 南無僧
> --
> View this message in context:
http://forum.world.st/can-t-find-out-how-use-Javascript-libs-such-as-HighStock-tp4369643p4369643.html> Sent from the AIDA/Web mailing list archive at Nabble.com.
> _______________________________________________
> Aida mailing list
>
[hidden email]
>
http://lists.aidaweb.si/mailman/listinfo/aida