Click here to Skip to main content
15,887,083 members
Please Sign up or sign in to vote.
1.00/5 (1 vote)
See more:
I have an HTML file. In that we have a script tag related to bar charts. I want to replace that barchart's data value and label value to change the barcharts appearance. I want to do this with a C# console application. I have tried to do it using Html agility pack's replace function, but it's only editing strings. How to edit or replace values and labels?
Is there any way to achieve this using Html agility pack or any other way without using agility pack? (or) any dynamic function in javascript which will replace values by placing it in html?

What I have tried:

Below is the javascript snippet inside the HTML file:
JavaScript
script src="js/chart.js"></script>  /*chart.js code */
    <script>
               const samplechart = document.getElementById('samplechart ');
            var barChartData = {
                labels: ["Dec", "Jan", "Feb", "Mar", "Apr", "May"],/*have  to replace these labels*/
                datasets: [{
                    label: "Closed",
                    type: "bar",
                    data: [7, 8, 9, 12, 4, 3],/*have  to replace this data*/
                    backgroundColor: '#3f54b5'
                },
                {
                    label: "Open",
                    type: "bar",
                    data: [0, 2, 10, 1, 3, 2],/*have to replace this data*/
                    backgroundColor: '#8bc34a'

                }
             
            }
            new Chart(samplechart, {

                data: barChartData,
                borderWidth: 0,
                options: {
                    plugins: {
                        title: {
                            display: true,
                            text: 'sample cases',
                            color: "#000",
                            font: {
                                size: 24
                            }
                        }
                    },
               
            });
</Script>


Code for loading it using html agility pack and replacing its name only (only this works, but I want to replace labels: and data: of barcharts.)

JavaScript
HtmlDocument document2 = new HtmlDocument();
document2.Load(@"D:\Downloads\sample1.html");
         
HtmlNode[] nodes = document2.DocumentNode.SelectNodes("//script").ToArray();
nodes[1].InnerHtml = nodes[1].InnerHtml.Replace("Reportchart","Samplechart");
document2.Save(@"D:\Downloads\sample1.html");


I have an HTML file. In that we have a script tag related to bar charts. I want to replace that barchart's data value and label value to change the barcharts appearance. I want to do this with a C#/ WPF/console application. I have tried to do it using Html agility pack's replace function, but it's only editing strings. How to edit or replace values and labels?

Below is the javascript snippet inside the HTML file:
JavaScript
script src="js/chart.js"></script>  /*chart.js code */
    <script>
               const samplechart = document.getElementById('samplechart ');
            var barChartData = {
                labels: ["Dec", "Jan", "Feb", "Mar", "Apr", "May"],/*have  to replace these labels*/
                datasets: [{
                    label: "Closed",
                    type: "bar",
                    data: [7, 8, 9, 12, 4, 3],/*have  to replace this data*/
                    backgroundColor: '#3f54b5'
                },
                {
                    label: "Open",
                    type: "bar",
                    data: [0, 2, 10, 1, 3, 2],/*have to replace this data*/
                    backgroundColor: '#8bc34a'

                }
             
            }
            new Chart(samplechart, {

                data: barChartData,
                borderWidth: 0,
                options: {
                    plugins: {
                        title: {
                            display: true,
                            text: 'sample cases',
                            color: "#000",
                            font: {
                                size: 24
                            }
                        }
                    },
               
            });
</Script;

Code for loading it using html agility pack and replacing its name only (only this works, but I want to replace labels: and data: of barcharts.)
JavaScript
HtmlDocument document2 = new HtmlDocument();
document2.Load(@"D:\Downloads\sample1.html");
         
HtmlNode[] nodes = document2.DocumentNode.SelectNodes("//script").ToArray();
nodes[1].InnerHtml = nodes[1].InnerHtml.Replace("Reportchart","Samplechart");
document2.Save(@"D:\Downloads\sample1.html");

Is there any way to achieve this using Html agility pack or any other way without using agility pack? (or) any dynamic function in javascript which will replace values by placing it in html?
Posted
Updated 17-Jul-23 4:40am
v3
Comments
Dave Kreskowiak 17-Jul-23 13:49pm    
You have a problem with doing this. Just replacing the code in the page doesn't execute the code. Your changes to the data won't take effect unless you can re-execute the code you changed.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900