jquery - HTML displaying values in JavaScript "data" -

-

the following javascript code used display table data chart.

  <script type="text/javascript">         $(function () {             $('#container').highcharts({                 data: {                     table: 'datatable'                 },                 chart: {                     type: 'column'                 },                 title: {                     text: 'results'                 },                 yaxis: {                     allowdecimals: false,                     title: {                         text: 'units'                     }                 },                 tooltip: {                     formatter: function () {                         return '<b>' + this.series.name + '</b><br/>' +                             this.point.y + ' ' + this.point.name.tolowercase();                     }                 }             });         });     </script>

html code holds data:

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>  <table id="datatable">     <thead>         <tr>             <th></th>             <th>jane</th>             <th>john</th>         </tr>     </thead>     <tbody>         <tr>             <th>apples</th>             <td>3</td>             <td>4</td>         </tr>         <tr>             <th>pears</th>             <td>2</td>             <td>0</td>         </tr>     </tbody> </table>

i have following values in html:

<div id="name"> </div> <div id="age"></div>

"name" , "age" hold different values. how can implement values chart instead of data: (jane, john, apples,pears). possible?

http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/column-parsed/

that kind of how chart displaying atm. can put "name" , "age" on chart instead?

your question bit vague i'll try best help. i'm sure provide better answer if more information provided such as:

  • what data want show on chart?

  • what value want measured? example, measuring years?

  • measuring different elements of same person or same elements different people?

    • i'm assuming when stated want display "name" , "age" on chart instead of what's provided in example, want display names age being measuring value. if that's case here's came with.

    jsfiddle: javascript highchart example age measuring value

    html code 

    <div id="container" style="min-width: 310px; max-width: 800px; height: 400px; margin: 0 auto"></div>

    javascript code

    $(function () {     $('#container').highcharts({         chart: {             type: 'bar'         },         title: {             text: 'age of major life events'         },         subtitle: {             text: 'created by: <a href="http://www.rocketrisa.com">rocket risa</a>'         },         xaxis: {             categories: ['john', 'jane', 'jessica', 'jordan', 'jeri'],             title: {                 text: null             }         },         yaxis: {             min: 0,             title: {                 text: 'age (years)',                 align: 'high'             },             labels: {                 overflow: 'justify'             }         },         tooltip: {             valuesuffix: ' years'         },         plotoptions: {             bar: {                 datalabels: {                     enabled: true                 }             }         },         legend: {             layout: 'vertical',             align: 'right',             verticalalign: 'top',             x: -40,             y: 80,             floating: true,             borderwidth: 1,             backgroundcolor: ((highcharts.theme && highcharts.theme.legendbackgroundcolor) || '#ffffff'),             shadow: true         },         credits: {             enabled: false         },         series: [{             name: 'teen',             data: [15, 13, 18, 14, 17]         }, {             name: 'young adult',             data: [23, 28, 21, 25, 27]         }, {             name: 'middle age 30+',             data: [35, 46, 32, 64, 51]         }]     }); });

    Comments

    Post a Comment

    Popular posts from this blog

    html - Styling progress bar with inline style -

    -
    i trying set progress bar color red using inline style. need in way because have access <body> part of document. style need apply: progress { color: red } progress::-moz-progress-bar { background: red;} progress::-webkit-progress-value { background: red; } progress[aria-valuenow]:before { background: red; } i tried <progress style="background: red;"> incorrect effect, progress bar color turns blue red background. guide right direction desired style? thank in advance. here live example: https://jsfiddle.net/z36d3f6l/
    Read more

    java - Oracle Sql developer error: could not install some modules -

    -
    i have downloaded fresh copy of sqldeveloper ( sqldeveloper-4.1.3.20.78-no-jre ) oracle website. when unzip , lauch gui, keep getting following error message: warning - not install modules: dynamic module config - no module providing capability org.netbeans.netbinox found. my system: windows 7 32 bit hp probook. jdk 1.6 , 1.7, 1.8 available in java/jdk subdirectory. netbeans 8.0.2 installed finally got way out after dirty hours. extracted sqldeveloper zip in nested directory. i.e: e://a/b/c/sqldeveloper. starting sqldeveloper gui above directory threw erros. solution: go in c:\users**username**\appdata\roaming : delete sql developer , sqldeveloper folders extract sql developer zip in new non nested directory. i.e: e:// start , should work now reference: https://community.oracle.com/thread/3870680?start=0&tstart=0
    Read more

    Django REST Framework perform_create: You cannot call `.save()` after accessing `serializer.data` -

    -
    i have following viewset: class artistprofileviewset(viewsets.modelviewset): queryset = artistprofile.objects.all() serializer_class = artistprofileserializer def perform_create(self, serializer): if serializer.is_valid(): serializer.save() with following serializers: class simpleartisttrackserializer(serializers.hyperlinkedmodelserializer): class meta: model = artisttrack fields = (...my fields...) class artistprofileserializer(serializers.hyperlinkedmodelserializer): owners = userserializer(many=true, required=false) tracks = simpleartisttrackserializer(many=true, required=false) class meta: model = artistprofile fields = (...my fields...) i getting following error: assertionerror: cannot call `.save()` after accessing `serializer.data`.if need access data before committing database inspect 'serializer.validated_data' instead. i don't see editing serializer.data object. th
    Read more